Merge pull request #8 from DataResponsibly/accessible-frontend

soham-chitnis10 · web-flow · commit 7bda2fa8090b · 2026-05-12T19:55:50.000-04:00
switch to warm stone palette
diff --git a/client/index.html b/client/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
-    <meta name="theme-color" content="#ffffff" />
+    <meta name="theme-color" content="#fafaf9" />
     <title>Safe-Lens</title>
   </head>
   <body class="bg-bg text-fg font-mono">
diff --git a/client/src/App.jsx b/client/src/App.jsx
@@ -61,7 +61,7 @@ export default function App() {
     }
     localStorage.setItem("theme", isDark ? "dark" : "light");
     const meta = document.querySelector('meta[name="theme-color"]');
-    if (meta) meta.setAttribute("content", isDark ? "#09090b" : "#ffffff");
+    if (meta) meta.setAttribute("content", isDark ? "#0c0a09" : "#fafaf9");
   }, [isDark]);
 
   const [prompt, setPrompt] = useState("");
diff --git a/client/src/index.css b/client/src/index.css
@@ -4,23 +4,23 @@
 
 /* Light mode (default) */
 :root {
-  --color-bg: 255 255 255;
-  --color-panel: 244 244 245;
-  --color-input: 250 250 250;
-  --color-border: 161 161 170;
-  --color-fg: 24 24 27;
-  --color-accent: 37 99 235;
-  --color-danger: 220 38 38;
+  --color-bg: 250 250 249;
+  --color-panel: 245 245 244;
+  --color-input: 255 255 255;
+  --color-border: 168 162 158;
+  --color-fg: 28 25 23;
+  --color-accent: 13 148 136;
+  --color-danger: 185 28 28;
 }
 
 /* Dark mode */
 .dark {
-  --color-bg: 9 9 11;
-  --color-panel: 24 24 27;
-  --color-input: 39 39 42;
-  --color-border: 82 82 91;
-  --color-fg: 250 250 250;
-  --color-accent: 59 130 246;
+  --color-bg: 12 10 9;
+  --color-panel: 28 25 23;
+  --color-input: 41 37 36;
+  --color-border: 87 83 78;
+  --color-fg: 250 250 249;
+  --color-accent: 20 184 166;
   --color-danger: 239 68 68;
 }
 

Original file line number	Diff line number	Diff line change
`@@ -61,7 +61,7 @@ export default function App() {`
`61`	`61`	`}`
`62`	`62`	`localStorage.setItem("theme", isDark ? "dark" : "light");`
`63`	`63`	`const meta = document.querySelector('meta[name="theme-color"]');`
`64`		`- if (meta) meta.setAttribute("content", isDark ? "#09090b" : "#ffffff");`
	`64`	`+ if (meta) meta.setAttribute("content", isDark ? "#0c0a09" : "#fafaf9");`
`65`	`65`	`}, [isDark]);`
`66`	`66`
`67`	`67`	`const [prompt, setPrompt] = useState("");`