Шаблон:RulesBox: различия между версиями
Материал из Space Station 14 Вики
Pok (обсуждение | вклад) мНет описания правки |
Pok (обсуждение | вклад) мНет описания правки |
||
| (не показано 9 промежуточных версий этого же участника) | |||
| Строка 1: | Строка 1: | ||
<div class=" | <div class="rules-box__block" style="background-color:{{{background-color|#282831}}};box-shadow:{{{box-shadow|0 2px 4px rgba(0, 0, 0, 0.3)}}};margin:{{{margin|12px 2px}}};border-left:{{{border-size|5px}}} solid {{{border-color|#404051}}};padding:{{{padding|10px 12px}}};color:{{{color|lightgrey}}};> | ||
<div class=" | <div class="rules-box__container"> | ||
{{#if: {{{title|}}} | | {{#if: {{{title|}}} | <div class="rules-box__title" style="margin-bottom:{{{margin-bottom-title|8px}}};>'''{{{title}}}'''</div>}} | ||
{{#if: {{{content|}}} | <div class="rules-box__content list-reset-margin">{{{content}}}</div>}} | |||
{{#if: {{{content|}}} | | |||
</div> | </div> | ||
{{#ifeq: {{{1|}}} | addition | | {{#ifeq: {{{1|}}} | addition | | ||
<div class=" | <div class="rules-box__container--addition mw-collapsible mw-collapsed"> | ||
<div class=" | <div class="rules-box__title--addition"><span style="white-space: nowrap;">'''{{{title-addition}}}'''</span></div> | ||
<div class=" | <div class="rules-box__content--addition mw-collapsible-content">{{{content-addition}}}</div> | ||
</div> | </div> | ||
}} | }} | ||
| Строка 17: | Строка 13: | ||
-->{{#css: | -->{{#css: | ||
. | .rules-box__block { | ||
position: relative; | position: relative; | ||
display: flex; | display: flex; | ||
| Строка 25: | Строка 21: | ||
transition: background-color 0.3s ease, box-shadow 0.3s ease; | transition: background-color 0.3s ease, box-shadow 0.3s ease; | ||
} | } | ||
. | |||
.rules-box__container { | |||
} | } | ||
. | |||
.rules-box__title { | |||
font-size: 1.2em; | font-size: 1.2em; | ||
} | } | ||
. | |||
.rules-box__content { | |||
} | } | ||
. | |||
.rules-box__title--addition { | |||
font-size: 1em; | font-size: 1em; | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
} | } | ||
. | |||
.rules-box__container--addition { | |||
position: absolute; | position: absolute; | ||
display: flex; | display: flex; | ||
| Строка 57: | Строка 55: | ||
transition: background-color 0.3s ease; | transition: background-color 0.3s ease; | ||
} | } | ||
. | |||
.rules-box__content--addition { | |||
flex-grow: 1; | flex-grow: 1; | ||
overflow-y: auto; | overflow-y: auto; | ||
margin-top: 10px; | margin-top: 10px; | ||
} | } | ||
.mw-collapsible-toggle { | .mw-collapsible-toggle { | ||
position: absolute; | position: absolute; | ||
| Строка 67: | Строка 67: | ||
right: 12px; | right: 12px; | ||
} | } | ||
@media (max-width: 700px) { | @media (max-width: 700px) { | ||
. | .rules-box__block { | ||
flex-direction: column; | flex-direction: column; | ||
margin: 20px 0; | margin: 20px 0; | ||
} | } | ||
. | .rules-box__container--addition { | ||
position: static; | position: static; | ||
display: block; | display: block; | ||
| Строка 82: | Строка 82: | ||
margin-top: 20px; | margin-top: 20px; | ||
} | } | ||
. | .rules-box__container--addition:hover { | ||
background-color: #33333b; | background-color: #33333b; | ||
} | } | ||
. | .rules-box__block:hover { | ||
background-color: #27272e; | background-color: #27272e; | ||
box-shadow: 0 4px 2px rgba(0, 0, 0, 0.15); | box-shadow: 0 4px 2px rgba(0, 0, 0, 0.15); | ||
Версия от 23:49, 17 января 2025
