/
GEOSHEV
/
StudLab
Обзор
Документация
Войти
/
GEOSHEV
/
StudLab
Код
Запросы
1
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
develop
src/components/header/header.css
76 строк
2 KB
George
Обновил: Линтер по всем файлам
21 мар 2025, 14:25
21 мар 2025, 14:25
2b503d4
Код
Авторство
О чём код?
.header { padding: 8px; background-color: #272a38; border-radius: 4px 4px 0 0; margin: 25px 30px 6px; justify-content: space-between; display: flex; align-items: center; column-gap: 20px; } .header-logo { width: 20px; height: 20px; margin-left: 15px; } .header-logo-menu { display: flex; align-items: center; column-gap: 18px; } .header-buttons { display: flex; justify-content: space-between; flex-grow: 1; width: 80%; } .header-screen-button { background-color: #303549; color: white; padding: 10px 15px; border: none; border-radius: 4px; font-size: 13px; cursor: pointer; transition: background 0.3s ease; flex: 1; /* Кнопки будут адаптивно заполнять пространство */ max-width: 200px; /* Ограничение ширины кнопки */ text-align: center; } .header-buttons > *:not(:last-child) { margin-right: auto; /* Раздвигаем кнопки на максимальное расстояние */ } @media (max-width: 1079px) { .header-buttons { justify-content: space-around; } } @media (max-width: 768px) { .header-buttons { flex-direction: column; align-items: center; gap: 10px; } .header-screen-button { width: 100%; max-width: 250px; } } .header-span { font-family: Roboto, sans-serif; font-size: 14px; } .header-button:hover, .header-screen-button:hover { background-color: #3e3e50; }