95 lines
2.4 KiB
CSS
95 lines
2.4 KiB
CSS
:root {
|
|
color-scheme: dark light;
|
|
|
|
--primary: #cc2027;
|
|
--primary-darken: #8E161B;
|
|
--primary-lighten: #D64C52;
|
|
--primary-text-contrast: #FFF;
|
|
|
|
--secondary: #20ccc5;
|
|
--secondary-darken: #168E89;
|
|
--secondary-lighten: #4CD6D0;
|
|
--secondary-text-contrast: #000;
|
|
|
|
--error: #c43933;
|
|
--error-darken: #892723;
|
|
--error-lighten: #CF605B;
|
|
--error-text-contrast: #FFF;
|
|
|
|
--info: #206ccc;
|
|
--info-darken: #164B8E;
|
|
--info-lighten: #4C89D6;
|
|
--info-text-contrast: #FFF;
|
|
|
|
--success: #7dcc20;
|
|
--success-darken: #578E16;
|
|
--success-lighten: #97D64C;
|
|
--success-text-contrast: #000;
|
|
|
|
--warning: #cc5e20;
|
|
--warning-darken: #8E4116;
|
|
--warning-lighten: #D67E4C;
|
|
--warning-text-contrast: #FFF;
|
|
|
|
--divider: light-dark(#B2AFAF, #454343);
|
|
|
|
--background-color: light-dark(#fffbfb, #171414);
|
|
--background-color-darken: light-dark(#B2AFAF, #100E0E);
|
|
--background-color-lighten: light-dark(#FFFBFB, #454343);
|
|
|
|
--light-background-color: #fffbfb;
|
|
--dark-background-color: #171414;
|
|
|
|
--header-background-color: light-dark(#171414, #fffbfb);
|
|
--header-background-color-darken: light-dark(#100E0E, #B2AFAF);
|
|
--header-background-color-lighten: light-dark(#454343, #FFFBFB);
|
|
|
|
--header-text-color: light-dark(#fffbfb, #171414);
|
|
--header-text-color-secondary: #ffffffb3;
|
|
--header-text-color-disable: var(--divider);
|
|
|
|
--text-color: light-dark(#171414, #fffbfb);
|
|
--text-color-secondary: #ffffffb3;
|
|
--text-color-disable: light-dark(#454343, #B2AFAF);
|
|
|
|
--light-text-color: #171414;
|
|
--dark-text-color: #fffbfb;
|
|
|
|
--text-color-inverse: light-dark(#fffbfb, #171414);
|
|
--text-color-secondary-inverse: #ffffffb3;
|
|
--text-color-disable-inverse: var(--divider);
|
|
|
|
--box-shadow-light: .4rem .4rem 0px .1rem #B2AFAF;
|
|
--box-shadow-dark: .4rem .4rem 0px .1rem #454343;
|
|
--box-shadow-auto: .4rem .4rem 0px .1rem var(--divider);
|
|
|
|
--h1-color: var(--primary);
|
|
--h2-color: #c33d35;
|
|
--h3-color: #b94f44;
|
|
--h4-color: #ae5e52;
|
|
--h5-color: #a16a61;
|
|
--h6-color: #927671;
|
|
|
|
--font-size: 1.1em;
|
|
--default-space: .2em;
|
|
}
|
|
|
|
[data-theme="dark"] {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
[data-theme="light"] {
|
|
color-scheme: light;
|
|
}
|
|
|
|
[data-theme="dark"] {
|
|
--background-color: #171414;
|
|
--text-color: #fffbfb;
|
|
--text-color-inverse: #171414;
|
|
}
|
|
|
|
[data-theme="light"] {
|
|
--background-color: #fffbfb;
|
|
--text-color: #171414;
|
|
--text-color-inverse: #fffbfb;
|
|
}
|