feat: unify 8081 dashboard design system and views

2026-04-01 14:02:05 +09:00
parent 637b390024
commit fb5b0f00c2
27 changed files with 12596 additions and 818 deletions
--- a/frontend/public/styles-8081-design.css
+++ b/frontend/public/styles-8081-design.css
@@ -0,0 +1,100 @@
+.dashboard-header {
+  min-height: 68px;
+  background:
+    radial-gradient(circle at 12% 18%, rgba(242, 196, 132, 0.16), transparent 24%),
+    linear-gradient(145deg, rgba(10, 42, 34, 0.96) 0%, rgba(15, 58, 47, 0.96) 52%, rgba(26, 86, 69, 0.96) 100%);
+  color: #f7f0e4;
+  border-bottom: 1px solid rgba(242, 196, 132, 0.22);
+  backdrop-filter: blur(16px);
+  box-shadow: var(--ds-shadow-float);
+}
+
+.dashboard-header .eyebrow {
+  color: rgba(242, 196, 132, 0.94);
+}
+
+.dashboard-header h2 {
+  color: #fff7ea;
+}
+
+.nav-pill {
+  min-height: 42px;
+  padding: 0 14px;
+  border-radius: 999px;
+  border: 1px solid rgba(242, 196, 132, 0.28);
+  background: rgba(255, 255, 255, 0.08);
+  color: rgba(255, 244, 230, 0.78);
+  font-size: 14px;
+  font-weight: 800;
+}
+
+.nav-pill.active {
+  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98), rgba(245, 235, 221, 0.94));
+  border-color: rgba(242, 196, 132, 0.34);
+  color: var(--ds-ink);
+  box-shadow: var(--ds-shadow-float);
+}
+
+.nav-pill.muted {
+  color: rgba(255, 244, 230, 0.48);
+}
+
+.nav-pill:hover {
+  color: #fff7ea;
+  border-color: rgba(242, 196, 132, 0.48);
+}
+
+.header-actions {
+  border-left: 1px solid rgba(242, 196, 132, 0.2);
+}
+
+.header-date-label {
+  color: rgba(255, 244, 230, 0.72);
+}
+
+.header-date-field {
+  border: 1px solid rgba(242, 196, 132, 0.22);
+  background: rgba(255, 255, 255, 0.1);
+}
+
+.header-date-field input,
+.header-date-field select {
+  color: #fff7ea;
+}
+
+.header-date-sep {
+  color: rgba(255, 244, 230, 0.56);
+}
+
+.ghost-button {
+  border: 1px solid rgba(242, 196, 132, 0.22);
+  background: rgba(255, 255, 255, 0.08);
+  color: #fff7ea;
+}
+
+.icon-button {
+  background: rgba(255, 255, 255, 0.1);
+}
+
+.icon-button:hover {
+  background: rgba(242, 196, 132, 0.14);
+  border-color: rgba(242, 196, 132, 0.32);
+  color: #fff7ea;
+}
+
+.ghost-button-soft {
+  background: rgba(239, 228, 208, 0.92);
+}
+
+.seatmap-status[data-tone="error"] {
+  color: var(--ds-status-danger);
+}
+
+.seatmap-status[data-tone="success"] {
+  color: var(--ds-status-success);
+}
+
+.seatmap-board-wrap,
+.seatmap-dxf-canvas {
+  background: var(--ds-panel);
+}