style: Update view controls styling for improved UI consistency

This commit is contained in:
MayaTheShy
2026-02-20 02:37:59 -05:00
parent 37bd17f26a
commit 5b89e0432e

View File

@@ -4,37 +4,43 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow: hidden; overflow: hidden;
background: #2c2c2c;
} }
.view-controls { .view-controls {
display: flex; display: flex;
gap: 0.5rem; gap: 0.5rem;
padding: 0.75rem; padding: 0.75rem;
background: #1e293b; background: #3b3b3b;
border-bottom: 2px solid #334155; border-bottom: 3px solid #1a1a1a;
box-shadow: inset 0 -2px 0 #555;
} }
.view-controls button { .view-controls button {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
border: none; border: 2px solid #1a1a1a;
background: #334155; background: #6b6b6b;
color: #e2e8f0; color: #e0e0e0;
border-radius: 0.375rem; border-radius: 0;
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 600; font-weight: 700;
cursor: pointer; cursor: pointer;
transition: all 0.2s; transition: all 0.1s;
font-family: 'Silkscreen', 'Courier New', monospace;
text-shadow: 1px 1px 0 #1a1a1a;
box-shadow: inset 0 -2px 0 #444, inset 0 2px 0 #888;
} }
.view-controls button:hover { .view-controls button:hover {
background: #475569; background: #7b7b7b;
transform: translateY(-1px); box-shadow: inset 0 -2px 0 #555, inset 0 2px 0 #999;
} }
.view-controls button.active { .view-controls button.active {
background: #3b82f6; background: #4a8c2a;
color: white; color: white;
box-shadow: 0 0 10px rgba(59, 130, 246, 0.5); box-shadow: inset 0 2px 0 #6ab04c, inset 0 -2px 0 #2d6b1a;
border-color: #1a1a1a;
} }
.app-content { .app-content {