Skip to content

Commit eeb7044

Browse files
NightprinceNightprince
committed
Clean unexpected duplicate selector debug toolbar
1 parent 1569452 commit eeb7044

File tree

1 file changed

+30
-65
lines changed

1 file changed

+30
-65
lines changed

‎system/Debug/Toolbar/Views/toolbar.css

Lines changed: 30 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,10 @@
1818
clear: both;
1919
text-align: center;
2020
cursor: pointer;
21+
background-color: #FFFFFF;
22+
box-shadow: 0 0 4px #DFDFDF;
23+
-moz-box-shadow: 0 0 4px #DFDFDF;
24+
-webkit-box-shadow: 0 0 4px #DFDFDF;
2125
}
2226
#debug-icon a svg {
2327
margin: 8px;
@@ -47,6 +51,8 @@
4751
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
4852
font-size: 16px;
4953
font-weight: 400;
54+
background-color: #FFFFFF;
55+
color: #434343;
5056
}
5157
#debug-bar h1 {
5258
display: flex;
@@ -62,7 +68,7 @@
6268
#debug-bar h2 {
6369
font-size: 16px;
6470
margin: 0;
65-
padding: 5px 0 10px 0;
71+
padding: 5px 0 10px;
6672
}
6773
#debug-bar h2 span {
6874
font-size: 13px;
@@ -92,6 +98,7 @@
9298
-webkit-border-radius: 4px;
9399
cursor: pointer;
94100
line-height: 15px;
101+
background-color: #FFFFFF;
95102
}
96103
#debug-bar button:hover {
97104
text-decoration: underline;
@@ -100,11 +107,12 @@
100107
border-collapse: collapse;
101108
font-size: 14px;
102109
line-height: normal;
103-
margin: 5px 10px 15px 10px;
110+
margin: 5px 10px 15px;
104111
width: calc(100% - 10px);
105112
}
106113
#debug-bar table strong {
107114
font-weight: 500;
115+
color: #DD8615;
108116
}
109117
#debug-bar table th {
110118
display: table-cell;
@@ -143,9 +151,13 @@
143151
display: flex;
144152
overflow: hidden;
145153
overflow-y: auto;
146-
padding: 0 12px 0 12px;
154+
padding: 0 12px;
147155
white-space: nowrap;
148156
z-index: 10000;
157+
background-color: #FFFFFF;
158+
box-shadow: 0 0 4px #DFDFDF;
159+
-moz-box-shadow: 0 0 4px #DFDFDF;
160+
-webkit-box-shadow: 0 0 4px #DFDFDF;
149161
}
150162
#debug-bar .toolbar .rotate {
151163
animation: toolbar-rotate 9s linear infinite;
@@ -162,6 +174,9 @@
162174
#debug-bar.fixed-top .tab {
163175
bottom: auto;
164176
top: 36px;
177+
box-shadow: 0 1px 4px #DFDFDF;
178+
-moz-box-shadow: 0 1px 4px #DFDFDF;
179+
-webkit-box-shadow: 0 1px 4px #DFDFDF;
165180
}
166181
#debug-bar #toolbar-position,
167182
#debug-bar #toolbar-theme {
@@ -188,6 +203,7 @@
188203
}
189204
#debug-bar .ci-label:hover {
190205
cursor: pointer;
206+
background-color: #DFDFDF;
191207
}
192208
#debug-bar .ci-label a {
193209
color: inherit;
@@ -214,6 +230,8 @@
214230
text-align: center;
215231
vertical-align: baseline;
216232
white-space: nowrap;
233+
background-color: #DD4814;
234+
color: #FFFFFF;
217235
}
218236
#debug-bar .tab {
219237
bottom: 35px;
@@ -226,6 +244,10 @@
226244
position: fixed;
227245
right: 0;
228246
z-index: 9999;
247+
background-color: #FFFFFF;
248+
box-shadow: 0 -1px 4px #DFDFDF;
249+
-moz-box-shadow: 0 -1px 4px #DFDFDF;
250+
-webkit-box-shadow: 0 -1px 4px #DFDFDF;
229251
}
230252
#debug-bar .timeline {
231253
margin-left: 0;
@@ -235,7 +257,7 @@
235257
border-left: 1px solid;
236258
font-size: 12px;
237259
font-weight: 200;
238-
padding: 5px 5px 10px 5px;
260+
padding: 5px 5px 10px;
239261
position: relative;
240262
text-align: left;
241263
}
@@ -268,6 +290,7 @@
268290
padding: 5px;
269291
position: absolute;
270292
top: 30%;
293+
background-color: #DD8615;
271294
}
272295
#debug-bar .timeline .timeline-parent {
273296
cursor: pointer;
@@ -305,8 +328,8 @@
305328
}
306329

307330
.debug-view.show-view {
308-
border: 1px solid;
309331
margin: 4px;
332+
border: 1px solid #DD8615;
310333
}
311334

312335
.debug-view-path {
@@ -316,6 +339,8 @@
316339
min-height: 16px;
317340
padding: 2px;
318341
text-align: left;
342+
background-color: #FDC894;
343+
color: #434343;
319344
}
320345

321346
.show-view .debug-view-path {
@@ -330,22 +355,12 @@
330355
display: none !important;
331356
}
332357
}
333-
#debug-icon {
334-
background-color: #FFFFFF;
335-
box-shadow: 0 0 4px #DFDFDF;
336-
-moz-box-shadow: 0 0 4px #DFDFDF;
337-
-webkit-box-shadow: 0 0 4px #DFDFDF;
338-
}
339358
#debug-icon a:active,
340359
#debug-icon a:link,
341360
#debug-icon a:visited {
342361
color: #DD8615;
343362
}
344363

345-
#debug-bar {
346-
background-color: #FFFFFF;
347-
color: #434343;
348-
}
349364
#debug-bar h1,
350365
#debug-bar h2,
351366
#debug-bar h3,
@@ -356,17 +371,10 @@
356371
#debug-bar thead,
357372
#debug-bar tr,
358373
#debug-bar td,
359-
#debug-bar button,
360374
#debug-bar .toolbar {
361375
background-color: transparent;
362376
color: #434343;
363377
}
364-
#debug-bar button {
365-
background-color: #FFFFFF;
366-
}
367-
#debug-bar table strong {
368-
color: #DD8615;
369-
}
370378
#debug-bar table tbody tr:hover {
371379
background-color: #DFDFDF;
372380
}
@@ -377,12 +385,6 @@
377385
background-color: #DD4814;
378386
color: #FFFFFF;
379387
}
380-
#debug-bar .toolbar {
381-
background-color: #FFFFFF;
382-
box-shadow: 0 0 4px #DFDFDF;
383-
-moz-box-shadow: 0 0 4px #DFDFDF;
384-
-webkit-box-shadow: 0 0 4px #DFDFDF;
385-
}
386388
#debug-bar .toolbar img {
387389
filter: brightness(0) invert(0.4);
388390
}
@@ -391,11 +393,6 @@
391393
-moz-box-shadow: 0 0 4px #DFDFDF;
392394
-webkit-box-shadow: 0 0 4px #DFDFDF;
393395
}
394-
#debug-bar.fixed-top .tab {
395-
box-shadow: 0 1px 4px #DFDFDF;
396-
-moz-box-shadow: 0 1px 4px #DFDFDF;
397-
-webkit-box-shadow: 0 1px 4px #DFDFDF;
398-
}
399396
#debug-bar .muted {
400397
color: #434343;
401398
}
@@ -412,35 +409,10 @@
412409
#debug-bar .ci-label.active {
413410
background-color: #DFDFDF;
414411
}
415-
#debug-bar .ci-label:hover {
416-
background-color: #DFDFDF;
417-
}
418-
#debug-bar .ci-label .badge {
419-
background-color: #DD4814;
420-
color: #FFFFFF;
421-
}
422-
#debug-bar .tab {
423-
background-color: #FFFFFF;
424-
box-shadow: 0 -1px 4px #DFDFDF;
425-
-moz-box-shadow: 0 -1px 4px #DFDFDF;
426-
-webkit-box-shadow: 0 -1px 4px #DFDFDF;
427-
}
428412
#debug-bar .timeline th,
429413
#debug-bar .timeline td {
430414
border-color: #DFDFDF;
431415
}
432-
#debug-bar .timeline .timer {
433-
background-color: #DD8615;
434-
}
435-
436-
.debug-view.show-view {
437-
border-color: #DD8615;
438-
}
439-
440-
.debug-view-path {
441-
background-color: #FDC894;
442-
color: #434343;
443-
}
444416

445417
@media (prefers-color-scheme: dark) {
446418
#debug-icon {
@@ -468,7 +440,6 @@
468440
#debug-bar thead,
469441
#debug-bar tr,
470442
#debug-bar td,
471-
#debug-bar button,
472443
#debug-bar .toolbar {
473444
background-color: transparent;
474445
color: #DFDFDF;
@@ -520,10 +491,6 @@
520491
#debug-bar .muted:hover td {
521492
color: #DFDFDF;
522493
}
523-
#debug-bar #toolbar-position,
524-
#debug-bar #toolbar-theme {
525-
filter: brightness(0) invert(0.6);
526-
}
527494
#debug-bar .ci-label.active {
528495
background-color: #252525;
529496
}
@@ -580,7 +547,6 @@
580547
#toolbarContainer.dark #debug-bar thead,
581548
#toolbarContainer.dark #debug-bar tr,
582549
#toolbarContainer.dark #debug-bar td,
583-
#toolbarContainer.dark #debug-bar button,
584550
#toolbarContainer.dark #debug-bar .toolbar {
585551
background-color: transparent;
586552
color: #DFDFDF;
@@ -696,7 +662,6 @@
696662
#toolbarContainer.light #debug-bar thead,
697663
#toolbarContainer.light #debug-bar tr,
698664
#toolbarContainer.light #debug-bar td,
699-
#toolbarContainer.light #debug-bar button,
700665
#toolbarContainer.light #debug-bar .toolbar {
701666
background-color: transparent;
702667
color: #434343;

0 commit comments

Comments
 (0)