NetsPro/Reflex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

багфикс

Browse Source
This commit is contained in:
Professional 2025-05-23 20:28:18 +07:00
parent d229e3d0ea
commit e601e66d35
2 changed files with 17 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/App.vue
View File

@ -232,6 +232,7 @@ body {
background: white; background: white;
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
z-index: 1000; z-index: 1000;
padding-bottom: env(safe-area-inset-bottom, 0px); /* Используем env напрямую для поддержки iOS */
} }
.nav-item { .nav-item {
@ -245,66 +246,24 @@ body {
transition: all 0.2s ease; transition: all 0.2s ease;
padding: 4px 0; padding: 4px 0;
position: relative; position: relative;
} /* Не растягиваем сами иконки/текст, а только добавляем нижний отступ */
padding-bottom: calc(env(safe-area-inset-bottom, 0px) / 3);
.nav-icon {
position: relative;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 3px;
height: 28px;
}
.nav-item i {
font-size: 1.5rem;
transition: transform 0.2s ease;
}
.nav-item span {
font-size: 0.7rem;
font-weight: 500;
}
.nav-item.active {
color: #667eea;
}
.nav-item.active i {
transform: scale(1.15);
}
/* Индикатор непрочитанных сообщений */
.unread-badge {
position: absolute;
top: -5px;
right: -8px;
background-color: #ff6b6b;
color: white;
font-size: 0.6rem;
border-radius: 50%;
min-width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
box-shadow: 0 2px 5px rgba(255, 107, 107, 0.3);
border: 1px solid white;
} }
/* CSS переменные для динамической настройки */ /* CSS переменные для динамической настройки */
:root { :root {
--nav-height: 60px; --nav-height: 60px;
--header-height: 56px; --header-height: 56px;
--safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);
} }
/* Учет Safe Area на устройствах с вырезами (iPhone X и новее) */ /* Учет Safe Area на устройствах с вырезами (iPhone X и новее) */
@supports (padding-bottom: env(safe-area-inset-bottom)) { @supports (padding-bottom: env(safe-area-inset-bottom)) {
.mobile-nav { .mobile-nav {
height: calc(var(--nav-height) + var(--safe-area-inset-bottom)); height: calc(var(--nav-height) + env(safe-area-inset-bottom, 0px));
padding-bottom: var(--safe-area-inset-bottom); }
.app-content {
height: calc(100% - var(--nav-height) - env(safe-area-inset-bottom, 0px));
} }
} }

15
src/views/ChatView.vue
View File

@ -698,9 +698,11 @@ const handleClickOutsideContextMenu = (event) => {
border-bottom: 1px solid rgba(255, 255, 255, 0.2); border-bottom: 1px solid rgba(255, 255, 255, 0.2);
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
color: white; color: white;
position: sticky; position: fixed; /* Меняем со sticky на fixed */
top: 0; top: 0;
z-index: 10; left: 0;
right: 0;
z-index: 100; /* Увеличиваем z-index для правильного отображения */
flex-shrink: 0; flex-shrink: 0;
height: var(--header-height, 56px); height: var(--header-height, 56px);
} }
@ -815,7 +817,8 @@ const handleClickOutsideContextMenu = (event) => {
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding-bottom: calc(70px + var(--nav-height, 60px)); /* Добавляем отступ внизу для поля ввода и навигационной панели */ padding-top: var(--header-height, 56px); /* Добавляем отступ сверху для фиксированного хедера */
padding-bottom: calc(70px + var(--nav-height, 60px)); /* Отступ снизу для блока ввода и навигационной панели */
} }
/* Состояния загрузки и ошибки */ /* Состояния загрузки и ошибки */
@ -1066,11 +1069,11 @@ const handleClickOutsideContextMenu = (event) => {
background: white; background: white;
border-top: 1px solid rgba(0, 0, 0, 0.1); border-top: 1px solid rgba(0, 0, 0, 0.1);
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
position: fixed; /* Меняем со sticky на fixed для надежной фиксации */ position: fixed;
bottom: 0; bottom: var(--nav-height, 60px); /* Размещаем прямо над навигационными табами */
left: 0; left: 0;
right: 0; right: 0;
z-index: 100; /* Увеличиваем z-index, чтобы блок был над всеми элементами */ z-index: 100;
max-width: 800px; max-width: 800px;
margin: 0 auto; margin: 0 auto;
width: 100%; width: 100%;