diff --git a/src/components/layout/Layout.module.css b/src/components/layout/Layout.module.css index 6d01028..ae120e3 100644 --- a/src/components/layout/Layout.module.css +++ b/src/components/layout/Layout.module.css @@ -8,6 +8,7 @@ overflow: hidden; position: relative; /* Добавляем относительное позиционирование */ height: 100%; /* Устанавливаем высоту 100% */ + overscroll-behavior: none; /* Предотвращает "резиновый" эффект на iOS */ } .main { @@ -18,6 +19,7 @@ overflow-y: auto; /* Разрешаем скроллинг только для основного контента */ -webkit-overflow-scrolling: touch; /* Улучшаем инерционный скроллинг на iOS */ padding-top: 0px; /* Уменьшаем отступ до 20px */ + overscroll-behavior: contain; /* Ограничивает эффект скролла только этим элементом */ } .container { diff --git a/src/components/shared/ImageViewer.module.css b/src/components/shared/ImageViewer.module.css index d808722..1f3af71 100644 --- a/src/components/shared/ImageViewer.module.css +++ b/src/components/shared/ImageViewer.module.css @@ -8,7 +8,7 @@ display: flex; justify-content: center; align-items: center; - z-index: 1000; + z-index: 9999; /* Значительно увеличиваем z-index, чтобы отображалось поверх хедера и футера */ } .content { @@ -42,7 +42,7 @@ display: flex; justify-content: center; align-items: center; - z-index: 1001; + z-index: 10000; /* Увеличиваем z-index еще больше, чтобы кнопка была поверх фона */ } /* Медиа-запрос для мобильных устройств */ diff --git a/src/index.css b/src/index.css index b884960..89b0cb5 100644 --- a/src/index.css +++ b/src/index.css @@ -29,7 +29,7 @@ #root { min-height: 100vh; background-color: var(--color-background); - overflow-y: auto; + overflow: hidden; /* Изменено с overflow-y: auto */ overflow-x: hidden; position: absolute; top: 0; @@ -41,6 +41,10 @@ /* Базовые стили */ html { -webkit-tap-highlight-color: transparent; + overflow: hidden; /* Изменено с overflow-y: scroll */ + scrollbar-width: none; /* Firefox */ + -ms-overflow-style: none; /* IE and Edge */ + overscroll-behavior: none; /* Предотвращает "резиновый" эффект на iOS */ } body { @@ -65,12 +69,7 @@ body { -webkit-tap-highlight-color: transparent; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -} - -html { - overflow-y: scroll; - scrollbar-width: none; /* Firefox */ - -ms-overflow-style: none; /* IE and Edge */ + overscroll-behavior: none; /* Предотвращает "резиновый" эффект на iOS */ } html::-webkit-scrollbar {