feat: scaffold React frontend with login/register UI

2026-07-20 17:42:44 +00:00
parent 852a630fe0
commit 6bcdf83c4d
13 changed files with 3569 additions and 0 deletions
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -0,0 +1,84 @@
+:root {
+  color-scheme: dark;
+}
+
+body {
+  margin: 0;
+  min-height: 100vh;
+  background: #0a0a0f;
+  color: #e6e6f0;
+  font-family: Georgia, serif;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.app {
+  width: min(90vw, 420px);
+  padding: 2rem;
+  text-align: center;
+}
+
+h1 {
+  font-size: 2.5rem;
+  letter-spacing: 0.1em;
+  margin-bottom: 0.25rem;
+}
+
+.tagline {
+  opacity: 0.6;
+  margin-bottom: 2rem;
+  font-style: italic;
+}
+
+form {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  text-align: left;
+}
+
+label {
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+  font-size: 0.9rem;
+  opacity: 0.8;
+}
+
+input {
+  background: #16161f;
+  border: 1px solid #333;
+  color: inherit;
+  padding: 0.6rem;
+  border-radius: 4px;
+  font-size: 1rem;
+}
+
+button {
+  background: #2a1f3d;
+  border: 1px solid #5a3f8f;
+  color: inherit;
+  padding: 0.6rem 1rem;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 1rem;
+}
+
+button:hover {
+  background: #3a2a55;
+}
+
+.mode-toggle {
+  display: flex;
+  gap: 0.5rem;
+}
+
+.mode-toggle button.active {
+  background: #5a3f8f;
+}
+
+.error {
+  color: #ff6b6b;
+  font-size: 0.9rem;
+}