updateday 0.0.0-stage → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +109 -2
- package/assets/hourglass/10m.png +0 -0
- package/assets/hourglass/12h.png +0 -0
- package/assets/hourglass/15m.png +0 -0
- package/assets/hourglass/1h.png +0 -0
- package/assets/hourglass/24h.png +0 -0
- package/assets/hourglass/2h.png +0 -0
- package/assets/hourglass/30m.png +0 -0
- package/assets/hourglass/3h.png +0 -0
- package/assets/hourglass/45m.png +0 -0
- package/assets/hourglass/4h.png +0 -0
- package/assets/hourglass/5h.png +0 -0
- package/assets/hourglass/5m.png +0 -0
- package/assets/hourglass/6h.png +0 -0
- package/assets/hourglass/default.png +0 -0
- package/assets/hourglass/now.png +0 -0
- package/assets/hourglass-styles/blocky.png +0 -0
- package/assets/hourglass-styles/classic.png +0 -0
- package/assets/hourglass-styles/glow.png +0 -0
- package/assets/hourglass-styles/outline.png +0 -0
- package/assets/hourglass-styles/pixel.png +0 -0
- package/assets/hourglass-styles/rounded.png +0 -0
- package/bin/updateday.js +5 -0
- package/dist/bundle.js +54 -0
- package/dist/cli.js +254 -0
- package/dist/config.js +261 -0
- package/dist/doctor.js +119 -0
- package/dist/experiments.js +349 -0
- package/dist/gamePage.js +143 -0
- package/dist/gifts.js +55 -0
- package/dist/history.js +68 -0
- package/dist/icons.js +216 -0
- package/dist/labels.js +64 -0
- package/dist/mcp.js +302 -0
- package/dist/moderation.js +86 -0
- package/dist/notify.js +72 -0
- package/dist/openCloud.js +211 -0
- package/dist/playerData.js +109 -0
- package/dist/preflight.js +202 -0
- package/dist/runner.js +360 -0
- package/dist/schedule.js +162 -0
- package/dist/server.js +929 -0
- package/dist/state.js +29 -0
- package/dist/swap.js +196 -0
- package/dist/zip.js +82 -0
- package/docs/AGENTS.md +123 -0
- package/docs/COVERAGE.md +50 -0
- package/docs/GUIDE.md +288 -0
- package/docs/hourglass-styles.png +0 -0
- package/docs/screenshot.png +0 -0
- package/example/multi-game.json +16 -0
- package/example/updateday.json +37 -0
- package/package.json +63 -5
- package/roblox/UpdateDayBanner.client.luau +159 -0
- package/roblox/UpdateDayCountdown.server.luau +48 -0
- package/roblox/UpdateDayGifts.luau +119 -0
- package/roblox/UpdateDayListener.luau +43 -0
- package/templates/github-actions/updateday.yml +35 -0
- package/ui/core.js +325 -0
- package/ui/countdown.js +775 -0
- package/ui/events.js +249 -0
- package/ui/gifts.js +215 -0
- package/ui/history.js +156 -0
- package/ui/index.html +530 -0
- package/ui/jsonEditor.js +417 -0
- package/ui/page.js +94 -0
- package/ui/players.js +256 -0
- package/ui/run.js +391 -0
- package/ui/sale.js +366 -0
- package/ui/settings.js +414 -0
- package/ui/shell.js +193 -0
package/ui/index.html
ADDED
|
@@ -0,0 +1,530 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
+
<title>UpdateDay</title>
|
|
7
|
+
<style>
|
|
8
|
+
:root {
|
|
9
|
+
--bg: #0b0d12;
|
|
10
|
+
--surface: #12151c;
|
|
11
|
+
--surface-2: #181c25;
|
|
12
|
+
--surface-3: #1f2430;
|
|
13
|
+
--border: #262c38;
|
|
14
|
+
--border-strong: #343b4a;
|
|
15
|
+
--text: #e9ecf2;
|
|
16
|
+
--text-2: #a7afbf;
|
|
17
|
+
--text-3: #737c8f;
|
|
18
|
+
--accent: #4c8dff;
|
|
19
|
+
--accent-hover: #3d7ef2;
|
|
20
|
+
--accent-soft: rgba(76, 141, 255, 0.14);
|
|
21
|
+
--on-accent: #ffffff;
|
|
22
|
+
--success: #2fbf71;
|
|
23
|
+
--success-soft: rgba(47, 191, 113, 0.14);
|
|
24
|
+
--warning: #f0b232;
|
|
25
|
+
--warning-soft: rgba(240, 178, 50, 0.14);
|
|
26
|
+
--danger: #f0555a;
|
|
27
|
+
--danger-soft: rgba(240, 85, 90, 0.14);
|
|
28
|
+
--shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
|
|
29
|
+
--radius-lg: 14px;
|
|
30
|
+
--radius: 10px;
|
|
31
|
+
--radius-sm: 7px;
|
|
32
|
+
--sidebar: 264px;
|
|
33
|
+
--runbar: 64px;
|
|
34
|
+
--font: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
35
|
+
--mono: ui-monospace, "Cascadia Code", Consolas, monospace;
|
|
36
|
+
color-scheme: dark;
|
|
37
|
+
}
|
|
38
|
+
@media (prefers-color-scheme: light) {
|
|
39
|
+
:root:not([data-theme="dark"]) {
|
|
40
|
+
--bg: #f5f6f8;
|
|
41
|
+
--surface: #ffffff;
|
|
42
|
+
--surface-2: #f3f5f8;
|
|
43
|
+
--surface-3: #e9edf2;
|
|
44
|
+
--border: #e2e6ec;
|
|
45
|
+
--border-strong: #cfd5de;
|
|
46
|
+
--text: #111520;
|
|
47
|
+
--text-2: #4b5466;
|
|
48
|
+
--text-3: #7a8394;
|
|
49
|
+
--accent: #2563eb;
|
|
50
|
+
--accent-hover: #1d4fd0;
|
|
51
|
+
--accent-soft: rgba(37, 99, 235, 0.1);
|
|
52
|
+
--success: #148a4b;
|
|
53
|
+
--success-soft: rgba(20, 138, 75, 0.1);
|
|
54
|
+
--warning: #b07206;
|
|
55
|
+
--warning-soft: rgba(176, 114, 6, 0.1);
|
|
56
|
+
--danger: #d22d33;
|
|
57
|
+
--danger-soft: rgba(210, 45, 51, 0.08);
|
|
58
|
+
--shadow: 0 8px 30px rgba(17, 21, 32, 0.12);
|
|
59
|
+
color-scheme: light;
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
:root[data-theme="light"] {
|
|
63
|
+
--bg: #f5f6f8;
|
|
64
|
+
--surface: #ffffff;
|
|
65
|
+
--surface-2: #f3f5f8;
|
|
66
|
+
--surface-3: #e9edf2;
|
|
67
|
+
--border: #e2e6ec;
|
|
68
|
+
--border-strong: #cfd5de;
|
|
69
|
+
--text: #111520;
|
|
70
|
+
--text-2: #4b5466;
|
|
71
|
+
--text-3: #7a8394;
|
|
72
|
+
--accent: #2563eb;
|
|
73
|
+
--accent-hover: #1d4fd0;
|
|
74
|
+
--accent-soft: rgba(37, 99, 235, 0.1);
|
|
75
|
+
--success: #148a4b;
|
|
76
|
+
--success-soft: rgba(20, 138, 75, 0.1);
|
|
77
|
+
--warning: #b07206;
|
|
78
|
+
--warning-soft: rgba(176, 114, 6, 0.1);
|
|
79
|
+
--danger: #d22d33;
|
|
80
|
+
--danger-soft: rgba(210, 45, 51, 0.08);
|
|
81
|
+
--shadow: 0 8px 30px rgba(17, 21, 32, 0.12);
|
|
82
|
+
color-scheme: light;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
* { box-sizing: border-box; }
|
|
86
|
+
html, body { margin: 0; }
|
|
87
|
+
body {
|
|
88
|
+
background: var(--bg);
|
|
89
|
+
color: var(--text);
|
|
90
|
+
font: 14px/1.5 var(--font);
|
|
91
|
+
-webkit-font-smoothing: antialiased;
|
|
92
|
+
padding-bottom: var(--runbar);
|
|
93
|
+
}
|
|
94
|
+
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
|
|
95
|
+
a { color: var(--accent); }
|
|
96
|
+
h1, h2, h3 { margin: 0; font-weight: 650; letter-spacing: -0.01em; }
|
|
97
|
+
p { margin: 0 0 8px; }
|
|
98
|
+
code { font-family: var(--mono); font-size: 12px; background: var(--surface-3); padding: 1px 6px; border-radius: 5px; }
|
|
99
|
+
[hidden] { display: none !important; }
|
|
100
|
+
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
|
|
101
|
+
|
|
102
|
+
.topbar {
|
|
103
|
+
position: sticky; top: 0; z-index: 20;
|
|
104
|
+
display: flex; align-items: center; gap: 14px;
|
|
105
|
+
height: 56px; padding: 0 16px 0 20px;
|
|
106
|
+
background: color-mix(in srgb, var(--surface) 88%, transparent);
|
|
107
|
+
backdrop-filter: blur(10px);
|
|
108
|
+
border-bottom: 1px solid var(--border);
|
|
109
|
+
}
|
|
110
|
+
.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16px; }
|
|
111
|
+
.brand svg { width: 26px; height: 26px; }
|
|
112
|
+
.topbar .spacer { flex: 1; }
|
|
113
|
+
.save-status { font-size: 12.5px; color: var(--text-3); display: flex; align-items: center; gap: 6px; }
|
|
114
|
+
.save-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--success); }
|
|
115
|
+
.save-status[data-state="dirty"] { color: var(--warning); }
|
|
116
|
+
.save-status[data-state="dirty"]::before { background: var(--warning); }
|
|
117
|
+
.save-status[data-state="error"] { color: var(--danger); }
|
|
118
|
+
.save-status[data-state="error"]::before { background: var(--danger); }
|
|
119
|
+
.mobile-games { display: none; }
|
|
120
|
+
|
|
121
|
+
.layout { display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr); min-height: calc(100vh - 56px - var(--runbar)); }
|
|
122
|
+
.sidebar {
|
|
123
|
+
position: sticky; top: 56px; align-self: start;
|
|
124
|
+
height: calc(100vh - 56px - var(--runbar));
|
|
125
|
+
display: flex; flex-direction: column; gap: 4px;
|
|
126
|
+
padding: 16px 12px; border-right: 1px solid var(--border); overflow: auto;
|
|
127
|
+
}
|
|
128
|
+
.sidebar-label { font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-3); padding: 4px 10px 8px; }
|
|
129
|
+
.game-item {
|
|
130
|
+
display: grid; grid-template-columns: 40px 1fr; gap: 10px; align-items: center;
|
|
131
|
+
width: 100%; text-align: left; padding: 8px 10px; border-radius: var(--radius);
|
|
132
|
+
background: none; border: 1px solid transparent; color: var(--text); cursor: pointer; font: inherit;
|
|
133
|
+
}
|
|
134
|
+
.game-item:hover { background: var(--surface-2); }
|
|
135
|
+
.game-item[aria-current="true"] { background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
|
|
136
|
+
.game-thumb { width: 40px; height: 40px; border-radius: 9px; background: var(--surface-3); object-fit: cover; display: block; }
|
|
137
|
+
.game-item .name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
138
|
+
.game-item .sub { font-size: 12px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
139
|
+
.sidebar .add { margin-top: 6px; }
|
|
140
|
+
.sidebar-foot { margin-top: auto; padding: 10px; font-size: 11.5px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
141
|
+
|
|
142
|
+
.main { min-width: 0; padding: 22px 28px 40px; max-width: 1240px; width: 100%; }
|
|
143
|
+
.game-header { display: flex; gap: 16px; align-items: center; margin-bottom: 18px; }
|
|
144
|
+
.game-header .game-thumb { width: 60px; height: 60px; border-radius: 14px; }
|
|
145
|
+
.game-header h1 { font-size: 22px; }
|
|
146
|
+
.game-header .meta { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
|
|
147
|
+
|
|
148
|
+
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--border); margin-bottom: 22px; overflow-x: auto; scrollbar-width: none; }
|
|
149
|
+
.tabs::-webkit-scrollbar { display: none; }
|
|
150
|
+
.tab {
|
|
151
|
+
background: none; border: 0; border-bottom: 2px solid transparent; color: var(--text-2);
|
|
152
|
+
padding: 10px 14px; font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap; margin-bottom: -1px;
|
|
153
|
+
}
|
|
154
|
+
.tab:hover { color: var(--text); }
|
|
155
|
+
.tab[aria-selected="true"] { color: var(--text); border-bottom-color: var(--accent); }
|
|
156
|
+
|
|
157
|
+
.grid-2 { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
|
|
158
|
+
.stack { display: flex; flex-direction: column; gap: 16px; }
|
|
159
|
+
.row { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
|
|
160
|
+
.row > .field { flex: 1 1 180px; }
|
|
161
|
+
|
|
162
|
+
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 18px; }
|
|
163
|
+
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
|
|
164
|
+
.card-head h2 { font-size: 15px; }
|
|
165
|
+
.card-head .hint { margin: 2px 0 0; }
|
|
166
|
+
.card-section + .card-section { border-top: 1px solid var(--border); margin-top: 16px; padding-top: 16px; }
|
|
167
|
+
.section-title { font-size: 12px; font-weight: 650; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-3); margin-bottom: 10px; }
|
|
168
|
+
|
|
169
|
+
.field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; min-width: 0; }
|
|
170
|
+
.field > span, .field-label { font-size: 12.5px; font-weight: 550; color: var(--text-2); }
|
|
171
|
+
.hint { font-size: 12.5px; color: var(--text-3); line-height: 1.45; }
|
|
172
|
+
input[type=text], input[type=number], input[type=datetime-local], input[type=password], input[type=search], input[type=date], select, textarea {
|
|
173
|
+
width: 100%; min-width: 0; background: var(--surface-2); color: var(--text);
|
|
174
|
+
border: 1px solid var(--border); border-radius: var(--radius-sm);
|
|
175
|
+
padding: 9px 11px; font: inherit; transition: border-color 0.15s, box-shadow 0.15s;
|
|
176
|
+
}
|
|
177
|
+
input:hover, select:hover, textarea:hover { border-color: var(--border-strong); }
|
|
178
|
+
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
|
|
179
|
+
input[type=range] { width: 100%; accent-color: var(--accent); }
|
|
180
|
+
textarea { line-height: 1.5; resize: vertical; }
|
|
181
|
+
.mono { font-family: var(--mono); font-size: 12.5px; }
|
|
182
|
+
textarea.mono { line-height: 1.55; min-height: 280px; }
|
|
183
|
+
input[type=file] { font: inherit; font-size: 13px; color: var(--text-2); }
|
|
184
|
+
input[type=file]::file-selector-button { font: inherit; font-weight: 600; margin-right: 10px; padding: 7px 12px; border-radius: var(--radius-sm); border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--text); cursor: pointer; }
|
|
185
|
+
.range-row { display: grid; grid-template-columns: 110px minmax(0, 1fr) 48px; gap: 10px; align-items: center; margin-bottom: 10px; }
|
|
186
|
+
.range-row output { text-align: right; font-variant-numeric: tabular-nums; color: var(--text-2); font-size: 13px; }
|
|
187
|
+
|
|
188
|
+
.btn {
|
|
189
|
+
display: inline-flex; align-items: center; justify-content: center; gap: 6px;
|
|
190
|
+
height: 36px; padding: 0 14px; border-radius: var(--radius-sm);
|
|
191
|
+
border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--text);
|
|
192
|
+
font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap; text-decoration: none;
|
|
193
|
+
transition: background 0.15s, border-color 0.15s;
|
|
194
|
+
}
|
|
195
|
+
.btn:hover { background: var(--surface-3); }
|
|
196
|
+
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
|
|
197
|
+
.btn-primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
|
|
198
|
+
.btn-primary:hover { background: var(--accent-hover); }
|
|
199
|
+
.btn-danger { background: var(--danger); border-color: var(--danger); color: #fff; }
|
|
200
|
+
.btn-danger-ghost { color: var(--danger); }
|
|
201
|
+
.btn-danger-ghost:hover { background: var(--danger-soft); }
|
|
202
|
+
.btn-ghost { background: none; border-color: transparent; color: var(--text-2); }
|
|
203
|
+
.btn-ghost:hover { background: var(--surface-2); color: var(--text); }
|
|
204
|
+
.btn-sm { height: 30px; padding: 0 10px; font-size: 13px; }
|
|
205
|
+
.btn-block { width: 100%; }
|
|
206
|
+
.icon-btn { background: none; border: 0; color: inherit; cursor: pointer; padding: 4px 8px; border-radius: 6px; font: inherit; font-size: 16px; }
|
|
207
|
+
.icon-btn:hover { background: var(--surface-3); }
|
|
208
|
+
.link-btn { background: none; border: 0; padding: 0; color: var(--accent); font: inherit; font-size: 12.5px; cursor: pointer; }
|
|
209
|
+
.link-btn:hover { text-decoration: underline; }
|
|
210
|
+
|
|
211
|
+
.switch-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 0; cursor: pointer; }
|
|
212
|
+
.switch-text { display: flex; flex-direction: column; gap: 2px; }
|
|
213
|
+
.switch-label { font-weight: 550; }
|
|
214
|
+
.switch {
|
|
215
|
+
appearance: none; flex: none; width: 38px; height: 22px; border-radius: 99px; margin: 0;
|
|
216
|
+
background: var(--surface-3); border: 1px solid var(--border-strong); position: relative; cursor: pointer; transition: background 0.15s;
|
|
217
|
+
}
|
|
218
|
+
.switch::after {
|
|
219
|
+
content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%;
|
|
220
|
+
background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.3); transition: transform 0.15s;
|
|
221
|
+
}
|
|
222
|
+
.switch:checked { background: var(--accent); border-color: var(--accent); }
|
|
223
|
+
.switch:checked::after { transform: translateX(16px); }
|
|
224
|
+
.revealed { padding: 4px 0 4px 14px; margin: 4px 0 8px; border-left: 2px solid var(--border); }
|
|
225
|
+
|
|
226
|
+
.segmented { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 9px; }
|
|
227
|
+
.segmented button { border: 0; background: none; color: var(--text-2); font: inherit; font-weight: 600; font-size: 13px; padding: 6px 12px; border-radius: 7px; cursor: pointer; }
|
|
228
|
+
.segmented button:hover { color: var(--text); }
|
|
229
|
+
.segmented button.active { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(0,0,0,0.25); }
|
|
230
|
+
|
|
231
|
+
.choice-list { display: flex; flex-direction: column; gap: 8px; }
|
|
232
|
+
.choice { display: flex; gap: 12px; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); cursor: pointer; background: var(--surface); }
|
|
233
|
+
.choice:hover { border-color: var(--border-strong); }
|
|
234
|
+
.choice:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
|
|
235
|
+
.choice input { accent-color: var(--accent); margin-top: 3px; }
|
|
236
|
+
.choice b { display: block; }
|
|
237
|
+
|
|
238
|
+
.badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; padding: 2px 9px; border-radius: 99px; background: var(--surface-3); color: var(--text-2); white-space: nowrap; }
|
|
239
|
+
.badge-success { background: var(--success-soft); color: var(--success); }
|
|
240
|
+
.badge-warning { background: var(--warning-soft); color: var(--warning); }
|
|
241
|
+
.badge-danger { background: var(--danger-soft); color: var(--danger); }
|
|
242
|
+
.badge-accent { background: var(--accent-soft); color: var(--accent); }
|
|
243
|
+
|
|
244
|
+
.callout { padding: 11px 14px; border-radius: var(--radius); font-size: 13px; border: 1px solid; margin-bottom: 14px; }
|
|
245
|
+
.callout-danger { background: var(--danger-soft); border-color: color-mix(in srgb, var(--danger) 35%, transparent); color: var(--danger); }
|
|
246
|
+
.callout-warning { background: var(--warning-soft); border-color: color-mix(in srgb, var(--warning) 35%, transparent); color: var(--text); }
|
|
247
|
+
.callout-info { background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 30%, transparent); color: var(--text); }
|
|
248
|
+
|
|
249
|
+
.empty { text-align: center; padding: 36px 16px; color: var(--text-2); }
|
|
250
|
+
.empty-title { font-weight: 650; color: var(--text); margin-bottom: 4px; }
|
|
251
|
+
.empty-text { font-size: 13px; color: var(--text-3); max-width: 420px; margin: 0 auto 14px; }
|
|
252
|
+
|
|
253
|
+
.live { display: grid; grid-template-columns: 148px 1fr; gap: 20px; align-items: center; }
|
|
254
|
+
.live img { width: 148px; height: 148px; border-radius: 22px; box-shadow: var(--shadow); background: var(--surface-3); }
|
|
255
|
+
.eyebrow { font-size: 12px; color: var(--text-3); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
|
|
256
|
+
.live .timer { font: 700 40px/1.1 var(--mono); letter-spacing: 0.02em; margin: 6px 0 4px; }
|
|
257
|
+
.progress { height: 6px; border-radius: 99px; background: var(--surface-3); overflow: hidden; margin-top: 12px; }
|
|
258
|
+
.progress > div { height: 100%; background: var(--accent); border-radius: 99px; transition: width 1s linear; }
|
|
259
|
+
|
|
260
|
+
.stages { display: grid; grid-template-columns: repeat(auto-fill, minmax(116px, 1fr)); gap: 12px; }
|
|
261
|
+
.stage {
|
|
262
|
+
position: relative; display: flex; flex-direction: column; gap: 2px; padding: 6px 6px 8px;
|
|
263
|
+
border-radius: 12px; border: 1px solid transparent; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer;
|
|
264
|
+
}
|
|
265
|
+
.stage:hover { background: var(--surface-2); border-color: var(--border); }
|
|
266
|
+
.stage img { width: 100%; aspect-ratio: 1; border-radius: 10px; display: block; background: var(--surface-3); margin-bottom: 6px; }
|
|
267
|
+
.stage .stage-name { font-weight: 650; font-size: 13px; }
|
|
268
|
+
.stage .stage-when { font-size: 11.5px; color: var(--text-3); }
|
|
269
|
+
.stage .tick { position: absolute; top: 12px; left: 12px; width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; background: var(--accent); color: #fff; font-size: 13px; font-weight: 700; box-shadow: 0 1px 4px rgba(0,0,0,0.4); }
|
|
270
|
+
.stage[aria-pressed="false"] img { opacity: 0.35; filter: grayscale(0.6); }
|
|
271
|
+
.stage[aria-pressed="false"] .tick { background: var(--surface); border: 2px solid var(--border-strong); color: transparent; }
|
|
272
|
+
.stage[aria-pressed="false"] .stage-name { color: var(--text-3); }
|
|
273
|
+
.stage .state { position: absolute; top: 12px; right: 12px; }
|
|
274
|
+
.stage.fixed { cursor: default; }
|
|
275
|
+
.stage.fixed:hover { background: none; border-color: transparent; }
|
|
276
|
+
|
|
277
|
+
.list { display: flex; flex-direction: column; }
|
|
278
|
+
.list-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border); }
|
|
279
|
+
.list-row:last-child { border-bottom: 0; }
|
|
280
|
+
.timeline .list-row { grid-template-columns: 160px minmax(0, 1fr) auto; font-size: 13px; }
|
|
281
|
+
.timeline .when { color: var(--text-3); }
|
|
282
|
+
.history-row { grid-template-columns: 96px minmax(0, 1fr) auto; font-size: 13.5px; }
|
|
283
|
+
|
|
284
|
+
.items { border: 1px solid var(--border); border-radius: var(--radius); max-height: 460px; overflow: auto; }
|
|
285
|
+
.item-row { display: grid; grid-template-columns: 22px 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 12px; border-bottom: 1px solid var(--border); cursor: pointer; }
|
|
286
|
+
.item-row:last-child { border-bottom: 0; }
|
|
287
|
+
.item-row:hover { background: var(--surface-2); }
|
|
288
|
+
.item-row input { accent-color: var(--accent); width: 16px; height: 16px; }
|
|
289
|
+
.item-row img { width: 36px; height: 36px; border-radius: 8px; background: var(--surface-3); }
|
|
290
|
+
.item-row .kind { font-size: 11px; color: var(--text-3); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
|
|
291
|
+
.item-row .price { text-align: right; font-variant-numeric: tabular-nums; }
|
|
292
|
+
.item-row .price s { color: var(--text-3); margin-right: 8px; }
|
|
293
|
+
.item-row .price b { color: var(--success); }
|
|
294
|
+
.item-row.off { opacity: 0.5; }
|
|
295
|
+
.items-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
|
|
296
|
+
|
|
297
|
+
.checks { list-style: none; margin: 0; padding: 0; }
|
|
298
|
+
.check { display: grid; grid-template-columns: 24px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--border); }
|
|
299
|
+
.check:last-child { border-bottom: 0; }
|
|
300
|
+
.check .dot { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: var(--surface-3); color: var(--text-2); }
|
|
301
|
+
.check.ok .dot { background: var(--success-soft); color: var(--success); }
|
|
302
|
+
.check.warn .dot { background: var(--warning-soft); color: var(--warning); }
|
|
303
|
+
.check.bad .dot { background: var(--danger-soft); color: var(--danger); }
|
|
304
|
+
|
|
305
|
+
.page-hero { display: flex; gap: 16px; align-items: center; margin-bottom: 16px; }
|
|
306
|
+
.page-hero img { width: 84px; height: 84px; border-radius: 18px; background: var(--surface-3); }
|
|
307
|
+
.page-hero .title { font-size: 20px; font-weight: 700; }
|
|
308
|
+
.thumbs { display: flex; gap: 10px; overflow-x: auto; margin-bottom: 16px; }
|
|
309
|
+
.thumbs img { height: 128px; border-radius: 10px; }
|
|
310
|
+
.thumb-empty { flex: 1; height: 128px; display: grid; place-items: center; border: 1px dashed var(--border-strong); border-radius: 10px; color: var(--text-3); }
|
|
311
|
+
.stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 12px; margin-bottom: 16px; }
|
|
312
|
+
.stat { display: flex; flex-direction: column; }
|
|
313
|
+
.stat span { font-size: 12px; color: var(--text-3); }
|
|
314
|
+
.stat b { font-size: 16px; font-variant-numeric: tabular-nums; }
|
|
315
|
+
.page-desc { white-space: pre-wrap; font-size: 13.5px; color: var(--text-2); }
|
|
316
|
+
|
|
317
|
+
.event-row { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--border); }
|
|
318
|
+
.event-row:last-child { border-bottom: 0; }
|
|
319
|
+
.date-badge { text-align: center; border: 1px solid var(--border); border-radius: 10px; padding: 4px 0; }
|
|
320
|
+
.date-badge span { display: block; font-size: 11px; font-weight: 700; color: var(--accent); text-transform: uppercase; }
|
|
321
|
+
.date-badge b { font-size: 19px; }
|
|
322
|
+
|
|
323
|
+
.player { display: flex; gap: 12px; align-items: center; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-2); margin-bottom: 14px; }
|
|
324
|
+
.player img { width: 48px; height: 48px; border-radius: 50%; background: var(--surface-3); }
|
|
325
|
+
.player .grow { flex: 1; min-width: 0; }
|
|
326
|
+
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
|
|
327
|
+
.chip { border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font: inherit; font-weight: 600; font-size: 13px; padding: 6px 12px; border-radius: 99px; cursor: pointer; }
|
|
328
|
+
.chip:hover { color: var(--text); }
|
|
329
|
+
.chip.active { background: var(--accent); border-color: var(--accent); color: #fff; }
|
|
330
|
+
.cat-row { display: grid; grid-template-columns: 110px minmax(0, 1fr) 180px auto; gap: 8px; align-items: center; margin-bottom: 8px; }
|
|
331
|
+
|
|
332
|
+
.reminder { display: grid; grid-template-columns: 64px 1fr auto; gap: 14px; align-items: center; padding: 12px; border: 1px solid color-mix(in srgb, var(--warning) 45%, transparent); background: var(--warning-soft); border-radius: var(--radius); margin-bottom: 16px; }
|
|
333
|
+
.reminder img { width: 64px; height: 64px; border-radius: 12px; }
|
|
334
|
+
|
|
335
|
+
.runbar {
|
|
336
|
+
position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
|
|
337
|
+
background: var(--surface); border-top: 1px solid var(--border); box-shadow: 0 -6px 20px rgba(0,0,0,0.12);
|
|
338
|
+
}
|
|
339
|
+
.runbar-main { display: flex; align-items: center; gap: 12px; height: var(--runbar); padding: 0 16px 0 20px; }
|
|
340
|
+
.run-state { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; }
|
|
341
|
+
.pulse { width: 10px; height: 10px; border-radius: 50%; background: var(--text-3); flex: none; }
|
|
342
|
+
.pulse.on { background: var(--success); animation: pulse 1.8s infinite; }
|
|
343
|
+
@keyframes pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--success) 60%, transparent); } 100% { box-shadow: 0 0 0 10px transparent; } }
|
|
344
|
+
@media (prefers-reduced-motion: reduce) { .pulse.on { animation: none; } .progress > div { transition: none; } .skeleton { animation: none; } }
|
|
345
|
+
.run-text { min-width: 0; }
|
|
346
|
+
.run-text b { display: block; white-space: nowrap; }
|
|
347
|
+
.run-text span { font-size: 12.5px; color: var(--text-3); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
348
|
+
.run-actions { display: flex; gap: 8px; align-items: center; }
|
|
349
|
+
.drawer { border-top: 1px solid var(--border); max-height: 0; overflow: hidden; transition: max-height 0.2s; }
|
|
350
|
+
.drawer.open { max-height: 56vh; overflow: auto; }
|
|
351
|
+
.drawer-inner { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 20px; padding: 16px 20px 20px; }
|
|
352
|
+
.log { background: #090b0f; color: #c9d1e0; border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; font: 12px/1.6 var(--mono); height: 300px; overflow: auto; white-space: pre-wrap; margin: 0; }
|
|
353
|
+
.log .t { color: #6f7a8e; }
|
|
354
|
+
.log .err { color: #ff8b8f; }
|
|
355
|
+
.log .run { color: #8fb8ff; }
|
|
356
|
+
.log .warn { color: #f0c46b; }
|
|
357
|
+
.key-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-bottom: 10px; }
|
|
358
|
+
|
|
359
|
+
.toasts { position: fixed; right: 18px; bottom: calc(var(--runbar) + 16px); z-index: 50; display: flex; flex-direction: column; gap: 8px; max-width: min(420px, calc(100vw - 36px)); }
|
|
360
|
+
.toast { display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; padding: 11px 12px 11px 14px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--border-strong); box-shadow: var(--shadow); font-size: 13.5px; }
|
|
361
|
+
.toast .icon-btn { font-size: 12px; }
|
|
362
|
+
.toast-success { border-left: 3px solid var(--success); }
|
|
363
|
+
.toast-danger { border-left: 3px solid var(--danger); }
|
|
364
|
+
.toast-info { border-left: 3px solid var(--accent); }
|
|
365
|
+
dialog { border: 1px solid var(--border-strong); border-radius: var(--radius-lg); background: var(--surface); color: var(--text); padding: 0; width: min(460px, calc(100vw - 32px)); box-shadow: var(--shadow); }
|
|
366
|
+
dialog::backdrop { background: rgba(5, 7, 10, 0.55); backdrop-filter: blur(2px); }
|
|
367
|
+
.dialog-body { padding: 22px; }
|
|
368
|
+
.dialog-body h2 { font-size: 17px; margin-bottom: 8px; }
|
|
369
|
+
.dialog-text { color: var(--text-2); margin-bottom: 18px; max-height: 62vh; overflow: auto; }
|
|
370
|
+
.check.info .dot { background: var(--accent-soft); color: var(--accent); }
|
|
371
|
+
.dialog-text pre { font: 12px/1.5 var(--mono); background: var(--surface-2); border: 1px solid var(--border); border-radius: 8px; padding: 10px; white-space: pre-wrap; max-height: 240px; overflow: auto; }
|
|
372
|
+
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; }
|
|
373
|
+
|
|
374
|
+
.stage .stage-mod { position: absolute; left: 12px; bottom: 52px; font-size: 10.5px; padding: 1px 7px; }
|
|
375
|
+
.title-rows { display: flex; flex-direction: column; gap: 6px; max-height: 260px; overflow: auto; }
|
|
376
|
+
.title-row { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 10px; align-items: center; font-size: 13px; }
|
|
377
|
+
.title-row .badge { justify-content: center; }
|
|
378
|
+
.look-preview { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 16px; }
|
|
379
|
+
.look-preview img { width: min(260px, 100%); aspect-ratio: 1; border-radius: 22px; background: var(--surface-3); box-shadow: var(--shadow); }
|
|
380
|
+
.look-preview .chips { justify-content: center; }
|
|
381
|
+
.look-preview .chip { padding: 4px 10px; font-size: 12px; }
|
|
382
|
+
.style-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
|
|
383
|
+
.style-tile { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 6px 8px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface-2); color: var(--text-2); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
|
|
384
|
+
.style-tile:hover { border-color: var(--border-strong); color: var(--text); }
|
|
385
|
+
.style-tile.active { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); color: var(--text); }
|
|
386
|
+
.style-tile img { width: 40px; height: 40px; object-fit: contain; filter: drop-shadow(0 0 1px rgba(0,0,0,0.6)); background: #3a3f4b; border-radius: 8px; padding: 3px; }
|
|
387
|
+
.style-own { width: 40px; height: 40px; display: grid; place-items: center; border: 1px dashed var(--border-strong); border-radius: 8px; font-size: 20px; }
|
|
388
|
+
.stage-text { margin-top: 12px; }
|
|
389
|
+
.stage-text summary { cursor: pointer; font-weight: 600; font-size: 13px; }
|
|
390
|
+
.stage-text-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
|
|
391
|
+
.stage-text-row { display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 8px; align-items: center; font-size: 12.5px; color: var(--text-2); }
|
|
392
|
+
.stage-text-row input { padding: 6px 9px !important; font-size: 12.5px; }
|
|
393
|
+
.art-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 10px; margin-bottom: 14px; }
|
|
394
|
+
.art-slot { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; min-width: 0; }
|
|
395
|
+
.art-pick { width: 64px; height: 64px; border-radius: 12px; border: 1px dashed var(--border-strong); background: var(--surface-2); display: grid; place-items: center; cursor: pointer; padding: 0; overflow: hidden; color: var(--text-3); }
|
|
396
|
+
.art-pick:hover { border-color: var(--accent); color: var(--accent); }
|
|
397
|
+
.art-slot.has-art .art-pick { border-style: solid; background: repeating-conic-gradient(var(--surface-3) 0% 25%, var(--surface-2) 0% 50%) 50% / 12px 12px; }
|
|
398
|
+
.art-pick img { width: 100%; height: 100%; object-fit: contain; }
|
|
399
|
+
.art-empty { font-size: 22px; line-height: 1; }
|
|
400
|
+
.art-name { font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
|
|
401
|
+
.art-note { font-size: 11px; color: var(--text-3); }
|
|
402
|
+
.art-remove { font-size: 11px; }
|
|
403
|
+
.je { --je-bool: color-mix(in srgb, var(--accent) 55%, var(--danger)); }
|
|
404
|
+
.je-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
|
|
405
|
+
.je-spacer { flex: 1; }
|
|
406
|
+
.je-search { max-width: 260px; padding: 7px 10px !important; }
|
|
407
|
+
.je-status { font-size: 12.5px; color: var(--danger); }
|
|
408
|
+
.je-status[data-ok="true"] { color: var(--success); }
|
|
409
|
+
.je-body { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
|
|
410
|
+
.je-fields { padding: 6px; max-height: 560px; overflow: auto; }
|
|
411
|
+
.je-row { display: grid; grid-template-columns: minmax(110px, 32%) minmax(0, 1fr) 28px; gap: 10px; align-items: center; padding: 4px 6px 4px 8px; border-radius: 6px; min-height: 38px; }
|
|
412
|
+
.je-row:hover { background: var(--surface-2); }
|
|
413
|
+
.je-key { font: 12.5px/1.4 var(--mono); color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
414
|
+
.je-control input[type=text], .je-control input[type=number], .je-control textarea { padding: 6px 9px; font-size: 13px; }
|
|
415
|
+
.je-control input[type=number] { max-width: 220px; font-variant-numeric: tabular-nums; }
|
|
416
|
+
.je-control textarea { min-height: 0; }
|
|
417
|
+
.je-empty { font: italic 12.5px var(--mono); color: var(--text-3); }
|
|
418
|
+
.je-remove { opacity: 0; font-size: 12px; width: 26px; height: 26px; }
|
|
419
|
+
.je-row:hover > .je-remove, .je-remove:focus-visible { opacity: 1; }
|
|
420
|
+
.je-remove:hover { color: var(--danger); }
|
|
421
|
+
@media (hover: none) { .je-remove { opacity: 0.7; } }
|
|
422
|
+
.je-node > summary { list-style: none; cursor: pointer; user-select: none; }
|
|
423
|
+
.je-node > summary::-webkit-details-marker { display: none; }
|
|
424
|
+
.je-node > summary .je-key { color: var(--text); font-weight: 600; }
|
|
425
|
+
.je-node > summary .je-key::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 9px 2px 1px; border-right: 1.75px solid var(--text-3); border-bottom: 1.75px solid var(--text-3); transform: rotate(-45deg); transition: transform 0.15s; }
|
|
426
|
+
.je-node[open] > summary .je-key::before { transform: rotate(45deg); margin-bottom: 4px; }
|
|
427
|
+
.je-body.filtering .je-add { display: none; }
|
|
428
|
+
.je-meta { display: flex; gap: 8px; align-items: center; min-width: 0; }
|
|
429
|
+
.je-count { font-size: 11.5px; color: var(--text-3); background: var(--surface-3); border-radius: 99px; padding: 1px 8px; flex: none; }
|
|
430
|
+
.je-preview { font-size: 12.5px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
431
|
+
.je-children { margin-left: 14px; padding-left: 8px; border-left: 1px dashed var(--border-strong); }
|
|
432
|
+
.je-add { font-size: 12.5px; margin: 4px 8px 8px; }
|
|
433
|
+
.je-row.changed { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
|
|
434
|
+
.je-row.has-changes .je-count::after { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); margin-left: 6px; vertical-align: middle; }
|
|
435
|
+
.je-code { position: relative; font: 12.5px/1.6 var(--mono); }
|
|
436
|
+
.je-code pre, .je-code .je-text { margin: 0; padding: 12px 14px; font: inherit; tab-size: 2; white-space: pre-wrap; overflow-wrap: anywhere; border: 0; border-radius: var(--radius); }
|
|
437
|
+
.je-code pre { position: absolute; inset: 0; overflow: hidden; pointer-events: none; color: var(--text); }
|
|
438
|
+
.je-code .je-text { position: relative; display: block; width: 100%; min-height: 340px; max-height: 560px; resize: vertical; background: transparent; color: transparent; caret-color: var(--text); }
|
|
439
|
+
.je-code .je-text:focus { box-shadow: 0 0 0 3px var(--accent-soft); }
|
|
440
|
+
.je-code .je-text::selection { background: var(--accent-soft); color: transparent; }
|
|
441
|
+
.je-k { color: var(--accent); }
|
|
442
|
+
.je-s { color: var(--success); }
|
|
443
|
+
.je-n { color: var(--warning); }
|
|
444
|
+
.je-b { color: var(--je-bool); }
|
|
445
|
+
.je-null { color: var(--text-3); font-style: italic; }
|
|
446
|
+
.change-count { font-size: 12.5px; color: var(--accent); font-weight: 600; }
|
|
447
|
+
|
|
448
|
+
.skeleton { background: linear-gradient(90deg, var(--surface-2), var(--surface-3), var(--surface-2)); background-size: 200% 100%; animation: shimmer 1.4s infinite; border-radius: 8px; }
|
|
449
|
+
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
|
|
450
|
+
|
|
451
|
+
@media (max-width: 1100px) {
|
|
452
|
+
.grid-2 { grid-template-columns: minmax(0, 1fr); }
|
|
453
|
+
.drawer-inner { grid-template-columns: minmax(0, 1fr); }
|
|
454
|
+
}
|
|
455
|
+
@media (max-width: 820px) {
|
|
456
|
+
#runKey { display: none; }
|
|
457
|
+
.je-row { grid-template-columns: auto minmax(0, 1fr) 28px; }
|
|
458
|
+
.je-row.je-leaf { grid-template-columns: minmax(0, 1fr) 28px; }
|
|
459
|
+
.je-row.je-leaf .je-control { grid-column: 1 / -1; grid-row: 2; }
|
|
460
|
+
.je-search { max-width: none; flex: 1 1 100%; order: 3; }
|
|
461
|
+
.layout { grid-template-columns: minmax(0, 1fr); }
|
|
462
|
+
.sidebar { display: none; }
|
|
463
|
+
.mobile-games { display: block; flex: 1; min-width: 0; }
|
|
464
|
+
.mobile-games select { padding: 7px 10px; }
|
|
465
|
+
.topbar { gap: 10px; padding: 0 10px 0 12px; }
|
|
466
|
+
.topbar .spacer, .save-status { display: none; }
|
|
467
|
+
.brand span { display: none; }
|
|
468
|
+
.main { padding: 16px; }
|
|
469
|
+
.game-header .game-thumb { width: 48px; height: 48px; }
|
|
470
|
+
.game-header h1 { font-size: 18px; }
|
|
471
|
+
.live { grid-template-columns: 96px 1fr; gap: 14px; }
|
|
472
|
+
.live img { width: 96px; height: 96px; border-radius: 16px; }
|
|
473
|
+
.live .timer { font-size: 28px; }
|
|
474
|
+
.stages { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
|
|
475
|
+
.timeline .list-row { grid-template-columns: minmax(0, 1fr) auto; }
|
|
476
|
+
.timeline .when { grid-column: 1 / -1; }
|
|
477
|
+
.cat-row { grid-template-columns: minmax(0, 1fr); }
|
|
478
|
+
.range-row { grid-template-columns: 90px minmax(0, 1fr) 44px; }
|
|
479
|
+
.run-text span { display: none; }
|
|
480
|
+
.run-actions .optional { display: none; }
|
|
481
|
+
.runbar-main { padding: 0 12px; gap: 8px; }
|
|
482
|
+
.card { padding: 14px; }
|
|
483
|
+
}
|
|
484
|
+
</style>
|
|
485
|
+
</head>
|
|
486
|
+
<body>
|
|
487
|
+
<header class="topbar">
|
|
488
|
+
<div class="brand">
|
|
489
|
+
<svg viewBox="0 0 32 32" aria-hidden="true"><rect width="32" height="32" rx="9" fill="var(--accent)"/><path d="M10 7h12M10 25h12M11 7c0 6 10 6 10 9s-10 3-10 9M21 7c0 6-10 6-10 9s10 3 10 9" stroke="#fff" stroke-width="2.2" fill="none" stroke-linecap="round"/></svg>
|
|
490
|
+
<span>UpdateDay</span>
|
|
491
|
+
</div>
|
|
492
|
+
<div class="mobile-games"><label class="sr-only" for="mobileGame">Game</label><select id="mobileGame"></select></div>
|
|
493
|
+
<div class="spacer"></div>
|
|
494
|
+
<span class="save-status" id="saveStatus" data-state="saved" aria-live="polite">Loading…</span>
|
|
495
|
+
<button class="btn btn-primary" id="saveBtn" disabled>Save</button>
|
|
496
|
+
<button class="icon-btn" id="themeBtn" aria-label="Switch between light and dark theme" title="Light / dark">◐</button>
|
|
497
|
+
</header>
|
|
498
|
+
|
|
499
|
+
<div class="layout">
|
|
500
|
+
<aside class="sidebar" aria-label="Games">
|
|
501
|
+
<div class="sidebar-label">Games</div>
|
|
502
|
+
<div id="gameList"></div>
|
|
503
|
+
<button class="btn btn-ghost btn-block add" id="addGame">+ Add game</button>
|
|
504
|
+
<div class="sidebar-foot" id="configPath"></div>
|
|
505
|
+
</aside>
|
|
506
|
+
<main class="main" id="main">
|
|
507
|
+
<div id="gameHeader"></div>
|
|
508
|
+
<nav class="tabs" role="tablist" aria-label="Sections" id="tabs"></nav>
|
|
509
|
+
<section id="view" role="tabpanel" tabindex="-1"></section>
|
|
510
|
+
</main>
|
|
511
|
+
</div>
|
|
512
|
+
|
|
513
|
+
<footer class="runbar" id="runbar" aria-label="Run"></footer>
|
|
514
|
+
<div class="toasts" id="toasts" aria-live="polite"></div>
|
|
515
|
+
<dialog id="dialog"></dialog>
|
|
516
|
+
|
|
517
|
+
<script src="/ui/core.js"></script>
|
|
518
|
+
<script src="/ui/countdown.js"></script>
|
|
519
|
+
<script src="/ui/sale.js"></script>
|
|
520
|
+
<script src="/ui/events.js"></script>
|
|
521
|
+
<script src="/ui/page.js"></script>
|
|
522
|
+
<script src="/ui/jsonEditor.js"></script>
|
|
523
|
+
<script src="/ui/players.js"></script>
|
|
524
|
+
<script src="/ui/gifts.js"></script>
|
|
525
|
+
<script src="/ui/settings.js"></script>
|
|
526
|
+
<script src="/ui/history.js"></script>
|
|
527
|
+
<script src="/ui/run.js"></script>
|
|
528
|
+
<script src="/ui/shell.js"></script>
|
|
529
|
+
</body>
|
|
530
|
+
</html>
|