Участник: TFMB: различия между версиями
Материал из Vanilla Station
TFMB (обсуждение | вклад) Нет описания правки |
TFMB (обсуждение | вклад) Нет описания правки |
||
| (не показано 45 промежуточных версий этого же участника) | |||
| Строка 1: | Строка 1: | ||
{{#css: | {{#css: | ||
. | .colapsibletext{ | ||
min-width: 100%; | |||
max-height: 10000px; | |||
transition: max-height 0.5s; | |||
transition-delay: 0.1s; | |||
order: 4; | |||
overflow: hidden; | |||
} | |||
flex-grow: 1; | .colapsibletext:not(.mw-collapsed) ~ .colapserbtn{ | ||
width:100%; | |||
} | |||
.mw-headline:before{order:1;} | |||
.mw-headline:after{order:3;} | |||
.mw-headline:before,.mw-headline:after{ | |||
content: ""; | |||
content: ""; | |||
height: 1px; | |||
flex-grow: 1; | |||
border-radius: 12px; | |||
background: #000000; | |||
} | |||
.colapserbtn{ | |||
order: 2; | |||
width:60%; | |||
margin: 3px 0; | |||
background: repeating-linear-gradient(-45deg, transparent 16px, #27272e 20px); | |||
border-radius: 6px; | |||
transition: all 0.2s; | |||
user-select: none; | |||
box-shadow: 0px 0px 1px 1px black; | |||
} | } | ||
. | .colapserbtn:hover{ | ||
width:62%; | |||
} | } | ||
. | .mw-collapsed{ | ||
max-height: 0px; | |||
display:block !important; | |||
transition: none; | |||
} | } | ||
. | .extendedcontainer, .mw-headline{ | ||
display: flex; | |||
flex-wrap: wrap; | |||
align-items: center; | |||
justify-content: center;} | |||
.mw-headline{ | |||
width: 100%; | width: 100%; | ||
order: 2; | |||
} | } | ||
. | .h3{ | ||
font-size: 1.1em !important;padding: 5px 15px; | |||
} | } | ||
. | .h2{ | ||
font-size: 1.4em !important;padding: 5px 15px; | |||
} | } | ||
. | .colapsibletext:has(*:target) { | ||
transition:none; | |||
} | } | ||
. | @media (max-width: 768px) { | ||
.colapserbtn{ | |||
width:100% !important; | |||
} | |||
.colapsibletext{ | |||
transition-delay: unset; | |||
} | |||
} | } | ||
}} | }} | ||
< | <h2 class="extendedcontainer"> | ||
<div class="mw-collapsible mw-collapsed | <div class="mw-collapsible mw-collapsed colapsibletext" id="mw-customcollapsible-{{{id|myid}}}">{{{2}}}</div> | ||
<div class=" | <div class="mw-customtoggle-{{{id|myid}}} colapserbtn {{#switch:{{{3|h3}}}|h2=h2|h3=h3}}">{{{1}}}</div> | ||
</h2> | |||
</ | |||