More languages
More actions
m (Added box shadow for floating TOC, changed infobox to adapt to dark Citizen style, plus some interface stuff) |
m (Added more interface stuff) |
||
Line 8: | Line 8: | ||
color: var(--color-base) | color: var(--color-base) | ||
} | } | ||
/* Code Editor options */ | |||
.skin-citizen-dark .ace-tm { | .skin-citizen-dark .ace-tm { | ||
Line 27: | Line 29: | ||
.skin-citizen-dark .codeEditor-status { | .skin-citizen-dark .codeEditor-status { | ||
background-color: var(--color-surface-2); | background-color: var(--color-surface-2); | ||
border-top:0; | |||
} | |||
.skin-citizen-dark .editOptions { | |||
background-color: var(--color-surface-1); | |||
color: var(--color-base); | |||
border:0; | |||
} | } | ||
.skin-citizen-dark #toc { | .skin-citizen-dark #toc { | ||
Line 34: | Line 44: | ||
.skin-citizen-light #toc { | .skin-citizen-light #toc { | ||
box-shadow: 0px 2.25em 1em -0.15em rgb(0, 0, 0, 0.5); | box-shadow: 0px 2.25em 1em -0.15em rgb(0, 0, 0,0.5); | ||
} | } | ||
Line 40: | Line 50: | ||
color: var(--color-base); | color: var(--color-base); | ||
background-color: var(--color-surface-2); | background-color: var(--color-surface-2); | ||
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0); | |||
border: 0; | |||
} | |||
.skin-citizen-light .infobox { | |||
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0,0.5); | |||
border: 0; | |||
} | } | ||
Revision as of 02:55, 14 January 2022
/* All CSS here will be loaded for users of the Citizen skin */
blockquote {
padding: 8px 16px;
font-family: var(--font-family-base);
font-size: 100%;
font-style: inherit;
color: var(--color-base)
}
/* Code Editor options */
.skin-citizen-dark .ace-tm {
background-color: var(--background-color-dp-01);
color: var(--color-base)
}
.skin-citizen-dark .ace-tm .ace_print-margin {
background: var(--background-color-dp-00);
}
.skin-citizen-dark .ace-tm .ace_gutter {
background: var(--color-surface-1);
}
.skin-citizen-dark .ace-tm .ace_gutter-active-line {
background-color: var(--color-surface-2--active);
}
.skin-citizen-dark .codeEditor-status {
background-color: var(--color-surface-2);
border-top:0;
}
.skin-citizen-dark .editOptions {
background-color: var(--color-surface-1);
color: var(--color-base);
border:0;
}
.skin-citizen-dark #toc {
box-shadow: 0px 2.25em 1em -0.15em rgb(0, 0, 0);
}
.skin-citizen-light #toc {
box-shadow: 0px 2.25em 1em -0.15em rgb(0, 0, 0,0.5);
}
.skin-citizen-dark .infobox {
color: var(--color-base);
background-color: var(--color-surface-2);
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0);
border: 0;
}
.skin-citizen-light .infobox {
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0,0.5);
border: 0;
}
.skin-citizen-light {
--color-base: black
}
.skin-citizen-light blockquote {
--color-base: black
}