52 lines
1.4 KiB
CSS
52 lines
1.4 KiB
CSS
|
/* Dark mode colors. */
|
||
|
|
:root {
|
||
|
|
--sl-color-accent-low: #3f1505;
|
||
|
|
--sl-color-accent: #b43c00;
|
||
|
|
--sl-color-accent-high: #f2b9a6;
|
||
|
|
--sl-color-white: #ffffff;
|
||
|
|
--sl-color-gray-1: #eeeeee;
|
||
|
|
--sl-color-gray-2: #c2c2c2;
|
||
|
|
--sl-color-gray-3: #8b8b8b;
|
||
|
|
--sl-color-gray-4: #585858;
|
||
|
|
--sl-color-gray-5: #383838;
|
||
|
|
--sl-color-gray-6: #272727;
|
||
|
|
--sl-color-black: #181818;
|
||
|
|
--yellow-hsl: 43.3,96.4%,56.3%;
|
||
|
|
--overlay-yellow: hsla(var(--yellow-hsl), .2);
|
||
|
|
--backdrop-color: #272727cc;
|
||
|
|
}
|
||
|
|
/* Light mode colors. */
|
||
|
|
:root[data-theme='light'] {
|
||
|
|
--sl-color-accent-low: #f7ccbd;
|
||
|
|
--sl-color-accent: #b73d00;
|
||
|
|
--sl-color-accent-high: #5a1a00;
|
||
|
|
--sl-color-white: #181818;
|
||
|
|
--sl-color-gray-1: #272727;
|
||
|
|
--sl-color-gray-2: #383838;
|
||
|
|
--sl-color-gray-3: #585858;
|
||
|
|
--sl-color-gray-4: #8b8b8b;
|
||
|
|
--sl-color-gray-5: #c2c2c2;
|
||
|
|
--sl-color-gray-6: #eeeeee;
|
||
|
|
--sl-color-gray-7: #f6f6f6;
|
||
|
|
--sl-color-black: #ffffff;
|
||
|
|
--yellow-hsl: 47.9,95.8%,53.1%;
|
||
|
|
--backdrop-color: #F6F6F699;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page {
|
||
|
|
background: linear-gradient(215deg, var(--overlay-yellow), transparent 40%), radial-gradient(var(--overlay-yellow), transparent 40%) no-repeat center center / cover, radial-gradient(var(--overlay-yellow), transparent 65%) no-repeat center center / cover;
|
||
|
|
background-blend-mode: overlay;
|
||
|
|
}
|
||
|
|
|
||
|
|
header {
|
||
|
|
backdrop-filter: blur(12px) !important;
|
||
|
|
background-color: var(--backdrop-color) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
ol {
|
||
|
|
list-style: circle;
|
||
|
|
}
|
||
|
|
|
||
|
|
select {
|
||
|
|
background-image: none;
|
||
|
|
}
|