Initial Commit

1 files changed, 32 insertions, 0 deletions

diff --git a/web/src/components/ThemeToggle.tsx b/web/src/components/ThemeToggle.tsx
new file mode 100644
index 0000000..1d635e9
--- /dev/null
+++ b/web/src/components/ThemeToggle.tsx
@@ -0,0 +1,32 @@
+import React from 'react';
+import '../styles/ThemeToggle.css';
+
+interface ThemeToggleProps {
+  isDark: boolean;
+  onToggle: () => void;
+}
+
+export const ThemeToggle: React.FC<ThemeToggleProps> = ({ isDark, onToggle }) => {
+  return (
+    <button
+      className={`theme-toggle ${isDark ? 'dark' : 'light'}`}
+      onClick={onToggle}
+      aria-label={`Switch to ${isDark ? 'light' : 'dark'} theme`}
+    >
+      <div className="toggle-track">
+        <div className="toggle-thumb">
+          {isDark ? (
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
+              <circle cx="12" cy="12" r="5" />
+              <path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" />
+            </svg>
+          ) : (
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
+              <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" />
+            </svg>
+          )}
+        </div>
+      </div>
+    </button>
+  );
+}; 
\ No newline at end of file