Skip to main content

THEME_SEGMENT_STYLE

Constant THEME_SEGMENT_STYLE 

Source
const THEME_SEGMENT_STYLE: &str = r#"
.theme-seg .segmented:not([data-ready]) > .segmented-item[data-active] {
    background-color: transparent; box-shadow: none; color: var(--color-fg-2); font-weight: 400;
}
html[data-theme-mode="light"] .theme-seg .segmented:not([data-ready]) > button:nth-of-type(1),
html[data-theme-mode="dark"] .theme-seg .segmented:not([data-ready]) > button:nth-of-type(2),
html[data-theme-mode="system"] .theme-seg .segmented:not([data-ready]) > button:nth-of-type(3),
html:not([data-theme-mode]) .theme-seg .segmented:not([data-ready]) > button:nth-of-type(3) {
    background-color: var(--color-surface-2); color: var(--color-fg); font-weight: 500;
    box-shadow: 0 0 0 var(--hairline) var(--color-hairline), var(--shadow-sm);
}
html.dark[data-theme-mode="light"] .theme-seg .segmented:not([data-ready]) > button:nth-of-type(1),
html.dark[data-theme-mode="dark"] .theme-seg .segmented:not([data-ready]) > button:nth-of-type(2),
html.dark[data-theme-mode="system"] .theme-seg .segmented:not([data-ready]) > button:nth-of-type(3),
html.dark:not([data-theme-mode]) .theme-seg .segmented:not([data-ready]) > button:nth-of-type(3) {
    background-color: var(--color-surface-3);
}
"#;