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