/
Stameskaaa
/
Client
Обзор
Документация
Войти
/
Stameskaaa
/
Client
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
src/components/fullscreen/styles.module.scss
85 строк
1 KB
Stameskaaa
frist commit
19 июн 2024, 15:02
19 июн 2024, 15:02
1cf848d
Код
Авторство
О чём код?
.container { width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; z-index: 1; display: flex; justify-content: center; align-items: center; } .container::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--color-lighterdark); /* Полупрозрачный темный фон */ opacity: 0.7; z-index: -1; } .inner-container { width: 90%; height: 80%; background-color: var(--color-dark); position: relative; display: flex; justify-content: center; align-items: center; border-radius: 10px; overflow: hidden; } .photo { max-width: 80%; max-height: 70%; object-fit: contain; } .inactive { color: var(--color-lighterdark); } .active { color: var(--color-accent); } .button { background-color: transparent; border: none; height: 100%; width: 70px; &:hover { background-color: rgba(255, 255, 255, 0.144); cursor: pointer; } display: flex; justify-content: center; align-items: center; font-size: 2em; @media (max-width: 500px) { font-size: 1.3em; width: 30px; } } .button.left { border-radius: 10px 0 0 10px; left: 10px; margin-right: auto; } .button.right { border-radius: 0 10px 10px 0; margin-left: auto; right: 10px; } .photo_count { position: absolute; padding: 4px; bottom: 0; right: 0; margin-right: 20px; }