diff --git a/web/src/components/timeline/EventSegment.tsx b/web/src/components/timeline/EventSegment.tsx
index 5ce8d65fa..242ca3248 100644
--- a/web/src/components/timeline/EventSegment.tsx
+++ b/web/src/components/timeline/EventSegment.tsx
@@ -152,7 +152,7 @@ export function EventSegment({
: ""
} ${
isFirstSegmentInMinimap || isLastSegmentInMinimap
- ? "relative h-[8px] border-b-2 border-neutral-600"
+ ? "relative h-[8px] border-b-2 border-neutral_variant"
: ""
}`;
diff --git a/web/src/components/timeline/segment-metadata.tsx b/web/src/components/timeline/segment-metadata.tsx
index f35ceb1c6..6a92c1edd 100644
--- a/web/src/components/timeline/segment-metadata.tsx
+++ b/web/src/components/timeline/segment-metadata.tsx
@@ -71,11 +71,11 @@ export function Tick({ timestamp, timestampSpread }: TickSegmentProps) {
className={`pointer-events-none h-0.5 select-none ${
timestamp.getMinutes() % timestampSpread === 0 &&
timestamp.getSeconds() === 0
- ? "w-[12px] bg-neutral-600 dark:bg-neutral-500"
+ ? "dark:bg-neutral bg-neutral_variant w-[12px]"
: timestamp.getMinutes() % (timestampSpread == 15 ? 5 : 1) ===
0 && timestamp.getSeconds() === 0
- ? "w-[8px] bg-neutral-500" // Minor tick mark
- : "w-[5px] bg-neutral-400 dark:bg-neutral-600"
+ ? "bg-neutral w-[8px]" // Minor tick mark
+ : "dark:bg-neutral_variant w-[5px] bg-neutral-400"
}`}
>
@@ -97,7 +97,7 @@ export function Timestamp({
{!isFirstSegmentInMinimap && !isLastSegmentInMinimap && (
{timestamp.getMinutes() % timestampSpread === 0 &&
timestamp.getSeconds() === 0 &&
diff --git a/web/src/context/theme-provider.tsx b/web/src/context/theme-provider.tsx
index 7b26780d5..764e0d8e9 100644
--- a/web/src/context/theme-provider.tsx
+++ b/web/src/context/theme-provider.tsx
@@ -3,25 +3,19 @@ import { createContext, useContext, useEffect, useMemo, useState } from "react";
type Theme = "dark" | "light" | "system";
type ColorScheme =
| "theme-blue"
- | "theme-gold"
| "theme-green"
- | "theme-nature"
- | "theme-netflix"
| "theme-nord"
- | "theme-orange"
| "theme-red"
+ | "theme-high-contrast"
| "theme-default";
// eslint-disable-next-line react-refresh/only-export-components
export const colorSchemes: ColorScheme[] = [
"theme-blue",
- "theme-gold",
"theme-green",
- "theme-nature",
- "theme-netflix",
"theme-nord",
- "theme-orange",
"theme-red",
+ "theme-high-contrast",
"theme-default",
];
diff --git a/web/src/index.css b/web/src/index.css
index b290221b3..32437ca81 100644
--- a/web/src/index.css
+++ b/web/src/index.css
@@ -1,12 +1,9 @@
@import "/themes/tailwind-base.css";
@import "/themes/theme-default.css";
@import "/themes/theme-blue.css";
-@import "/themes/theme-gold.css";
@import "/themes/theme-green.css";
-@import "/themes/theme-nature.css";
-@import "/themes/theme-netflix.css";
+@import "/themes/theme-high-contrast.css";
@import "/themes/theme-nord.css";
-@import "/themes/theme-orange.css";
@import "/themes/theme-red.css";
@tailwind base;
@@ -26,7 +23,7 @@
@layer utilities {
.scrollbar-container {
- @apply scrollbar-thumb-rounded-full scrollbar-track-rounded-full scrollbar-thin scrollbar-thumb-border scrollbar-track-background_alt;
+ @apply scrollbar-thin scrollbar-track-background_alt scrollbar-thumb-border scrollbar-track-rounded-full scrollbar-thumb-rounded-full;
}
}
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index dc82a58ab..b7371a193 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -103,6 +103,12 @@ module.exports = {
audio_review: {
DEFAULT: "hsl(var(--audio_review))",
},
+ neutral: {
+ DEFAULT: "hsl(var(--neutral))",
+ },
+ neutral_variant: {
+ DEFAULT: "hsl(var(--neutral_variant))",
+ },
},
keyframes: {
"accordion-down": {
diff --git a/web/themes/theme-blue.css b/web/themes/theme-blue.css
index 0a18600c7..df78e768d 100644
--- a/web/themes/theme-blue.css
+++ b/web/themes/theme-blue.css
@@ -13,6 +13,8 @@
--secondary: 210 40% 90.1%;
--secondary-foreground: 222.2 47.4% 61.2%;
--secondary-highlight: 210 40% 94%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--muted: 210 40% 96.1%;
--muted-foreground: 215.4 46.3% 46.9%;
--accent: 210 40% 80.1%;
@@ -42,6 +44,8 @@
--secondary: 217.2 32.6% 17.5%;
--secondary-foreground: 210 60% 78%;
--secondary-highlight: 217.2 32.6% 25.5%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--muted: 217.2 32.6% 17.5%;
--muted-foreground: 215 20.2% 65.1%;
--accent: 217.2 32.6% 17.5%;
diff --git a/web/themes/theme-default.css b/web/themes/theme-default.css
index fe19f301b..03ced055c 100644
--- a/web/themes/theme-default.css
+++ b/web/themes/theme-default.css
@@ -39,6 +39,12 @@
--secondary-highlight: hsl(0, 0%, 94%);
--secondary-highlight: 0 0% 94%;
+ --neutral: hsl(0, 0%, 45.1%);
+ --neutral: 0 0% 45.1%;
+
+ --neutral_variant: hsl(0, 0%, 32.2%);
+ --neutral_variant: 0 0% 32.2%;
+
--muted: hsl(210, 40%, 96.1%);
--muted: 210 40% 96.1%;
@@ -137,6 +143,12 @@
--secondary-highlight: hsl(0, 0%, 25%);
--secondary-highlight: 0 0% 25%;
+ --neutral: hsl(0, 0%, 45.1%);
+ --neutral: 0 0% 45.1%;
+
+ --neutral_variant: hsl(0, 0%, 32.2%);
+ --neutral_variant: 0 0% 32.2%;
+
--muted: hsl(0, 0%, 12%);
--muted: 0 0% 12%;
diff --git a/web/themes/theme-gold.css b/web/themes/theme-gold.css
deleted file mode 100644
index a4a0b33ba..000000000
--- a/web/themes/theme-gold.css
+++ /dev/null
@@ -1,59 +0,0 @@
-@layer base {
- .theme-gold.light {
- --background: 38 77% 88%;
- --background-alt: 39 100% 85%;
- --foreground: 16 43% 34%;
- --muted: 28 46% 56%;
- --muted-foreground: 16 43% 34%;
- --popover: 38 77% 88%;
- --popover-foreground: 16 43% 34%;
- --border: 28 46% 56%;
- --input: 28 46% 56%;
- --card: 38 77% 88%;
- --card-foreground: 16 43% 34%;
- --primary: 28 46% 56%;
- --primary-variant: 28 46% 46%;
- --primary-foreground: 60 70% 90%;
- --secondary: 39 100% 73%;
- --secondary-foreground: 16 43% 34%;
- --secondary-highlight: 39 100% 80%;
- --accent: 39 100% 73%;
- --accent-foreground: 16 43% 34%;
- --destructive: 16 43% 34%;
- --destructive-foreground: 38 77% 88%;
- --warning: 45 100% 51%;
- --warning-foreground: 16 43% 34%;
- --ring: 28 46% 56%;
- --selected: 39 100% 73%;
- --selected-foreground: 16 43% 34%;
- }
-
- .theme-gold.dark {
- --background: 28 46% 28%;
- --background-alt: 28 46% 34%;
- --foreground: 38 77% 88%;
- --muted: 28 46% 56%;
- --muted-foreground: 38 77% 88%;
- --popover: 25 45% 34%;
- --popover-foreground: 38 77% 88%;
- --border: 28 46% 56%;
- --input: 28 46% 56%;
- --card: 16 43% 34%;
- --card-foreground: 38 77% 88%;
- --primary: 28 46% 50%;
- --primary-variant: 28 46% 46%;
- --primary-foreground: 60 70% 90%;
- --secondary: 39 60% 63%;
- --secondary-foreground: 28 50% 44%;
- --secondary-highlight: 39 100% 65%;
- --accent: 39 100% 52%;
- --accent-foreground: 16 43% 34%;
- --destructive: 38 77% 88%;
- --destructive-foreground: 16 43% 34%;
- --warning: 45 100% 51%;
- --warning-foreground: 16 43% 34%;
- --ring: 28 46% 56%;
- --selected: 39 100% 52%;
- --selected-foreground: 16 43% 34%;
- }
-}
diff --git a/web/themes/theme-green.css b/web/themes/theme-green.css
index f2816d953..5cfb2be17 100644
--- a/web/themes/theme-green.css
+++ b/web/themes/theme-green.css
@@ -13,6 +13,8 @@
--secondary: 145 34.8% 85.9%;
--secondary-foreground: 145 35.9% 50%;
--secondary-highlight: 145 70% 92%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--muted: 145 14.8% 75.9%;
--muted-foreground: 240 3.8% 46.1%;
--accent: 145 34.8% 85.9%;
@@ -42,6 +44,8 @@
--secondary: 145 13.7% 15.9%;
--secondary-foreground: 0 0% 98%;
--secondary-highlight: 145 30% 20%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--muted: 145 20% 15%;
--muted-foreground: 145 25% 64.9%;
--accent: 145 16.5% 25.1%;
diff --git a/web/themes/theme-high-contrast.css b/web/themes/theme-high-contrast.css
new file mode 100644
index 000000000..b9a7cdb86
--- /dev/null
+++ b/web/themes/theme-high-contrast.css
@@ -0,0 +1,185 @@
+@layer base {
+ .theme-high-contrast.light {
+ --background: hsl(0, 0%, 100%);
+ --background: 0 0% 100%;
+
+ --background-alt: hsl(0, 0%, 99.5%);
+ --background-alt: 0 0% 99.5%;
+
+ --foreground: hsl(222.2, 84%, 4.9%);
+ --foreground: 222.2 84% 4.9%;
+
+ --card: hsl(0, 0%, 100%);
+ --card: 0 0% 100%;
+
+ --card-foreground: hsl(222.2, 84%, 4.9%);
+ --card-foreground: 222.2 84% 4.9%;
+
+ --popover: hsl(0, 0%, 100%);
+ --popover: 0 0% 100%;
+
+ --popover-foreground: hsl(222.2, 84%, 4.9%);
+ --popover-foreground: 222.2 84% 4.9%;
+
+ --primary: hsl(222.2, 37.4%, 1.2%);
+ --primary: 222.2 47.4% 1.2%;
+
+ --primary-variant: hsl(222.2, 37.4%, 4.2%);
+ --primary-variant: 222.2 47.4% 4.2%;
+
+ --primary-foreground: hsl(210, 40%, 98%);
+ --primary-foreground: 210 40% 98%;
+
+ --secondary: hsl(0, 0%, 98.1%);
+ --secondary: 0 0% 98.1%;
+
+ --secondary-foreground: hsl(222.2, 17.4%, 6.2%);
+ --secondary-foreground: 222.2 17.4% 6.2%;
+
+ --secondary-highlight: hsl(0, 0%, 84%);
+ --secondary-highlight: 0 0% 84%;
+
+ --neutral: hsl(0, 0%, 5.1%);
+ --neutral: 0 0% 5.1%;
+
+ --neutral_variant: hsl(0, 0%, 2.2%);
+ --neutral_variant: 0 0% 2.2%;
+
+ --muted: hsl(0, 0%, 94.1%);
+ --muted: 0 0% 94.1%;
+
+ --muted-foreground: hsl(215.4, 6.3%, 46.9%);
+ --muted-foreground: 215.4 6.3% 46.9%;
+
+ --accent: hsl(0, 0%, 94.1%);
+ --accent: 0 0% 94.1%;
+
+ --accent-foreground: hsl(222.2, 47.4%, 11.2%);
+ --accent-foreground: 222.2 47.4% 11.2%;
+
+ --destructive: hsl(0, 84.2%, 60.2%);
+ --destructive: 0 84.2% 60.2%;
+
+ --destructive-foreground: hsl(0, 100%, 83%);
+ --destructive-foreground: 0 100% 83%;
+
+ --warning: hsl(17, 87%, 18%);
+ --warning: 17 87% 18%;
+
+ --warning-foreground: hsl(32, 100%, 74%);
+ --warning-foreground: 32 100% 74%;
+
+ --border: hsl(214.3, 31.8%, 91.4%);
+ --border: 214.3 31.8% 91.4%;
+
+ --input: hsl(0, 0%, 85%);
+ --input: 0 0% 85%;
+
+ --ring: hsla(0, 0%, 25%, 0%);
+ --ring: 0 0% 25% 0%;
+
+ --selected: hsl(228, 89%, 63%);
+ --selected: 228 89% 63%;
+
+ --selected-foreground: hsl(0 0% 100%);
+ --selected-foreground: 0 0% 100%;
+
+ --severity_alert: var(--red-800);
+ --severity_alert_dimmed: var(--red-500);
+
+ --severity_detection: var(--orange-600);
+ --severity_detection_dimmed: var(--orange-400);
+
+ --severity_significant_motion: var(--yellow-400);
+ --severity_significant_motion_dimmed: var(--yellow-200);
+
+ --motion_review: hsl(44, 94%, 50%);
+ --motion_review: 44 94% 50%;
+
+ --motion_review_dimmed: hsl(44, 60%, 40%);
+ --motion_review_dimmed: 44 60% 40%;
+
+ --audio_review: hsl(228, 94%, 67%);
+ --audio_review: 228 94% 67%;
+ }
+
+ .theme-high-contrast.dark {
+ --background: hsl(0, 0, 0%);
+ --background: 0 0% 0%;
+
+ --background-alt: hsl(0, 0, 3%);
+ --background-alt: 0 0% 3%;
+
+ --foreground: hsl(0, 0%, 100%);
+ --foreground: 0, 0%, 100%;
+
+ --card: hsl(0, 0%, 11%);
+ --card: 0, 0%, 11%;
+
+ --card-foreground: hsl(210, 40%, 98%);
+ --card-foreground: 210 40% 98%;
+
+ --popover: hsl(0, 0%, 11%);
+ --popover: 0, 0%, 11%;
+
+ --popover-foreground: hsl(0, 0%, 98%);
+ --popover-foreground: 0 0% 98%;
+
+ --primary: hsl(0, 0%, 91%);
+ --primary: 0 0% 91%;
+
+ --primary-variant: hsl(0, 0%, 64%);
+ --primary-variant: 0 0% 64%;
+
+ --primary-foreground: hsl(0, 0%, 29%);
+ --primary-foreground: 0 0% 29%;
+
+ --secondary: hsl(0, 0%, 5%);
+ --secondary: 0 0% 5%;
+
+ --secondary-foreground: hsl(0, 0%, 82%);
+ --secondary-foreground: 0 0% 82%;
+
+ --secondary-highlight: hsl(0, 0%, 45%);
+ --secondary-highlight: 0 0% 45%;
+
+ --neutral: hsl(0, 0%, 97.1%);
+ --neutral: 0 0% 97.1%;
+
+ --neutral_variant: hsl(0, 0%, 92.2%);
+ --neutral_variant: 0 0% 92.2%;
+
+ --muted: hsl(0, 0%, 22%);
+ --muted: 0 0% 22%;
+
+ --muted-foreground: hsl(0, 0%, 82%);
+ --muted-foreground: 0 0% 82%;
+
+ --accent: hsl(0, 0%, 11%);
+ --accent: 0 0% 11%;
+
+ --accent-foreground: hsl(210, 40%, 95%);
+ --accent-foreground: 210 40% 95%;
+
+ --destructive: hsl(0, 62.8%, 30.6%);
+ --destructive: 0 62.8% 30.6%;
+
+ --destructive-foreground: hsl(0, 100%, 83%);
+ --destructive-foreground: 0 100% 83%;
+
+ --warning: hsl(17, 87%, 18%);
+ --warning: 17 87% 18%;
+
+ --warning-foreground: hsl(32, 100%, 74%);
+ --warning-foreground: 32 100% 74%;
+
+ --border: hsl(0, 0%, 92%);
+ --border: 0 0% 92%;
+
+ --input: hsl(0, 0%, 45%);
+ --input: 0 0% 45%;
+
+ --ring: hsla(0, 0%, 25%, 0%);
+ --ring: 0 0% 25% 0%;
+ }
+}
diff --git a/web/themes/theme-nature.css b/web/themes/theme-nature.css
deleted file mode 100644
index f7e29c512..000000000
--- a/web/themes/theme-nature.css
+++ /dev/null
@@ -1,59 +0,0 @@
-@layer base {
- .theme-nature.light {
- --background: 70 30% 92%;
- --background-alt: 58 45% 89%;
- --foreground: 187 33% 43%;
- --muted: 70 20% 68%;
- --muted-foreground: 187 33% 43%;
- --popover: 58 45% 83%;
- --popover-foreground: 187 33% 43%;
- --border: 93 28% 56%;
- --input: 93 28% 56%;
- --card: 58 65% 83%;
- --card-foreground: 187 33% 43%;
- --primary: 93 28% 56%;
- --primary-variant: 93 28% 46%;
- --primary-foreground: 58 65% 83%;
- --secondary: 70 20% 78%;
- --secondary-foreground: 187 33% 43%;
- --secondary-highlight: 70 30% 75%;
- --accent: 70 20% 68%;
- --accent-foreground: 187 33% 43%;
- --destructive: 187 33% 43%;
- --destructive-foreground: 58 65% 83%;
- --warning: 45 100% 51%;
- --warning-foreground: 187 33% 43%;
- --ring: 93 28% 56%;
- --selected: 70 20% 68%;
- --selected-foreground: 187 33% 43%;
- }
-
- .theme-nature.dark {
- --background: 187 33% 43%;
- --background-alt: 187 33% 33%;
- --foreground: 58 65% 83%;
- --muted: 70 20% 68%;
- --muted-foreground: 58 65% 83%;
- --popover: 187 33% 43%;
- --popover-foreground: 58 65% 83%;
- --border: 93 28% 56%;
- --input: 93 28% 56%;
- --card: 187 33% 43%;
- --card-foreground: 58 65% 83%;
- --primary: 93 38% 36%;
- --primary-variant: 93 28% 46%;
- --primary-foreground: 187 33% 43%;
- --secondary: 70 20% 58%;
- --secondary-foreground: 58 65% 83%;
- --secondary-highlight: 70 30% 60%;
- --accent: 70 20% 68%;
- --accent-foreground: 58 65% 83%;
- --destructive: 58 65% 83%;
- --destructive-foreground: 187 33% 43%;
- --warning: 45 100% 51%;
- --warning-foreground: 187 33% 43%;
- --ring: 93 28% 56%;
- --selected: 70 20% 68%;
- --selected-foreground: 58 65% 83%;
- }
-}
diff --git a/web/themes/theme-netflix.css b/web/themes/theme-netflix.css
deleted file mode 100644
index 641884b45..000000000
--- a/web/themes/theme-netflix.css
+++ /dev/null
@@ -1,59 +0,0 @@
-@layer base {
- .theme-netflix.light {
- --background: 0 0% 100%;
- --background-alt: 0 0% 96%;
- --foreground: 0 0% 0%;
- --muted: 0 0% 68%;
- --muted-foreground: 0 0% 0%;
- --popover: 0 0% 95%;
- --popover-foreground: 0 0% 0%;
- --border: 0 68% 39%;
- --input: 0 68% 39%;
- --card: 0 0% 95%;
- --card-foreground: 0 0% 0%;
- --primary: 0 100% 44%;
- --primary-variant: 0 100% 34%;
- --primary-foreground: 0 0% 100%;
- --secondary: 0 0% 80%;
- --secondary-foreground: 0 0% 100%;
- --secondary-highlight: 0 0% 10%;
- --accent: 0 100% 50%;
- --accent-foreground: 0 0% 0%;
- --destructive: 0 68% 39%;
- --destructive-foreground: 0 0% 100%;
- --warning: 45 100% 51%;
- --warning-foreground: 0 0% 0%;
- --ring: 0 100% 44%;
- --selected: 0 100% 44%;
- --selected-foreground: 0 0% 100%;
- }
-
- .theme-netflix.dark {
- --background: 0 0% 0%;
- --background-alt: 0 0% 5%;
- --foreground: 0 0% 100%;
- --muted: 0 0% 50%;
- --muted-foreground: 0 0% 100%;
- --popover: 0 0% 5%;
- --popover-foreground: 0 0% 100%;
- --border: 0 68% 39%;
- --input: 0 68% 39%;
- --card: 0 0% 5%;
- --card-foreground: 0 0% 100%;
- --primary: 0 70% 44%;
- --primary-variant: 0 100% 34%;
- --primary-foreground: 0 0% 0%;
- --secondary: 0 0% 20%;
- --secondary-foreground: 0 0% 40%;
- --secondary-highlight: 0 0% 90%;
- --accent: 0 100% 50%;
- --accent-foreground: 0 0% 100%;
- --destructive: 0 68% 39%;
- --destructive-foreground: 0 0% 100%;
- --warning: 45 100% 51%;
- --warning-foreground: 0 0% 0%;
- --ring: 0 100% 44%;
- --selected: 0 100% 44%;
- --selected-foreground: 0 0% 0%;
- }
-}
diff --git a/web/themes/theme-nord.css b/web/themes/theme-nord.css
index ab8ead0e4..59593b0cd 100644
--- a/web/themes/theme-nord.css
+++ b/web/themes/theme-nord.css
@@ -17,6 +17,8 @@
--secondary: 215 14% 80%;
--secondary-foreground: 222 20% 16%;
--secondary-highlight: 215 14% 88%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--accent: 215 14% 80%;
--accent-foreground: 222 20% 16%;
--destructive: 0 80% 50%;
@@ -46,6 +48,8 @@
--secondary: 215 14% 25%;
--secondary-foreground: 222 20% 86%;
--secondary-highlight: 215 14% 35%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--accent: 215 14% 25%;
--accent-foreground: 222 20% 96%;
--destructive: 0 80% 50%;
diff --git a/web/themes/theme-orange.css b/web/themes/theme-orange.css
deleted file mode 100644
index 5e428c33a..000000000
--- a/web/themes/theme-orange.css
+++ /dev/null
@@ -1,59 +0,0 @@
-@layer base {
- .theme-orange.light {
- --background: 24 50% 98.3%;
- --background-alt: 30 50% 96%;
- --foreground: 20 14.3% 4.1%;
- --card: 0 0% 100%;
- --card-foreground: 20 14.3% 4.1%;
- --popover: 24 30% 95%;
- --popover-foreground: 24 24.3% 14.1%;
- --primary: 24.6 55% 53.1%;
- --primary-variant: 24.6 55% 43.1%;
- --primary-foreground: 60 9.1% 97.8%;
- --secondary: 24 54.8% 95.9%;
- --secondary-foreground: 24 79.8% 60%;
- --secondary-highlight: 30 50% 92%;
- --muted: 24 4.8% 75.9%;
- --muted-foreground: 25 25.3% 44.7%;
- --accent: 24 14.8% 95.9%;
- --accent-foreground: 24 14.8% 10%;
- --destructive: 0 84.2% 60.2%;
- --destructive-foreground: 60 9.1% 97.8%;
- --warning: 45 100% 51%;
- --warning-foreground: 20 14.3% 4.1%;
- --border: 20 5.9% 90%;
- --input: 24 25.9% 90%;
- --ring: 24.6 95% 53.1%;
- --selected: 24.6 85% 53.1%;
- --selected-foreground: 60 9.1% 97.8%;
- }
-
- .theme-orange.dark {
- --background: 20 14.3% 4.1%;
- --background-alt: 20 14.3% 9.1%;
- --foreground: 60 9.1% 97.8%;
- --card: 20 14.3% 4.1%;
- --card-foreground: 60 9.1% 97.8%;
- --popover: 20 14.3% 4.1%;
- --popover-foreground: 60 9.1% 97.8%;
- --primary: 20.5 90.2% 68.2%;
- --primary-variant: 20.5 90.2% 58.2%;
- --primary-foreground: 60 9.1% 97.8%;
- --secondary: 12 6.5% 15.1%;
- --secondary-foreground: 20 49.1% 57.8%;
- --secondary-highlight: 12 6.5% 25.1%;
- --muted: 20.5 26.5% 15.1%;
- --muted-foreground: 20 25.4% 53.9%;
- --accent: 20 16.5% 15.1%;
- --accent-foreground: 20 19.1% 79.8%;
- --destructive: 0 72.2% 50.6%;
- --destructive-foreground: 60 9.1% 97.8%;
- --warning: 45 100% 51%;
- --warning-foreground: 60 9.1% 97.8%;
- --border: 12 6.5% 15.1%;
- --input: 12 6.5% 15.1%;
- --ring: 20.5 90.2% 48.2%;
- --selected: 20.5 90.2% 38.2%;
- --selected-foreground: 60 9.1% 97.8%;
- }
-}
diff --git a/web/themes/theme-red.css b/web/themes/theme-red.css
index f522d74b7..8da5f5288 100644
--- a/web/themes/theme-red.css
+++ b/web/themes/theme-red.css
@@ -13,6 +13,8 @@
--secondary: 240 4.8% 95.9%;
--secondary-foreground: 0 35.9% 50%;
--secondary-highlight: 0 0% 92%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--muted: 240 4.8% 95.9%;
--muted-foreground: 240 3.8% 46.1%;
--accent: 240 4.8% 95.9%;
@@ -42,6 +44,8 @@
--secondary: 240 3.7% 15.9%;
--secondary-foreground: 0 0% 98%;
--secondary-highlight: 0 0% 25.9%;
+ --neutral: 0 0% 45.1%;
+ --neutral_variant: 0 0% 32.2%;
--muted: 0 0% 15%;
--muted-foreground: 240 5% 64.9%;
--accent: 12 6.5% 15.1%;