Template:Key press/styles.css

From wikiNonStop
Revision as of 23:00, 9 September 2024 by en>Rexogamer (dark mode support)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search
.keyboard-key {
	border: 1px solid var(--border-color-base, #aaa);
    border-radius: 0.2em;
    box-shadow: 0.1em 0.2em 0.2em #ddd;
    background-image: linear-gradient(
    	to bottom, 
    	var(--background-color-neutral, #eee), 
	    var(--background-color-interactive-subtle, #f9f9f9), 
    	var(--background-color-neutral, #eee)
    );
    color: var(--color-base, #333);
    padding: 0.1em 0.3em;
    font-family: inherit;
    font-size: 0.85em;
}

/* use darker shadow colour for dark mode */
@media screen {
    html.skin-theme-clientpref-night .keyboard-key {
      	box-shadow: 0.1em 0.2em 0.2em #444;
    }
}
@media screen and (prefers-color-scheme: dark) {
	/* automatic mode */
	html.skin-theme-clientpref-os .keyboard-key {
		box-shadow: 0.1em 0.2em 0.2em #444;
	}
}