From 6cc004311112d5578e404789ecf2f6cce67f7687 Mon Sep 17 00:00:00 2001
From: spinline <bilal.karatatr.@gmail.com>
Date: Wed, 4 Feb 2026 23:38:44 +0300
Subject: [PATCH] feat(ui): add abyss theme

---
 frontend/input.css                          |  3 +-
 frontend/public/tailwind.css                | 33 +++++++++++++++++++++
 frontend/src/components/layout/statusbar.rs |  2 +-
 3 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/frontend/input.css b/frontend/input.css
index 9203d3e..32ca84c 100644
--- a/frontend/input.css
+++ b/frontend/input.css
@@ -3,7 +3,8 @@
 
 @plugin "daisyui" {
     themes:
-        light, dark, dim, nord, cupcake, dracula, cyberpunk, emerald, sunset;
+        light, dark, dim, nord, cupcake, dracula, cyberpunk, emerald, sunset,
+        abyss;
 }
 
 @layer base {
diff --git a/frontend/public/tailwind.css b/frontend/public/tailwind.css
index 72253f7..7d24ac9 100644
--- a/frontend/public/tailwind.css
+++ b/frontend/public/tailwind.css
@@ -2761,6 +2761,39 @@
     --noise: 0;
   }
 }
+@layer base {
+  :root:has(input.theme-controller[value=abyss]:checked),[data-theme=abyss] {
+    color-scheme: dark;
+    --color-base-100: oklch(20% 0.08 209);
+    --color-base-200: oklch(15% 0.08 209);
+    --color-base-300: oklch(10% 0.08 209);
+    --color-base-content: oklch(90% 0.076 70.697);
+    --color-primary: oklch(92% 0.2653 125);
+    --color-primary-content: oklch(50% 0.2653 125);
+    --color-secondary: oklch(83.27% 0.0764 298.3);
+    --color-secondary-content: oklch(43.27% 0.0764 298.3);
+    --color-accent: oklch(43% 0 0);
+    --color-accent-content: oklch(98% 0 0);
+    --color-neutral: oklch(30% 0.08 209);
+    --color-neutral-content: oklch(90% 0.076 70.697);
+    --color-info: oklch(74% 0.16 232.661);
+    --color-info-content: oklch(29% 0.066 243.157);
+    --color-success: oklch(79% 0.209 151.711);
+    --color-success-content: oklch(26% 0.065 152.934);
+    --color-warning: oklch(84.8% 0.1962 84.62);
+    --color-warning-content: oklch(44.8% 0.1962 84.62);
+    --color-error: oklch(65% 0.1985 24.22);
+    --color-error-content: oklch(27% 0.1985 24.22);
+    --radius-selector: 2rem;
+    --radius-field: 0.25rem;
+    --radius-box: 0.5rem;
+    --size-selector: 0.25rem;
+    --size-field: 0.25rem;
+    --border: 1px;
+    --depth: 1;
+    --noise: 0;
+  }
+}
 @layer base {
   :root {
     --fx-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.34' numOctaves='4' stitchTiles='stitch'%3E%3C/feTurbulence%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23a)' opacity='0.2'%3E%3C/rect%3E%3C/svg%3E");
diff --git a/frontend/src/components/layout/statusbar.rs b/frontend/src/components/layout/statusbar.rs
index bb07758..96f40b5 100644
--- a/frontend/src/components/layout/statusbar.rs
+++ b/frontend/src/components/layout/statusbar.rs
@@ -254,7 +254,7 @@ pub fn StatusBar() -> impl IntoView {
                     >
                         {
                             let themes = vec![
-                                "light", "dark", "dim", "nord", "cupcake", "dracula", "cyberpunk", "emerald", "sunset"
+                                "light", "dark", "dim", "nord", "cupcake", "dracula", "cyberpunk", "emerald", "sunset", "abyss"
                             ];
                             let close = close_dropdown.clone();
                             themes.into_iter().map(|theme| {