60 lines
No EOL
1.5 KiB
CSS
60 lines
No EOL
1.5 KiB
CSS
#townsquare-root#townsquare-root {
|
|
--scene: #99c1f1;
|
|
--page: #63452c;
|
|
--surface: #f9f06b;
|
|
--ink: #241f31;
|
|
--you: #1a5fb4;
|
|
--tree-trunk: #865e3c;
|
|
--tree-canopy: #26a269;
|
|
--other: #26241f;
|
|
--ground: rgba(42, 41, 38, 0.16);
|
|
--scene-edge: color-mix(in oklab, var(--scene) 88%, var(--page) 12%);
|
|
--you-deep: var(--you);
|
|
--text: var(--ink);
|
|
--muted: var(--ink);
|
|
}
|
|
#townsquare-root#townsquare-root[data-townsquare-theme="dark"] {
|
|
--scene: #241f31;
|
|
--page: #000000;
|
|
--surface: #241f31;
|
|
--ink: #c0bfbc;
|
|
--you: #df8a43;
|
|
--tree-trunk: #63452c;
|
|
--tree-canopy: #26a269;
|
|
--other: #ddd7cc;
|
|
--ground: rgba(242, 238, 230, 0.18);
|
|
--scene-edge: color-mix(in oklab, var(--scene) 88%, var(--page) 12%);
|
|
--you-deep: var(--you);
|
|
--text: var(--ink);
|
|
--muted: var(--ink);
|
|
}
|
|
@media (prefers-color-scheme: dark) {
|
|
#townsquare-root#townsquare-root[data-townsquare-theme="auto"] {
|
|
--scene: #241f31;
|
|
--page: #000000;
|
|
--surface: #241f31;
|
|
--ink: #c0bfbc;
|
|
--you: #df8a43;
|
|
--tree-trunk: #63452c;
|
|
--tree-canopy: #26a269;
|
|
--other: #ddd7cc;
|
|
--ground: rgba(242, 238, 230, 0.18);
|
|
--scene-edge: color-mix(in oklab, var(--scene) 88%, var(--page) 12%);
|
|
--you-deep: var(--you);
|
|
--text: var(--ink);
|
|
--muted: var(--ink);
|
|
}
|
|
}
|
|
#townsquare-root#townsquare-root .townsquare__stage {
|
|
background: linear-gradient(
|
|
180deg,
|
|
var(--scene) 0%,
|
|
var(--scene) 72%,
|
|
var(--scene-edge) 72%,
|
|
var(--page) 72.4%,
|
|
var(--page) 100%
|
|
);
|
|
}
|
|
#townsquare-root#townsquare-root .townsquare__ground {
|
|
background: var(--ground);
|
|
} |