From 4edfe2bfd6e99235ee94215e018fab94c9881e75 Mon Sep 17 00:00:00 2001 From: jason Date: Sun, 8 Mar 2026 22:52:51 -0500 Subject: [PATCH] Add App CSS styles --- client/src/App.css | 79 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 79 insertions(+) create mode 100644 client/src/App.css diff --git a/client/src/App.css b/client/src/App.css new file mode 100644 index 0000000..63c75f6 --- /dev/null +++ b/client/src/App.css @@ -0,0 +1,79 @@ +.app { + min-height: 100vh; + display: flex; + flex-direction: column; +} + +.navbar { + background: var(--bg); + box-shadow: var(--shadow); + position: sticky; + top: 0; + z-index: 100; +} + +.navbar .container { + display: flex; + align-items: center; + justify-content: space-between; + padding: 1rem; +} + +.nav-brand { + display: flex; + align-items: center; + gap: 0.75rem; + color: var(--primary); + font-weight: 700; + font-size: 1.5rem; +} + +.brand-text { + letter-spacing: 0.05em; +} + +.nav-links { + display: flex; + gap: 0.5rem; +} + +.nav-link { + display: flex; + align-items: center; + gap: 0.5rem; + padding: 0.625rem 1rem; + border-radius: 0.375rem; + color: var(--text-secondary); + text-decoration: none; + font-weight: 500; + transition: all 0.2s; +} + +.nav-link:hover { + background: var(--bg-secondary); + color: var(--primary); +} + +.nav-link.active { + background: var(--primary); + color: white; +} + +.main-content { + flex: 1; + padding: 2rem 0; +} + +@media (max-width: 768px) { + .nav-links { + gap: 0.25rem; + } + + .nav-link span { + display: none; + } + + .nav-link { + padding: 0.625rem; + } +} \ No newline at end of file