Шаблон:CollapsibleMenu: различия между версиями
Pok (обсуждение | вклад) мНет описания правки |
Pok (обсуждение | вклад) Нет описания правки |
||
| Строка 3: | Строка 3: | ||
</div>}}<!-- | </div>}}<!-- | ||
--><div class="customCSS" style="display:none"> | --><div class="customCSS" style="display:none"> | ||
/* Основные стили для меню */ | |||
.mw-parser-output *:has(.сollapsible-menu) { | .mw-parser-output *:has(.сollapsible-menu) { | ||
position: relative; | position: relative; | ||
| Строка 9: | Строка 11: | ||
.сollapsible-menu { | .сollapsible-menu { | ||
position: absolute !important; | position: absolute !important; | ||
top: -4px; | |||
right: -2px; | right: -2px; | ||
display: grid; | |||
align-content: center; | align-content: center; | ||
z-index: 100; | |||
} | } | ||
/* Контейнер выпадающего меню */ | |||
.сollapsible-menu__content { | .сollapsible-menu__content { | ||
position: absolute !important; | |||
top: 18px; | |||
right: 0; | |||
display: grid; | |||
gap: 4px; | |||
width: 17em; | |||
min-width: 200px; | |||
max-height: 300px; | |||
padding: 6px; | padding: 6px; | ||
border-radius: 0; | border-radius: 0; | ||
border: 2px solid #31313b; | border: 2px solid #31313b; | ||
border-top: 2px solid #474757; | |||
background-color: #24242a; | background-color: #24242a; | ||
box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.3), 0 4px 8px rgba(0, 0, 0, 0.3); | |||
overflow: auto; | overflow: auto; | ||
overflow-x: hidden; | |||
} | } | ||
/* Тоггл кнопка */ | |||
.сollapsible-menu .mw-collapsible-toggle { | .сollapsible-menu .mw-collapsible-toggle { | ||
position: relative; | position: relative; | ||
top: 0; | |||
right: 0; | |||
text-align: right; | text-align: right; | ||
font-size: 12px; | |||
font-weight: bold; | |||
color: #595965; | color: #595965; | ||
transition: all 0.05s; | transition: all 0.05s; | ||
} | } | ||
.сollapsible-menu .mw-collapsible-toggle | .сollapsible-menu .mw-collapsible-toggle:hover { | ||
color: #6c6c7d; | color: #6c6c7d; | ||
} | } | ||
.сollapsible-menu .mw-collapsible-toggle | .сollapsible-menu .mw-collapsible-toggle-expanded { | ||
color: #6c6c7d; | color: #6c6c7d; | ||
} | } | ||
| Строка 62: | Строка 76: | ||
content: none !important; | content: none !important; | ||
} | } | ||
.сollapsible-menu .mw-collapsible-text { | .сollapsible-menu .mw-collapsible-text { | ||
display: none; | display: none; | ||
} | } | ||
/* Адаптивность */ | |||
@media (max-width: 800px) { | @media (max-width: 800px) { | ||
.сollapsible-menu__content { | .сollapsible-menu__content { | ||
/* Можно добавить стили для мобильных устройств */ | |||
} | } | ||
} | } | ||
</div> | </div> | ||