MediaWiki:Citizen.css: различия между версиями
Askell (обсуждение | вклад) Нет описания правки Метки: ручная отмена отменено |
Askell (обсуждение | вклад) Нет описания правки Метка: отменено |
||
| Строка 1: | Строка 1: | ||
/* Размещённый здесь CSS-код будет загружаться для пользователей, использующих тему оформления Citizen */ | /* Размещённый здесь CSS-код будет загружаться для пользователей, использующих тему оформления Citizen */ | ||
@import url('https://fonts.googleapis.com/css?family=Merriweather|Cormorant Infant|PT Mono|Neucha|MedievalSharp|Spectral SC|Kurale|El Messiri|Ledger'); | @import url('https://fonts.googleapis.com/css?family=Merriweather|Cormorant Infant|PT Mono|Neucha|MedievalSharp|Spectral SC|Kurale|El Messiri|Ledger'); | ||
.button { | |||
display: grid; | |||
place-items: center; | |||
width: var(--header-button-size); | |||
height: var(--header-button-size); | |||
border-radius: var(--border-radius-base); | |||
contain: strict; | |||
} | |||
/* Контейнер выпадающего списка */ | |||
.dropdown { | |||
position: relative; | |||
display: inline-block; | |||
} | |||
/* Кнопка для открытия списка */ | |||
.dropbtn { | |||
background-color: #0078d7; /* Цвет кнопки (можно изменить) */ | |||
color: white; | |||
padding: 10px 15px; | |||
font-size: 16px; | |||
border: none; | |||
cursor: pointer; | |||
border-radius: 5px; | |||
} | |||
/* Контейнер списка (изначально скрыт) */ | |||
.dropdown-content { | |||
display: none; | |||
position: absolute; | |||
background-color: white; | |||
min-width: 160px; | |||
box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2); | |||
border-radius: 5px; | |||
z-index: 1000; | |||
} | |||
/* Стиль для ссылок внутри списка */ | |||
.dropdown-content a { | |||
color: black; | |||
padding: 10px 15px; | |||
text-decoration: none; | |||
display: block; | |||
} | |||
/* Эффект наведения на ссылки */ | |||
.dropdown-content a:hover { | |||
background-color: #f1f1f1; | |||
} | |||
/* Показываем список при наведении */ | |||
.dropdown:hover .dropdown-content { | |||
display: block; | |||
} | |||
/* Показываем список при клике (нужен JS) */ | |||
.dropdown.active .dropdown-content { | |||
display: block; | |||
} | |||
/* Исправление отображения текста */ | /* Исправление отображения текста */ | ||