Public/Live_RC
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tema

Browse Source
This commit is contained in:
larssand
2026-03-20 17:06:19 +01:00
parent ee8db954bc
commit eea545923c
1 changed files with 54 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
src/styles.css
View File

@@ -10,6 +10,15 @@
--accent-2: #ff3b30;
--ok: #26c281;
--warn: #f5a623;
--surface-soft: rgba(255, 255, 255, 0.02);
--surface-card: rgba(255, 255, 255, 0.03);
--surface-elevated: rgba(255, 255, 255, 0.025);
--field-bg: #0f1522;
--field-text: var(--text);
--table-head-bg: rgba(255, 255, 255, 0.03);
--table-hover-bg: rgba(255, 255, 255, 0.02);
--danger-soft: rgba(225, 6, 0, 0.08);
--danger-text: #ffd0d0;
--shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}
@@ -25,6 +34,15 @@ body[data-theme="nord"] {
--accent-2: #88c0d0;
--ok: #79c9a4;
--warn: #f0c674;
--surface-soft: rgba(255, 255, 255, 0.025);
--surface-card: rgba(255, 255, 255, 0.04);
--surface-elevated: rgba(255, 255, 255, 0.03);
--field-bg: #132033;
--field-text: var(--text);
--table-head-bg: rgba(255, 255, 255, 0.04);
--table-hover-bg: rgba(255, 255, 255, 0.03);
--danger-soft: rgba(191, 97, 106, 0.14);
--danger-text: #ffd8db;
--shadow: 0 12px 32px rgba(4, 10, 18, 0.42);
}
@@ -40,6 +58,15 @@ body[data-theme="light"] {
--accent-2: #ef4444;
--ok: #1f9d67;
--warn: #c98914;
--surface-soft: rgba(20, 32, 51, 0.03);
--surface-card: rgba(20, 32, 51, 0.05);
--surface-elevated: rgba(20, 32, 51, 0.04);
--field-bg: #ffffff;
--field-text: #152033;
--table-head-bg: rgba(20, 32, 51, 0.05);
--table-hover-bg: rgba(20, 32, 51, 0.03);
--danger-soft: rgba(214, 40, 40, 0.08);
--danger-text: #8e1b1b;
--shadow: 0 10px 28px rgba(27, 45, 78, 0.12);
}
@@ -124,7 +151,7 @@ body {
.nav-item {
border: 1px solid var(--line);
background: rgba(255, 255, 255, 0.02);
background: var(--surface-soft);
color: var(--text);
border-radius: 10px;
padding: 10px 12px;
@@ -202,7 +229,7 @@ body {
border-radius: 999px;
padding: 8px 12px;
font-weight: 600;
background: rgba(255, 255, 255, 0.02);
background: var(--surface-soft);
}
.topbar-right {
@@ -248,8 +275,8 @@ body {
.stat-card {
background:
linear-gradient(170deg, rgba(225, 6, 0, 0.12), transparent 40%),
linear-gradient(180deg, #151d2d 0%, #121927 100%);
linear-gradient(170deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 40%),
linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
border: 1px solid var(--line);
border-radius: 14px;
padding: 14px;
@@ -275,7 +302,7 @@ body {
}
.panel {
background: linear-gradient(180deg, #131a28 0%, #101724 100%);
background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
border: 1px solid var(--line);
border-radius: 14px;
box-shadow: var(--shadow);
@@ -319,8 +346,8 @@ body {
}
.btn {
border: 1px solid #425273;
background: linear-gradient(180deg, #1a2334 0%, #141c2b 100%);
border: 1px solid color-mix(in srgb, var(--line) 72%, var(--accent) 28%);
background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 88%, white 12%) 0%, var(--panel-2) 100%);
color: var(--text);
border-radius: 10px;
font-weight: 700;
@@ -329,7 +356,7 @@ body {
}
.btn:hover {
border-color: #60739b;
border-color: color-mix(in srgb, var(--line) 45%, var(--accent) 55%);
}
.btn-primary {
@@ -359,7 +386,7 @@ body {
padding: 12px;
border: 1px solid var(--line);
border-radius: 12px;
background: rgba(255, 255, 255, 0.025);
background: var(--surface-elevated);
}
.field-card-checkbox {
@@ -405,7 +432,7 @@ body {
padding: 10px;
border: 1px solid var(--line);
border-radius: 12px;
background: rgba(255, 255, 255, 0.025);
background: var(--surface-elevated);
display: grid;
gap: 5px;
}
@@ -564,14 +591,14 @@ body {
.race-actions-panel {
border: 1px solid var(--line);
border-radius: 12px;
background: rgba(255, 255, 255, 0.025);
background: var(--surface-elevated);
overflow: hidden;
}
.race-format-section .panel-header,
.race-summary-card .panel-header,
.race-actions-panel .panel-header {
background: rgba(255, 255, 255, 0.02);
background: var(--surface-soft);
}
.race-format-grid {
@@ -605,7 +632,7 @@ body {
padding: 10px 12px;
border: 1px solid var(--line);
border-radius: 10px;
background: rgba(255, 255, 255, 0.03);
background: var(--surface-card);
}
.race-summary-item span {
@@ -686,7 +713,7 @@ body {
padding: 14px;
border: 1px solid var(--line);
border-radius: 12px;
background: rgba(255, 255, 255, 0.03);
background: var(--surface-card);
display: grid;
gap: 8px;
}
@@ -715,10 +742,10 @@ body {
input,
select {
width: 100%;
background: #0f1522;
background: var(--field-bg);
border: 1px solid var(--line);
border-radius: 10px;
color: var(--text);
color: var(--field-text);
padding: 9px 10px;
}
@@ -737,8 +764,8 @@ select:focus {
border: 1px solid var(--line);
border-radius: 10px;
padding: 10px;
background: #0b1019;
color: #c8d6f5;
background: color-mix(in srgb, var(--panel-2) 94%, black 6%);
color: var(--text);
white-space: pre-wrap;
font-family: "SFMono-Regular", Consolas, monospace;
font-size: 0.82rem;
@@ -750,7 +777,7 @@ select:focus {
}
.data-table thead {
background: rgba(255, 255, 255, 0.03);
background: var(--table-head-bg);
}
.data-table th,
@@ -762,19 +789,19 @@ select:focus {
}
.data-table tr.passing-invalid td {
background: rgba(225, 6, 0, 0.08);
color: #ffd0d0;
background: var(--danger-soft);
color: var(--danger-text);
}
.data-table th {
color: #bdc8e3;
color: var(--muted);
font-size: 0.82rem;
text-transform: uppercase;
letter-spacing: 0.55px;
}
.data-table tbody tr:hover {
background: rgba(255, 255, 255, 0.02);
background: var(--table-hover-bg);
}
.simple-list {
@@ -792,7 +819,7 @@ select:focus {
}
.assignment-group {
background: rgba(255, 255, 255, 0.02);
background: var(--surface-soft);
border: 1px solid var(--line);
border-radius: 12px;
padding: 10px;
@@ -821,7 +848,7 @@ select:focus {
.form-error {
grid-column: 1 / -1;
margin: 0;
color: #ff9b9b;
color: color-mix(in srgb, var(--accent) 62%, white 38%);
font-size: 0.9rem;
}
@@ -844,7 +871,7 @@ select:focus {
border: 1px solid var(--line);
border-radius: 14px;
padding: 14px 16px;
background: rgba(255, 255, 255, 0.03);
background: var(--surface-card);
}
.dashboard-live-card span,
@@ -870,7 +897,7 @@ select:focus {
border: 1px solid var(--line);
border-radius: 14px;
padding: 12px;
background: rgba(255, 255, 255, 0.03);
background: var(--surface-card);
display: grid;
gap: 10px;
}