diff options
Diffstat (limited to 'ui/client-style/src/themes.css')
| -rw-r--r-- | ui/client-style/src/themes.css | 59 |
1 files changed, 9 insertions, 50 deletions
diff --git a/ui/client-style/src/themes.css b/ui/client-style/src/themes.css index 18a79b5..2e8e2df 100644 --- a/ui/client-style/src/themes.css +++ b/ui/client-style/src/themes.css @@ -5,20 +5,20 @@ */ body { --video-brackground: black; - --c-danger: rgb(177, 36, 36); + --accent-hue: 277; } body.theme-dark { - --accent-light: rgb(255, 163, 87); - --accent-dark: rgb(199, 90, 0); + --accent-light: hsl(var(--accent-hue), 100%, 67%); + --accent-dark: hsl(var(--accent-hue), 65%, 49%); --c-error: rgb(255, 117, 117); --c-warn: rgb(252, 255, 78); --c-success: rgb(117, 255, 117); --c-nav: #1c1c1c9a; --c-nav-hover: #ffffff10; --c-fade: black; - --overlay-poster: #0005; - --overlay: #0006; - --overlay-hover: #0009; + --c-danger: rgb(177, 36, 36); + --overlay: #0005; + --overlay-hover: #0008; --background-dark: #070707; --background-light: #1c1c1c; --background-very-light: #323232; @@ -30,14 +30,15 @@ body.theme-dark { --image-loading-placeholder: rgb(50, 50, 50); } body.theme-light { - --accent-light: #e46600; - --accent-dark: #ff9036; + --accent-light: hsl(var(--accent-hue), 100%, 45%); + --accent-dark: hsl(var(--accent-hue), 100%, 61%); --c-error: rgb(255, 117, 117); --c-warn: rgb(252, 255, 78); --c-success: rgb(117, 255, 117); --c-nav: #c4c4c4d7; --c-nav-hover: #ffffff10; --c-fade: white; + --c-danger: rgb(177, 36, 36); --overlay: rgba(255, 255, 255, 0.267); --overlay-hover: rgba(255, 255, 255, 0.533); --background-dark: #ffffff; @@ -50,45 +51,3 @@ body.theme-light { --font-highlight: black; --image-loading-placeholder: rgb(200, 200, 200); } -body.theme-purple { - --accent-light: rgb(191, 87, 255); - --accent-dark: rgb(143, 43, 205); - --c-error: rgb(255, 117, 117); - --c-warn: rgb(252, 255, 78); - --c-success: rgb(117, 255, 117); - --c-nav: #1c1c1c9a; - --c-nav-hover: #ffffff10; - --c-fade: black; - --overlay: #0005; - --overlay-hover: #0008; - --background-dark: #070707; - --background-light: #1c1c1c; - --background-very-light: #323232; - --background-disable: rgb(128, 128, 128); - --background-prop: rgba(50, 50, 50, 0.8); - --font: #f1f1f1; - --font-dark: rgb(122, 122, 122); - --font-highlight: white; - --image-loading-placeholder: rgb(50, 50, 50); -} -body.theme-black { - --accent-light: hsl(250, 100%, 67%); - --accent-dark: hsl(250, 60%, 42%); - --c-error: rgb(255, 117, 117); - --c-warn: rgb(252, 255, 78); - --c-success: rgb(117, 255, 117); - --c-nav: #0000009a; - --c-nav-hover: #ffffff10; - --c-fade: black; - --overlay: rgba(114, 114, 114, 0.333); - --overlay-hover: rgba(255, 255, 255, 0.533); - --background-dark: #000000; - --background-light: #000000; - --background-very-light: #323232; - --background-disable: rgb(128, 128, 128); - --background-prop: rgba(50, 50, 50, 0.8); - --font: #e8e8e8; - --font-dark: rgb(102, 102, 102); - --font-highlight: white; - --image-loading-placeholder: rgb(20, 20, 20); -} |