Шаблон:ColoredTextFrame/styles.css: различия между версиями
Материал из Space Station 14 Вики
Pok (обсуждение | вклад) Нет описания правки |
Pok (обсуждение | вклад) Нет описания правки |
||
| Строка 5: | Строка 5: | ||
--lighten-by: calc(((var(--lightness-threshold) - var(--perceived-lightness)) * 100) * var(--lightness-switch)); | --lighten-by: calc(((var(--lightness-threshold) - var(--perceived-lightness)) * 100) * var(--lightness-switch)); | ||
-- | --background: color-mix(in srgb, var(--color) var(--background-alpha), rgba(255, 255, 255, 0.005)); | ||
-- | --border: 1px solid color-mix(in srgb, var(--color) 50%, rgba(255, 255, 255, 0.05)); | ||
-- | --text: color-mix(in srgb, var(--color) 50%, rgba(255, 255, 255, 1)); | ||
} | } | ||
.сolored-frame-text { | .сolored-frame-text { | ||
display: block; | display: block; | ||
box-sizing: border-box; | |||
width: 100%; | width: 100%; | ||
padding: 6px 8px; | padding: 6px 8px; | ||
border-radius: var(--border-radius-high); | border-radius: var(--border-radius-high); | ||
background: | background: var(--background); | ||
border: 1px solid | border: 1px solid var(--border); | ||
} | } | ||
| Строка 24: | Строка 25: | ||
font-family: var(--font-family-heading); | font-family: var(--font-family-heading); | ||
margin-bottom: 4px; | margin-bottom: 4px; | ||
color: | color: var(--text); | ||
} | } | ||
Версия от 16:47, 22 июня 2026
.сolored-frame-text {
--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));
--lighten-by: calc(((var(--lightness-threshold) - var(--perceived-lightness)) * 100) * var(--lightness-switch));
--background: color-mix(in srgb, var(--color) var(--background-alpha), rgba(255, 255, 255, 0.005));
--border: 1px solid color-mix(in srgb, var(--color) 50%, rgba(255, 255, 255, 0.05));
--text: color-mix(in srgb, var(--color) 50%, rgba(255, 255, 255, 1));
}
.сolored-frame-text {
display: block;
box-sizing: border-box;
width: 100%;
padding: 6px 8px;
border-radius: var(--border-radius-high);
background: var(--background);
border: 1px solid var(--border);
}
.сolored-frame-text__header {
font-weight: bold;
font-family: var(--font-family-heading);
margin-bottom: 4px;
color: var(--text);
}
.сolored-frame-text__content {
color: var(--theme-text-color);
}