MediaWiki:Citizen.css: различия между версиями
Askell (обсуждение | вклад) Нет описания правки |
Askell (обсуждение | вклад) Нет описания правки |
||
(не показано 8 промежуточных версий этого же участника) | |||
Строка 7: | Строка 7: | ||
} | } | ||
#mw-content-text { | #mw-content-text { | ||
Строка 213: | Строка 159: | ||
.desktop-hide { | .desktop-hide { | ||
display:none; | |||
} | } | ||
Строка 225: | Строка 171: | ||
.dropdown-container { | .dropdown-container { | ||
display: flex; | display: flex; | ||
flex-direction: column; | justify-content: space-between; | ||
} | |||
.menu-column { | |||
display: flex; | |||
flex-direction: column; | |||
gap: 8px; /* расстояние между пунктами в колонке */ | |||
flex: 1; /* колонки равной ширины */ | |||
min-width: 220px; /* при желании минимальная ширина */ | |||
} | } | ||
Строка 244: | Строка 196: | ||
cursor: pointer; | cursor: pointer; | ||
border-radius: 5px; | border-radius: 5px; | ||
width: 100%; /* чтобы кнопка занимала ширину колонки */ | |||
box-sizing: border-box; | |||
text-align: center; | |||
} | } | ||
Строка 260: | Строка 213: | ||
/* Стиль для ссылок внутри списка */ | /* Стиль для ссылок внутри списка */ | ||
.dropdown-content a { | .dropdown-content a , | ||
.dropdown-content h4 { | |||
color: black; | color: black; | ||
text-aling: center; | text-aling: center; | ||
text-decoration: none; | text-decoration: none; | ||
display: block; | display: block; | ||
Строка 273: | Строка 226: | ||
background-color: #f1f1f1; | background-color: #f1f1f1; | ||
} | } | ||
/* Показываем список при клике (нужен JS) */ | /* Показываем список при клике (нужен JS) */ | ||
Строка 281: | Строка 233: | ||
} | } | ||
/* Анимация сдвига только в рамках своей колонки */ | |||
.menu-column .dropdown.active ~ .dropdown { | |||
transform: translateY(100%); | |||
transition: transform 0.3s ease-in-out; | |||
} | |||
/* Responsive: на узких экранах колонки идут друг под другом */ | |||
max-width: 800px { | |||
.dropdown-container { | |||
flex-direction: column; | |||
gap: 10px; | |||
max-width: 95%; | |||
} | |||
.menu-column { | |||
min-width: 0; | |||
} | |||
.dropbtn { font-size: 18px; } | |||
} | |||
/* Исправление отображения текста */ | /* Исправление отображения текста */ | ||
Строка 711: | Строка 681: | ||
.nav-link { | .nav-link { | ||
color: #000000; | color: #000000; |