Skip to content

Commit 5b09e92

Browse files
committed
Rename CSS classes for testcase toolbar
1 parent 6348145 commit 5b09e92

File tree

1 file changed

+53
-53
lines changed

1 file changed

+53
-53
lines changed

src/webview/judge/TestcaseToolbar.svelte

Lines changed: 53 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -55,57 +55,57 @@
5555
</script>
5656

5757
{#if status === "CE"}
58-
<div class="testcase-toolbar" class:testcase-toolbar--hidden={skipped}>
58+
<div class="toolbar" class:toolbar--hidden={skipped}>
5959
<div class="testcase-badges">
60-
<div class="testcase-elapsed-badge testcase-elapsed" data-status={status}>
61-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
60+
<div class="toolbar-badge-container toolbar-badge" data-status={status}>
61+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
6262
<div class="codicon codicon-bolded codicon-terminal-bash"></div>
6363
</div>
64-
<p class="testcase-elapsed-text">CE</p>
64+
<p class="toolbar-badge-text">CE</p>
6565
</div>
6666
{#if testcase.mode === "interactive"}
67-
<div class="testcase-elapsed-badge testcase-elapsed" data-status="CE">
68-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
67+
<div class="toolbar-badge-container toolbar-badge" data-status="CE">
68+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
6969
<div class="codicon codicon-bolded codicon-chat-sparkle"></div>
7070
</div>
7171
</div>
7272
{/if}
7373
</div>
7474
<div class="testcase-buttons">
7575
<button
76-
class="testcase-toolbar-icon"
76+
class="toolbar-icon"
7777
data-tooltip="Run Testcase"
7878
aria-label="Run"
7979
onclick={handleRun}
8080
>
8181
<div class="codicon codicon-run-below"></div>
8282
</button>
8383
<button
84-
class="testcase-toolbar-icon"
84+
class="toolbar-icon"
8585
data-tooltip="Debug Testcase"
8686
aria-label="Debug"
8787
onclick={handleDebug}
8888
>
8989
<div class="codicon codicon-debug-alt"></div>
9090
</button>
9191
<button
92-
class="testcase-toolbar-icon"
92+
class="toolbar-icon"
9393
data-tooltip="Delete Testcase"
9494
aria-label="Delete"
9595
onclick={handleDelete}
9696
>
9797
<div class="codicon codicon-trash"></div>
9898
</button>
9999
<button
100-
class="testcase-toolbar-icon"
100+
class="toolbar-icon"
101101
data-tooltip={showDetails ? "Hide Details" : "Show Details"}
102102
aria-label={showDetails ? "Hide" : "Show"}
103103
onclick={handleToggleVisibility}
104104
>
105105
<div class="codicon {showDetails ? 'codicon-eye-closed' : 'codicon-eye'}"></div>
106106
</button>
107107
<button
108-
class="testcase-toolbar-icon testcase-toolbar-icon--visibility"
108+
class="toolbar-icon toolbar-icon--visibility"
109109
data-tooltip={skipped ? "Unskip Testcase" : "Skip Testcase"}
110110
aria-label={skipped ? "Unskip" : "Skip"}
111111
onclick={handleToggleSkip}
@@ -117,10 +117,10 @@
117117
</div>
118118
</div>
119119
{:else if status === "NA" || status === "AC" || status === "WA" || status === "RE" || status === "TL" || status === "ML"}
120-
<div class="testcase-toolbar" class:testcase-toolbar--hidden={skipped}>
120+
<div class="toolbar" class:toolbar--hidden={skipped}>
121121
<div class="testcase-badges">
122-
<div class="testcase-elapsed-badge testcase-elapsed" data-status={status}>
123-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
122+
<div class="toolbar-badge-container toolbar-badge" data-status={status}>
123+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
124124
{#if status === "NA"}
125125
<div class="codicon codicon-bolded codicon-play"></div>
126126
{:else if status === "AC"}
@@ -135,19 +135,19 @@
135135
<div class="codicon codicon-bolded codicon-chip"></div>
136136
{/if}
137137
</div>
138-
<p class="testcase-elapsed-text">
138+
<p class="toolbar-badge-text">
139139
{status !== "NA" && status !== "AC" && status !== "ML" && status !== "WA"
140140
? status
141141
: testcase.elapsed >= 1000
142142
? (testcase.elapsed / 1000).toFixed(1) + "s"
143143
: testcase.elapsed + "ms"}
144144
</p>
145145
</div>
146-
<div class="testcase-elapsed-badge testcase-elapsed" data-status={status}>
147-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
146+
<div class="toolbar-badge-container toolbar-badge" data-status={status}>
147+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
148148
<div class="codicon codicon-bolded codicon-chip"></div>
149149
</div>
150-
<p class="testcase-elapsed-text">
150+
<p class="toolbar-badge-text">
151151
{status === "ML"
152152
? "ML"
153153
: testcase.memoryBytes >= 1024 * 1024 * 1024
@@ -160,48 +160,48 @@
160160
</p>
161161
</div>
162162
{#if testcase.mode === "interactive"}
163-
<div class="testcase-elapsed-badge testcase-elapsed" data-status="CE">
164-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
163+
<div class="toolbar-badge-container toolbar-badge" data-status="CE">
164+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
165165
<div class="codicon codicon-bolded codicon-chat-sparkle"></div>
166166
</div>
167167
</div>
168168
{/if}
169169
</div>
170170
<div class="testcase-buttons">
171171
<button
172-
class="testcase-toolbar-icon"
172+
class="toolbar-icon"
173173
data-tooltip="Run Testcase"
174174
aria-label="Run"
175175
onclick={handleRun}
176176
>
177177
<div class="codicon codicon-run-below"></div>
178178
</button>
179179
<button
180-
class="testcase-toolbar-icon"
180+
class="toolbar-icon"
181181
data-tooltip="Debug Testcase"
182182
aria-label="Debug"
183183
onclick={handleDebug}
184184
>
185185
<div class="codicon codicon-debug-alt"></div>
186186
</button>
187187
<button
188-
class="testcase-toolbar-icon"
188+
class="toolbar-icon"
189189
data-tooltip="Delete Testcase"
190190
aria-label="Delete"
191191
onclick={handleDelete}
192192
>
193193
<div class="codicon codicon-trash"></div>
194194
</button>
195195
<button
196-
class="testcase-toolbar-icon"
196+
class="toolbar-icon"
197197
data-tooltip={showDetails ? "Hide Details" : "Show Details"}
198198
aria-label={showDetails ? "Hide" : "Show"}
199199
onclick={handleToggleVisibility}
200200
>
201201
<div class="codicon {showDetails ? 'codicon-eye-closed' : 'codicon-eye'}"></div>
202202
</button>
203203
<button
204-
class="testcase-toolbar-icon testcase-toolbar-icon--visibility"
204+
class="toolbar-icon toolbar-icon--visibility"
205205
data-tooltip={skipped ? "Unskip Testcase" : "Skip Testcase"}
206206
aria-label={skipped ? "Unskip" : "Skip"}
207207
onclick={handleToggleSkip}
@@ -213,38 +213,38 @@
213213
</div>
214214
</div>
215215
{:else if status === "COMPILING"}
216-
<div class="testcase-toolbar">
217-
<div class="testcase-toolbar-left">
218-
<div class="testcase-elapsed-badge testcase-elapsed" data-status={status}>
219-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
216+
<div class="toolbar">
217+
<div class="toolbar-left">
218+
<div class="toolbar-badge-container toolbar-badge" data-status={status}>
219+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
220220
<div class="codicon codicon-loading codicon-modifier-spin"></div>
221221
</div>
222-
<p class="testcase-elapsed-text">COMPILING</p>
222+
<p class="toolbar-badge-text">COMPILING</p>
223223
</div>
224224
{#if testcase.mode === "interactive"}
225-
<div class="testcase-elapsed-badge testcase-elapsed" data-status="CE">
226-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
225+
<div class="toolbar-badge-container toolbar-badge" data-status="CE">
226+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
227227
<div class="codicon codicon-bolded codicon-chat-sparkle"></div>
228228
</div>
229229
</div>
230230
{/if}
231231
</div>
232232
</div>
233233
{:else if status === "RUNNING"}
234-
<div class="testcase-toolbar">
235-
<div class="testcase-toolbar-left">
236-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
234+
<div class="toolbar">
235+
<div class="toolbar-left">
236+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
237237
<div class="codicon codicon-loading codicon-modifier-spin"></div>
238238
</div>
239239
{#if testcase.mode === "interactive"}
240-
<div class="testcase-elapsed-badge testcase-elapsed" data-status="CE">
241-
<div class="testcase-toolbar-icon testcase-toolbar-icon-exclude-highlight">
240+
<div class="toolbar-badge-container toolbar-badge" data-status="CE">
241+
<div class="toolbar-icon toolbar-icon-exclude-highlight">
242242
<div class="codicon codicon-bolded codicon-chat-sparkle"></div>
243243
</div>
244244
</div>
245245
{/if}
246246
<button
247-
class="testcase-toolbar-icon"
247+
class="toolbar-icon"
248248
data-tooltip="Stop Testcase"
249249
aria-label="Stop"
250250
onclick={handleStop}
@@ -258,23 +258,23 @@
258258
<Tooltip />
259259

260260
<style>
261-
.testcase-toolbar {
261+
.toolbar {
262262
display: flex;
263263
align-items: center;
264264
margin-bottom: 6px;
265265
flex-wrap: wrap;
266266
gap: 6px;
267267
}
268268
269-
.testcase-toolbar--hidden > .testcase-badges {
269+
.toolbar--hidden > .testcase-badges {
270270
opacity: 0.5;
271271
}
272272
273-
.testcase-toolbar--hidden > .testcase-buttons > *:not(.testcase-toolbar-icon-exclude-fade) {
273+
.toolbar--hidden > .testcase-buttons > *:not(.toolbar-icon-exclude-fade) {
274274
opacity: 0.5;
275275
}
276276
277-
.testcase-toolbar-left {
277+
.toolbar-left {
278278
display: flex;
279279
align-items: center;
280280
justify-content: flex-start;
@@ -297,7 +297,7 @@
297297
flex-grow: 1;
298298
}
299299
300-
.testcase-toolbar-icon {
300+
.toolbar-icon {
301301
display: flex;
302302
align-items: center;
303303
justify-content: center;
@@ -309,12 +309,12 @@
309309
color: inherit;
310310
}
311311
312-
.testcase-toolbar-icon:not(.testcase-toolbar-icon-exclude-highlight):hover {
312+
.toolbar-icon:not(.toolbar-icon-exclude-highlight):hover {
313313
cursor: pointer;
314314
background: var(--vscode-button-secondaryBackground);
315315
}
316316
317-
.testcase-elapsed-badge {
317+
.toolbar-badge-container {
318318
display: flex;
319319
align-items: center;
320320
padding: 1px 6px;
@@ -326,7 +326,7 @@
326326
color: var(--vscode-badge-foreground);
327327
}
328328
329-
.testcase-elapsed-text {
329+
.toolbar-badge-text {
330330
margin: 0 3px 0 0;
331331
}
332332
@@ -335,31 +335,31 @@
335335
}
336336
337337
/* Status-specific colors using data-status attribute */
338-
.testcase-elapsed[data-status="CE"] {
338+
.toolbar-badge[data-status="CE"] {
339339
background-color: var(--vscode-terminal-ansiMagenta);
340340
}
341341
342-
.testcase-elapsed[data-status="RE"] {
342+
.toolbar-badge[data-status="RE"] {
343343
background-color: var(--vscode-terminal-ansiRed);
344344
}
345345
346-
.testcase-elapsed[data-status="WA"] {
346+
.toolbar-badge[data-status="WA"] {
347347
background-color: var(--vscode-terminal-ansiRed);
348348
}
349349
350-
.testcase-elapsed[data-status="AC"] {
350+
.toolbar-badge[data-status="AC"] {
351351
background-color: var(--vscode-terminal-ansiGreen);
352352
}
353353
354-
.testcase-elapsed[data-status="TL"] {
354+
.toolbar-badge[data-status="TL"] {
355355
background-color: var(--vscode-terminal-ansiRed);
356356
}
357357
358-
.testcase-elapsed[data-status="COMPILING"] {
358+
.toolbar-badge[data-status="COMPILING"] {
359359
background-color: var(--vscode-terminal-ansiMagenta);
360360
}
361361
362-
.testcase-elapsed[data-status="ML"] {
362+
.toolbar-badge[data-status="ML"] {
363363
background-color: var(--vscode-terminal-ansiRed);
364364
}
365365
</style>

0 commit comments

Comments
 (0)