184 lines
9.5 KiB
CSS
184 lines
9.5 KiB
CSS
/*!Solarized Dark*/
|
|
/*
|
|
* ProxMorph PDM Theme: Solarized Dark
|
|
* Overrides the PWT Material Design tonal color system with Solarized palette
|
|
* Version: 1.0.0
|
|
* Author: ProxMorph / Ethan Schoonover (Solarized)
|
|
*
|
|
* ─── Solarized Palette ─────────────────────────────────────────
|
|
* Blue: #268bd2 Cyan: #2aa198
|
|
* Green: #859900 Yellow: #b58900
|
|
* Red: #dc322f Orange: #cb4b16
|
|
* Base03: #002b36 Base02: #073642
|
|
* Base01: #586e75 Base0: #839496
|
|
* Base1: #93a1a1
|
|
*/
|
|
|
|
:root {
|
|
/* Primary — Solarized Blue (#268bd2) tonal scale */
|
|
--pwt-color-primary-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-primary-99: rgb(246, 252, 255) !important;
|
|
--pwt-color-primary-95: rgb(218, 240, 255) !important;
|
|
--pwt-color-primary-90: rgb(188, 225, 248) !important;
|
|
--pwt-color-primary-80: rgb(130, 195, 235) !important;
|
|
--pwt-color-primary-70: rgb(75, 165, 222) !important;
|
|
--pwt-color-primary-60: rgb(38, 139, 210) !important;
|
|
--pwt-color-primary-50: rgb(25, 115, 185) !important;
|
|
--pwt-color-primary-40: rgb(12, 95, 160) !important;
|
|
--pwt-color-primary-30: rgb(4, 75, 132) !important;
|
|
--pwt-color-primary-20: rgb(0, 55, 105) !important;
|
|
--pwt-color-primary-15: rgb(0, 44, 85) !important;
|
|
--pwt-color-primary-10: rgb(0, 32, 65) !important;
|
|
--pwt-color-primary-5: rgb(0, 18, 42) !important;
|
|
--pwt-color-primary-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Secondary — Solarized Cyan (#2aa198) tonal scale */
|
|
--pwt-color-secondary-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-secondary-99: rgb(245, 255, 254) !important;
|
|
--pwt-color-secondary-95: rgb(215, 248, 245) !important;
|
|
--pwt-color-secondary-90: rgb(180, 238, 232) !important;
|
|
--pwt-color-secondary-80: rgb(115, 210, 202) !important;
|
|
--pwt-color-secondary-70: rgb(65, 185, 175) !important;
|
|
--pwt-color-secondary-60: rgb(42, 161, 152) !important;
|
|
--pwt-color-secondary-50: rgb(28, 135, 128) !important;
|
|
--pwt-color-secondary-40: rgb(15, 110, 105) !important;
|
|
--pwt-color-secondary-30: rgb(4, 88, 82) !important;
|
|
--pwt-color-secondary-20: rgb(0, 65, 60) !important;
|
|
--pwt-color-secondary-15: rgb(0, 52, 48) !important;
|
|
--pwt-color-secondary-10: rgb(0, 38, 35) !important;
|
|
--pwt-color-secondary-5: rgb(0, 22, 20) !important;
|
|
--pwt-color-secondary-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Tertiary — Solarized Violet (#6c71c4) tonal scale */
|
|
--pwt-color-tertiary-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-tertiary-99: rgb(250, 250, 255) !important;
|
|
--pwt-color-tertiary-95: rgb(232, 232, 252) !important;
|
|
--pwt-color-tertiary-90: rgb(210, 212, 242) !important;
|
|
--pwt-color-tertiary-80: rgb(168, 172, 228) !important;
|
|
--pwt-color-tertiary-70: rgb(130, 135, 210) !important;
|
|
--pwt-color-tertiary-60: rgb(108, 113, 196) !important;
|
|
--pwt-color-tertiary-50: rgb(85, 90, 172) !important;
|
|
--pwt-color-tertiary-40: rgb(65, 70, 148) !important;
|
|
--pwt-color-tertiary-30: rgb(46, 50, 122) !important;
|
|
--pwt-color-tertiary-20: rgb(30, 34, 98) !important;
|
|
--pwt-color-tertiary-15: rgb(22, 25, 80) !important;
|
|
--pwt-color-tertiary-10: rgb(14, 16, 62) !important;
|
|
--pwt-color-tertiary-5: rgb(6, 8, 40) !important;
|
|
--pwt-color-tertiary-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Success — Solarized Green (#859900) */
|
|
--pwt-color-success-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-success-99: rgb(250, 255, 242) !important;
|
|
--pwt-color-success-95: rgb(228, 248, 195) !important;
|
|
--pwt-color-success-90: rgb(205, 238, 130) !important;
|
|
--pwt-color-success-80: rgb(175, 215, 55) !important;
|
|
--pwt-color-success-70: rgb(155, 190, 15) !important;
|
|
--pwt-color-success-60: rgb(133, 153, 0) !important;
|
|
--pwt-color-success-50: rgb(112, 130, 0) !important;
|
|
--pwt-color-success-40: rgb(90, 108, 0) !important;
|
|
--pwt-color-success-30: rgb(70, 85, 0) !important;
|
|
--pwt-color-success-20: rgb(50, 62, 0) !important;
|
|
--pwt-color-success-15: rgb(38, 48, 0) !important;
|
|
--pwt-color-success-10: rgb(28, 35, 0) !important;
|
|
--pwt-color-success-5: rgb(16, 20, 0) !important;
|
|
--pwt-color-success-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Error — Solarized Red (#dc322f) */
|
|
--pwt-color-error-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-error-99: rgb(255, 248, 248) !important;
|
|
--pwt-color-error-95: rgb(255, 225, 224) !important;
|
|
--pwt-color-error-90: rgb(255, 198, 197) !important;
|
|
--pwt-color-error-80: rgb(248, 140, 138) !important;
|
|
--pwt-color-error-70: rgb(238, 90, 88) !important;
|
|
--pwt-color-error-60: rgb(220, 50, 47) !important;
|
|
--pwt-color-error-50: rgb(192, 35, 32) !important;
|
|
--pwt-color-error-40: rgb(165, 20, 18) !important;
|
|
--pwt-color-error-30: rgb(135, 8, 6) !important;
|
|
--pwt-color-error-20: rgb(102, 2, 0) !important;
|
|
--pwt-color-error-15: rgb(82, 0, 0) !important;
|
|
--pwt-color-error-10: rgb(62, 0, 0) !important;
|
|
--pwt-color-error-5: rgb(40, 0, 0) !important;
|
|
--pwt-color-error-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Warning — Solarized Yellow (#b58900) */
|
|
--pwt-color-warning-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-warning-99: rgb(255, 252, 242) !important;
|
|
--pwt-color-warning-95: rgb(255, 242, 195) !important;
|
|
--pwt-color-warning-90: rgb(248, 225, 135) !important;
|
|
--pwt-color-warning-80: rgb(225, 195, 60) !important;
|
|
--pwt-color-warning-70: rgb(200, 168, 15) !important;
|
|
--pwt-color-warning-60: rgb(181, 137, 0) !important;
|
|
--pwt-color-warning-50: rgb(155, 118, 0) !important;
|
|
--pwt-color-warning-40: rgb(130, 98, 0) !important;
|
|
--pwt-color-warning-30: rgb(105, 78, 0) !important;
|
|
--pwt-color-warning-20: rgb(78, 58, 0) !important;
|
|
--pwt-color-warning-15: rgb(60, 44, 0) !important;
|
|
--pwt-color-warning-10: rgb(44, 32, 0) !important;
|
|
--pwt-color-warning-5: rgb(28, 18, 0) !important;
|
|
--pwt-color-warning-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Neutral — Solarized Base scale */
|
|
--pwt-color-neutral-100: rgb(253, 246, 227) !important;
|
|
--pwt-color-neutral-99: rgb(238, 232, 213) !important;
|
|
--pwt-color-neutral-95: rgb(198, 200, 198) !important;
|
|
--pwt-color-neutral-90: rgb(147, 161, 161) !important;
|
|
--pwt-color-neutral-80: rgb(131, 148, 150) !important;
|
|
--pwt-color-neutral-70: rgb(110, 128, 132) !important;
|
|
--pwt-color-neutral-60: rgb(88, 110, 117) !important;
|
|
--pwt-color-neutral-50: rgb(70, 92, 100) !important;
|
|
--pwt-color-neutral-40: rgb(55, 75, 82) !important;
|
|
--pwt-color-neutral-30: rgb(42, 60, 68) !important;
|
|
--pwt-color-neutral-20: rgb(7, 54, 66) !important;
|
|
--pwt-color-neutral-15: rgb(0, 43, 54) !important;
|
|
--pwt-color-neutral-10: rgb(0, 34, 44) !important;
|
|
--pwt-color-neutral-5: rgb(0, 22, 30) !important;
|
|
--pwt-color-neutral-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Neutral Alt */
|
|
--pwt-color-neutral-alt-100: rgb(253, 246, 227) !important;
|
|
--pwt-color-neutral-alt-99: rgb(240, 235, 218) !important;
|
|
--pwt-color-neutral-alt-95: rgb(202, 205, 202) !important;
|
|
--pwt-color-neutral-alt-90: rgb(152, 166, 166) !important;
|
|
--pwt-color-neutral-alt-80: rgb(135, 152, 155) !important;
|
|
--pwt-color-neutral-alt-70: rgb(115, 132, 138) !important;
|
|
--pwt-color-neutral-alt-60: rgb(92, 115, 122) !important;
|
|
--pwt-color-neutral-alt-50: rgb(74, 95, 104) !important;
|
|
--pwt-color-neutral-alt-40: rgb(58, 78, 86) !important;
|
|
--pwt-color-neutral-alt-30: rgb(44, 62, 70) !important;
|
|
--pwt-color-neutral-alt-20: rgb(12, 50, 60) !important;
|
|
--pwt-color-neutral-alt-15: rgb(4, 40, 50) !important;
|
|
--pwt-color-neutral-alt-10: rgb(0, 30, 40) !important;
|
|
--pwt-color-neutral-alt-5: rgb(0, 18, 26) !important;
|
|
--pwt-color-neutral-alt-0: rgb(0, 0, 0) !important;
|
|
}
|
|
|
|
/* ===== Semantic Color Remapping (darker surfaces) ===== */
|
|
:root.pwt-dark-mode {
|
|
--pwt-color-surface: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-on-surface: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-surface-container: var(--pwt-color-neutral-15) !important;
|
|
--pwt-color-on-surface-container: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-neutral: var(--pwt-color-neutral-15) !important;
|
|
--pwt-color-on-neutral: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-neutral-container: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-on-neutral-container: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-dark-surface: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-on-dark-surface: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-dark-surface-container: var(--pwt-color-neutral-15) !important;
|
|
--pwt-color-on-dark-surface-container: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-neutral-alt: var(--pwt-color-neutral-alt-15) !important;
|
|
--pwt-color-on-neutral-alt: var(--pwt-color-neutral-alt-80) !important;
|
|
--pwt-color-neutral-alt-container: var(--pwt-color-neutral-alt-10) !important;
|
|
--pwt-color-on-neutral-alt-container: var(--pwt-color-neutral-alt-80) !important;
|
|
--pwt-color-background: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-inverse-surface: var(--pwt-color-neutral-80) !important;
|
|
--pwt-color-on-inverse-surface: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-border: var(--pwt-color-neutral-alt-30) !important;
|
|
--pwt-color-shadow: var(--pwt-color-neutral-0) !important;
|
|
background: var(--pwt-color-neutral-10) !important;
|
|
color: var(--pwt-color-neutral-95) !important;
|
|
}
|
|
|
|
body {
|
|
background-color: var(--pwt-color-neutral-10) !important;
|
|
} |