From 4001ba16350e08475dc43959d1c75db65f918ae3 Mon Sep 17 00:00:00 2001
From: Professional <Professional@DENIIS-PC>
Date: Fri, 23 May 2025 20:37:35 +0700
Subject: [PATCH] =?UTF-8?q?=D1=84=D0=B8=D0=BA=D1=81=20=D1=82=D0=B0=D0=B1?=
 =?UTF-8?q?=D0=BE=D0=B2=20=D0=B4=D0=BB=D1=8F=20IOS?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 45 +++++++++++++++++++++++++++++++++------------
 1 file changed, 33 insertions(+), 12 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index f10e033..0612375 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -15,7 +15,7 @@
         <div class="nav-icon">
           <i class="bi-search"></i>
         </div>
-        <span>Поиск</span>
+        <span class="nav-text">Поиск</span>
       </router-link>
       <router-link to="/chats" class="nav-item" active-class="active">
         <div class="nav-icon">
@@ -24,13 +24,13 @@
             {{ totalUnread < 100 ? totalUnread : '99+' }}
           </span>
         </div>
-        <span>Чаты</span>
+        <span class="nav-text">Чаты</span>
       </router-link>
       <router-link to="/profile" class="nav-item" active-class="active">
         <div class="nav-icon">
           <i class="bi-person"></i>
         </div>
-        <span>Профиль</span>
+        <span class="nav-text">Профиль</span>
       </router-link>
     </nav>
   </div>
@@ -239,14 +239,33 @@ body {
   display: flex;
   flex-direction: column;
   align-items: center;
-  justify-content: center; /* Центрируем содержимое по вертикали */
+  justify-content: center;
   text-decoration: none;
   color: #6c757d;
   transition: all 0.2s ease;
-  padding: 4px 0;
+  /* Удаляем отступы, они будут применляться по-другому */
+  padding: 0;
   position: relative;
 }
 
+.nav-icon {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 3px;
+  height: 28px;
+}
+
+/* Оборачиваем текст для лучшего управления */
+.nav-text {
+  font-size: 0.7rem;
+  font-weight: 500;
+  /* Критическое изменение: добавляем отступ чтобы поднять текст выше home indicator */
+  transform: translateY(-10px);
+  display: block;
+}
+
 /* CSS переменные для динамической настройки */
 :root {
   --nav-height: 60px;
@@ -254,26 +273,28 @@ body {
   --safe-area-bottom: 0px;
 }
 
-/* Специальная поддержка для устройств с вырезом (iPhone X и новее) */
+/* Обновленная поддержка для устройств с вырезом (iPhone X и новее) */
 @supports (padding: env(safe-area-inset-bottom)) {
   :root {
     --safe-area-bottom: env(safe-area-inset-bottom, 0px);
   }
   
-  /* Новый подход: делаем навбар выше и поднимаем содержимое вверх */
   .mobile-nav {
     height: calc(var(--nav-height) + var(--safe-area-bottom));
-    padding-bottom: var(--safe-area-bottom); /* Добавляем отступ снизу */
+    padding-bottom: var(--safe-area-bottom);
   }
   
-  /* Контейнер для выравнивания элементов навигации */
   .nav-item {
-    /* Оставляем центрирование, но элементы будут в верхней части увеличенного навбара */
-    transform: translateY(-10px); /* Поднимаем элементы повыше от home indicator */
+    /* Элемент занимает всю высоту панели, включая safe area */
+    height: 100%;
+    /* Добавляем флекс для размещения иконки и текста */
+    display: flex;
+    flex-direction: column;
     justify-content: flex-start;
-    padding-top: 10px; /* Увеличиваем верхний отступ */
+    padding-top: 8px;
   }
   
+  /* Важное изменение - переместить этот селектор за пределы @supports */
   .app-content {
     height: calc(100% - var(--nav-height) - var(--safe-area-bottom));
   }