|
|
| (не показано 17 промежуточных версий этого же участника) |
| Строка 1: |
Строка 1: |
| {{#if: {{{| 1}}}|<div class="z-index-position сollapsible-menu mw-collapsible mw-collapsed" style="--color:{{{color|#595965}}}> | | <div class="customCSS" style="display:none"> |
| | .mw-parser-output *:has(.сollapsible-menu) { position: relative; } |
| | </div>{{#if: {{{ 1|}}}|<div class="z-index-position сollapsible-menu mw-collapsible mw-collapsed" style="--color:{{{color|#595965}}}> |
| <div class="сollapsible-menu__content mw-collapsible-content no-margin-edges short-scrollbar">{{{1|}}}</div> | | <div class="сollapsible-menu__content mw-collapsible-content no-margin-edges short-scrollbar">{{{1|}}}</div> |
| </div>}}<!-- | | </div>}}<!-- |
| --><div class="customCSS" style="display:none">
| |
| /* Основные стили для меню */
| |
|
| |
|
| .mw-parser-output *:has(.сollapsible-menu) {
| | --><templatestyles src="CollapsibleMenu/styles.css" /> |
| position: relative;
| |
| }
| |
| | |
| .сollapsible-menu {
| |
| position: absolute !important;
| |
| top: -4px;
| |
| right: -2px;
| |
|
| |
| display: grid;
| |
| align-content: center;
| |
|
| |
| z-index: 100;
| |
| }
| |
| | |
| /* Контейнер выпадающего меню */
| |
| | |
| .сollapsible-menu__content {
| |
| position: absolute !important;
| |
| top: 18px;
| |
| right: 0;
| |
|
| |
| display: grid;
| |
| gap: 4px;
| |
|
| |
| width: clamp(16em, 50vw, 18em);
| |
| min-width: 200px;
| |
| max-height: 300px;
| |
|
| |
| padding: 6px;
| |
| border-radius: 0;
| |
| border: 2px solid #31313b;
| |
| border-top: 2px solid #474757;
| |
|
| |
| 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-x: hidden;
| |
| }
| |
| | |
| /* Тоггл кнопка */
| |
| | |
| .сollapsible-menu .mw-collapsible-toggle {
| |
| position: relative;
| |
| top: 0;
| |
| right: 0;
| |
|
| |
| text-align: right;
| |
| font-size: 12px;
| |
| font-weight: bold;
| |
| color: var(--color);
| |
|
| |
| transition: all 0.05s;
| |
| }
| |
| | |
| .сollapsible-menu .mw-collapsible-toggle:hover {
| |
| filter: brightness(125%);
| |
| }
| |
| | |
| .сollapsible-menu .mw-collapsible-toggle-expanded {
| |
| filter: brightness(125%);
| |
| }
| |
| | |
| .сollapsible-menu .mw-collapsible-toggle-default:before {
| |
| content: '▽';
| |
| }
| |
| | |
| .сollapsible-menu .mw-collapsible-toggle-default:after {
| |
| content: none !important;
| |
| }
| |
| | |
| .сollapsible-menu .mw-collapsible-text {
| |
| display: none;
| |
| }
| |
| | |
| /* Адаптивность */ | |
| | |
| @media (max-width: 800px) {
| |
| .сollapsible-menu .mw-collapsible-toggle {
| |
| font-size: 15px;
| |
| }
| |
| }
| |
| </div>
| |
.mw-parser-output *:has(.сollapsible-menu) { position: relative; }
