From 42efa2b370e7afd91afe18b17449083089abacde Mon Sep 17 00:00:00 2001
From: Timi <imyeyu6@qq.com>
Date: Tue, 14 Apr 2026 14:38:48 +0800
Subject: [PATCH] fix iOS t-navbar style

---
 src/components/PageTransition.vue |  2 +-
 src/layout/MainLayout.vue         | 27 +++++++++++++++++----------
 2 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/src/components/PageTransition.vue b/src/components/PageTransition.vue
index f046c2a..29d1273 100644
--- a/src/components/PageTransition.vue
+++ b/src/components/PageTransition.vue
@@ -102,8 +102,8 @@ onUnmounted(() => {
 	width: 100%;
 	height: 100%;
 	display: grid;
-	min-height: 100%;
 	position: relative;
+	min-height: 100%;
 	overflow-x: hidden;
 
 	.pages {
diff --git a/src/layout/MainLayout.vue b/src/layout/MainLayout.vue
index 9e2dc26..372fadf 100644
--- a/src/layout/MainLayout.vue
+++ b/src/layout/MainLayout.vue
@@ -184,6 +184,7 @@ const contentHeight = computed(() => {
 .main-layout {
 	--app-nav-offset: v-bind(topPadding);
 	--safe-top: env(safe-area-inset-top, 0px);
+
 	box-sizing: border-box;
 	isolation: isolate;
 	position: relative;
@@ -192,6 +193,8 @@ const contentHeight = computed(() => {
 	transition: padding-bottom .24s ease;
 
 	.nav-bar {
+		--td-navbar-padding-top: var(--safe-top);
+
 		top: 0;
 		left: 0;
 		right: 0;
@@ -199,16 +202,20 @@ const contentHeight = computed(() => {
 		position: fixed;
 
 		:deep(.t-navbar) {
-			z-index: 1;
-			position: relative;
-		}
 
-		:deep(.t-navbar__content) {
-			color: var(--tui-black, #000);
-			border-bottom: 1px solid rgba(0, 0, 0, .1);
-			background: rgba(250, 250, 250, .8);
-			backdrop-filter: blur(10px);
-			-webkit-backdrop-filter: blur(10px);
+			&__content {
+				color: var(--tui-black, #000);
+				border-bottom: 1px solid rgba(0, 0, 0, .1);
+				background: rgba(250, 250, 250, .8);
+				backdrop-filter: blur(10px);
+				-webkit-backdrop-filter: blur(10px);
+			}
+
+			&__left,
+			&__right {
+				top: var(----td-navbar-padding-top);
+				height: var(--td-navbar-height, 48px);
+			}
 		}
 
 		.nav-extra {
@@ -237,9 +244,9 @@ const contentHeight = computed(() => {
 	}
 
 	.tab-bar {
-		bottom: 1rem;
 		left: 1rem;
 		right: 1rem;
+		bottom: 1rem;
 		position: fixed;
 		z-index: 1000;
 		opacity: 1;