Шаблон:SlideMenu: различия между версиями
Материал из Space Station 14 Вики
Pok (обсуждение | вклад) мНет описания правки |
Pok (обсуждение | вклад) мНет описания правки |
||
(не показано 38 промежуточных версий 2 участников) | |||
Строка 2: | Строка 2: | ||
| | | | ||
{{#ifeq: {{{1}}} | overlay | {{#ifeq: {{{1}}} | overlay | ||
| | |<!-- Если параметр overlay --> | ||
<div class="slide__overlay--page z_index_position" > | |||
<div class="slide__overlay--container mw-collapsible mw-collapsed"style="margin:{{{margin|4px 2px}}};text-align:{{{text-align|left}}}; | |||
padding: {{{padding|clamp(8px, 1vw, 12px)}}}; | padding: {{{padding|clamp(8px, 1vw, 12px)}}}; | ||
background: {{{background-color|#27272e}}}; | background: {{{background-color|#27272e}}}; | ||
border | border: {{{border-size|0.25em}}} solid {{{border-color|#4c4c61}}}; | ||
border: | border-radius: {{{border-radius|0.3em}}}; | ||
"> | |||
<div class="slide__overlay--title"style="color:{{{color}}};font-size:{{{font-size|1em}}};><span style="white-space:nowrap;">{{{title}}}</span></div> | |||
<div class="slide__overlay--content mw-collapsible-content">{{{content}}}</div> | |||
</div></div> | |||
{{#css: | |||
.slide__overlay--page { | |||
position: relative; | position: relative; | ||
} | |||
.slide__overlay--page .mw-collapsible-toggle { | |||
position: static !important; | |||
} | |||
.slide__overlay--container { | |||
/* position: absolute; */ | /* position: absolute; */ | ||
/* top: -30px; */ | /* top: -30px; */ | ||
left: 0; | left: 0; | ||
right: 0; | right: 0; | ||
} | |||
.slide__overlay--title { | |||
font-weight: 500; | font-weight: 500; | ||
} | |||
.slide__overlay--content { | |||
text-wrap: pretty; | text-wrap: pretty; | ||
} | |||
.slide__overlay--content dl { | |||
margin: 0 !important; | |||
} | |||
.slide__overlay--content dd { | |||
margin-top: 0 !important; | |||
margin-bottom: 0 !important; | |||
} | |||
@media (max-width:850px) { | |||
.slide__overlay--container { | .slide__overlay--container { | ||
position: relative; | position: relative; | ||
top: 0; | top: 0; | ||
} | } | ||
} | |||
}} | }} | ||
| <!-- Если параметр не задан --> | }} | ||
|<!-- Если параметр не задан --> | |||
<div class="slide__base--container mw-collapsible mw-collapsed" | |||
margin: {{{margin| | style=" | ||
margin: {{{margin|20px 0}}}; | |||
text-align: {{{text-align|left}}}; | text-align: {{{text-align|left}}}; | ||
padding: {{{padding| | padding: {{{padding|0.9em 0.7em}}}; | ||
border: {{{border-size|0.25em}}} solid {{{border-color|#4c4c61}}}; | |||
border-radius: {{{border-radius|0.3em}}}; | |||
border: | "> | ||
<div class="slide__base--title"style="color:{{{color}}};font-size:{{{font-size|1.05em}}};>{{{title}}}</div> | |||
<div class="slide__base--content mw-collapsible-content">{{{content}}}</div> | |||
</div> | |||
{{#css: | |||
.slide__base--container { | |||
position: relative; | |||
text-wrap: pretty; | text-wrap: pretty; | ||
background: #27272e; | |||
} | |||
.slide__base--container .mw-collapsible-toggle { | |||
position: static !important; | |||
} | |||
.slide__base--title { | |||
display: inline-block; | display: inline-block; | ||
margin: 0; | margin: 0; | ||
font-family: ' | font-family: 'noto sans'; | ||
font-weight: bold; | font-weight: bold; | ||
} | |||
.slide__base--content { | |||
padding-top: 0.5em; | padding-top: 0.5em; | ||
} | |||
}} | |||
}} | |||
<!-- При активации чекбокса с классом open-all-menus --> | |||
{{#css: | |||
/* Скрытие названия */ | |||
.toggle-checked .slide__overlay--title { | |||
display: none !important; | display: none !important; | ||
} | |||
/* Скрытие кнопки свернуть/развернуть */ | |||
.toggle-checked .mw-collapsible-toggle { | |||
display: none !important; | display: none !important; | ||
} | |||
/* Показывать содержимое */ | |||
.toggle-checked .mw-collapsible .mw-collapsible-content { | |||
display: block !important; | display: block !important; | ||
} | |||
.toggle-checked .slide__overlay--page { | |||
padding: 7px !important; | padding: 7px !important; | ||
} | |||
.toggle-checked .slide__overlay--container { | |||
position: relative !important; | position: relative !important; | ||
max-height: none !important; | max-height: none !important; | ||
} | |||
}} | }} |