From d370e7b850d76fefb592494b6963156f27264a9c Mon Sep 17 00:00:00 2001
From: kirbo <gpgsign@kirbo.zip>
Date: Sun, 9 Jun 2024 17:40:28 -0700
Subject: [PATCH] rename to BLCK & fix styling

---
 src/assets/locales/en.json             |  2 +-
 src/pages/parts/settings/ThemePart.tsx |  6 +++---
 themes/all.ts                          |  4 ++--
 themes/list/{black.ts => blck.ts}      | 23 +++++++++++++----------
 4 files changed, 19 insertions(+), 16 deletions(-)
 rename themes/list/{black.ts => blck.ts} (93%)

diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json
index 3a8717d0..e62d0d65 100644
--- a/src/assets/locales/en.json
+++ b/src/assets/locales/en.json
@@ -546,7 +546,7 @@
         "gray": "Gray",
         "red": "Red",
         "teal": "Teal",
-        "black": "Black"
+        "blck": "BLCK"
       },
       "title": "Appearance"
     },
diff --git a/src/pages/parts/settings/ThemePart.tsx b/src/pages/parts/settings/ThemePart.tsx
index 7f99a4aa..5a509482 100644
--- a/src/pages/parts/settings/ThemePart.tsx
+++ b/src/pages/parts/settings/ThemePart.tsx
@@ -31,9 +31,9 @@ const availableThemes = [
     key: "settings.appearance.themes.gray",
   },
   {
-    id: "black",
-    selector: "theme-black",
-    key: "settings.appearance.themes.black",
+    id: "blck",
+    selector: "theme-blck",
+    key: "settings.appearance.themes.blck",
   },
 ];
 
diff --git a/themes/all.ts b/themes/all.ts
index 025cd1a3..715597af 100644
--- a/themes/all.ts
+++ b/themes/all.ts
@@ -2,12 +2,12 @@ import teal from "./list/teal";
 import blue from "./list/blue";
 import red from "./list/red";
 import gray from "./list/gray";
-import black from "./list/black";
+import blck from "./list/blck";
 
 export const allThemes = [
   teal,
   blue,
   gray,
   red,
-  black
+  blck
 ]
diff --git a/themes/list/black.ts b/themes/list/blck.ts
similarity index 93%
rename from themes/list/black.ts
rename to themes/list/blck.ts
index e56f9fbd..5c3a09e2 100644
--- a/themes/list/black.ts
+++ b/themes/list/blck.ts
@@ -4,10 +4,13 @@ const tokens = {
   white: "#FFFFFF",
   black: {
     c50: "#000000",
+    c75: "#030303",
+    c80: "#080808",
     c100: "#0d0d0d",
     c125: "#141414",
     c150: "#1a1a1a",
-    c200: "#262626"
+    c200: "#262626",
+    c250: "#333333"
   },
   semantic: {
     silver: {
@@ -68,7 +71,7 @@ const tokens = {
 }
 
 export default createTheme({
-  name: "black",
+  name: "blck",
   extend: {
     colors: {
       themePreview: {
@@ -104,11 +107,11 @@ export default createTheme({
       },
 
       background: {
-        main: tokens.black.c50,
-        secondary: tokens.black.c50,
-        secondaryHover: tokens.black.c50,
-        accentA: tokens.black.c50,
-        accentB: tokens.black.c50
+        main: tokens.black.c75,
+        secondary: tokens.black.c75,
+        secondaryHover: tokens.black.c75,
+        accentA: tokens.black.c75,
+        accentB: tokens.black.c75
       },
 
       modal: {
@@ -135,7 +138,7 @@ export default createTheme({
 
       mediaCard: {
         hoverBackground: tokens.shade.c900,
-        hoverAccent: tokens.shade.c100,
+        hoverAccent: tokens.black.c250,
         hoverShadow: tokens.black.c50,
         shadow: tokens.shade.c800,
         barColor: tokens.ash.c200,
@@ -151,7 +154,7 @@ export default createTheme({
 
       dropdown: {
         background: tokens.black.c100,
-        altBackground: tokens.black.c50,
+        altBackground: tokens.black.c80,
         hoverBackground: tokens.black.c150,
         text: tokens.shade.c50,
         secondary: tokens.shade.c100,
@@ -198,7 +201,7 @@ export default createTheme({
       },
 
       errors: {
-        card: tokens.black.c50,
+        card: tokens.black.c75,
         border: tokens.ash.c500,
 
         type: {