Шаблон:ColoredTextFrame: различия между версиями

Материал из Space Station 14 Вики
Новая страница: «<div class="frame-text" style="--label-r:{{{r|190}}};--label-g:{{{g|190}}};--label-b:{{{b|200}}};> <div class="frame-text__header">{{{title}}}</div> <div class="frame-text__content">{{{content}}}</div> </div><!-- --> {{#css: * { --perceived-lightness: calc( ((var(--label-r) * 0.2126) + (var(--label-g) * 0.7152) + (var(--label-b) * 0.0722)) / 255 ); --lightness-switch: max(0, min(calc((1/(var(--lightness-threshold) - var(--perceived-lightness)))), 1)...»
 
мНет описания правки
 
(не показаны 54 промежуточные версии этого же участника)
Строка 1: Строка 1:
<div class="frame-text" style="--label-r:{{{r|190}}};--label-g:{{{g|190}}};--label-b:{{{b|200}}};>
<div class="сolored-frame-text"  
<div class="frame-text__header">{{{title}}}</div>
style="
<div class="frame-text__content">{{{content}}}</div>
margin:{{{margin|12px 0}}};
--label-r:{{{r|140}}};
--label-g:{{{g|160}}};
--label-b:{{{b|170}}};
--background-alpha:{{{background-alpha|0.1}}};
--border-alpha:{{{border-alpha|0.1}}};
--lightness-threshold:{{{lightness-threshold|0.1}}};
>
{{#if:{{{title|}}}|<div class="сolored-frame-text__header">{{Anchor|{{{title}}}}}{{{title}}}</div>|}}
<div class="сolored-frame-text__content list-reset-margin">{{{content}}}</div>
</div><!--
</div><!--


-->
--><templatestyles src="ColoredTextFrame/styles.css" />
{{#css:
* {
    --perceived-lightness: calc( ((var(--label-r) * 0.2126) + (var(--label-g) * 0.7152) + (var(--label-b) * 0.0722)) / 255 );
    --lightness-switch: max(0, min(calc((1/(var(--lightness-threshold) - var(--perceived-lightness)))), 1));
   
    --lightness-threshold: 0.2;
    --background-alpha: 0.08;
    --border-alpha: 0.15;
    --lighten-by: calc(((var(--lightness-threshold) - var(--perceived-lightness)) * 100) * var(--lightness-switch));
}
 
.frame-text {
    display: block;
    padding: 4px 6px;
    font-weight: 500;
    white-space: nowrap;
    border: 1px solid transparent;
    border-radius: 0.5em;
 
  background: rgba(var(--label-r), var(--label-g), var(--label-b), var(--background-alpha));
  border-color: rgba(var(--label-r), var(--label-g), var(--label-b), var(--border-alpha));
}
 
.frame-text__header {
    font-size: 16px;
    margin-bottom: 6px;
    color: rgba(
        calc(var(--label-r) + var(--lighten-by)),
        calc(var(--label-g) + var(--lighten-by)),
        calc(var(--label-b) + var(--lighten-by)),
        1
    );
}
 
.frame-text__content {
    font-size: 14px;
}
}}

Текущая версия от 15:35, 28 марта 2025

{{{content}}}