Шаблон:ModernFrame/styles.css: различия между версиями
Материал из Space Station 14 Вики
Pok (обсуждение | вклад) Новая страница: «.modern-frame { display: flex; flex-direction: column; } .modern-frame__title { position: relative; display: flex; align-items: center; min-height: 32px; padding: 2px 8px; color: #e5e5e5; font-size: 15px; font-family: "Noto Sans", sans-serif; border-radius: 0.3em 0.3em 0 0; border: 2px solid rgba(var(--theme-color--rgb), var(--alpha-xs)); border-bottom: 3px solid var(--color-darkened-border); } .modern-fr...» |
Pok (обсуждение | вклад) м Замена текста — «--theme-bg-color-350» на «--theme-bg-color-300» |
||
| (не показано 14 промежуточных версий этого же участника) | |||
| Строка 1: | Строка 1: | ||
.modern-frame { | .modern-frame { | ||
/* --bg-color из стилей шаблона; по умолчанию: var(--theme-bg-color-300) */ | |||
/* --alpha из стилей шаблона; по умолчанию: 30% */ | |||
--c-m-bg: color-mix(in srgb, var(--bg-color) var(--alpha), var(--theme-bg-color-100)); | |||
--c-m-border: color-mix(in srgb, var(--bg-color) 80%, transparent); | |||
background: var(--bg-color); | |||
display: flex; | display: flex; | ||
flex-direction: column; | flex-direction: column; | ||
border-radius: var(--border-radius-medium); | |||
} | } | ||
| Строка 10: | Строка 17: | ||
min-height: 32px; | min-height: 32px; | ||
padding: 2px 8px; | padding: 2px 8px; | ||
color: | color: var(--theme-text-color-header); | ||
font- | font-family: var(--font-family-heading); | ||
border-radius: var(--border-radius-medium) var(--border-radius-medium) 0 0; | |||
border-radius: | border-top: 2px solid var(--color-lighter-alpha-x); | ||
border: 2px solid | |||
border-bottom: 3px solid var(--color-darkened-border); | border-bottom: 3px solid var(--color-darkened-border); | ||
} | } | ||
.modern-frame__content { | .modern-frame__content { | ||
border-radius: 0 0 | border-radius: 0 0 var(--border-radius-medium) var(--border-radius-medium); | ||
box-shadow: inset | box-shadow: var(--box-shadow-inset-medium); | ||
border: 2px solid | border: 2px solid var(--c-m-border); | ||
background: | background: var(--c-m-bg); | ||
flex-grow: 2; | |||
} | } | ||
Текущая версия от 21:03, 20 июня 2025
.modern-frame {
/* --bg-color из стилей шаблона; по умолчанию: var(--theme-bg-color-300) */
/* --alpha из стилей шаблона; по умолчанию: 30% */
--c-m-bg: color-mix(in srgb, var(--bg-color) var(--alpha), var(--theme-bg-color-100));
--c-m-border: color-mix(in srgb, var(--bg-color) 80%, transparent);
background: var(--bg-color);
display: flex;
flex-direction: column;
border-radius: var(--border-radius-medium);
}
.modern-frame__title {
position: relative;
display: flex;
align-items: center;
min-height: 32px;
padding: 2px 8px;
color: var(--theme-text-color-header);
font-family: var(--font-family-heading);
border-radius: var(--border-radius-medium) var(--border-radius-medium) 0 0;
border-top: 2px solid var(--color-lighter-alpha-x);
border-bottom: 3px solid var(--color-darkened-border);
}
.modern-frame__content {
border-radius: 0 0 var(--border-radius-medium) var(--border-radius-medium);
box-shadow: var(--box-shadow-inset-medium);
border: 2px solid var(--c-m-border);
background: var(--c-m-bg);
flex-grow: 2;
}