By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 style.css

View raw Download
text/x-asm • 8.63 kiB
assembler source, ASCII text
        
            
1
@import url("/static/efficient-ui/MASTER.css");
2
3
:root {
4
--color-branch: var(--color-primary-1);
5
--color-branch-text: var(--color-primary-1-text);
6
--color-tag: var(--color-accent-1);
7
--color-tag-text: var(--color-accent-1-text);
8
--color-pending: #4caf50;
9
--color-pending-text: #ffffff;
10
--color-rejected: #ff9800;
11
--color-rejected-text: #ffffff;
12
--color-merged: #9c27b0;
13
--color-merged-text: #ffffff;
14
--color-insertion: #00C85366;
15
--color-insertion-text: currentColor;
16
--color-deletion: #D5000066;
17
--color-deletion-text: currentColor;
18
--color-code-line-number: #455A64;
19
}
20
21
.big-button {
22
font-size: 1.5em;
23
}
24
25
.ripple-pad {
26
background: #ffffff99;
27
position: absolute;
28
opacity: 1;
29
transform: scale(0);
30
animation: RippleEffect 375ms cubic-bezier(0, 0.55, 0.45, 1) forwards;
31
}
32
33
@keyframes RippleEffect {
34
to {
35
transform: scale(1);
36
opacity: 0;
37
}
38
}
39
40
button, input, .button, select {
41
position: relative;
42
overflow: hidden;
43
}
44
45
.error-page-container {
46
align-items: center;
47
justify-content: center;
48
width: 100%;
49
height: 100%;
50
}
51
52
/*
53
@media screen and (max-width: 896px) {
54
.navbar {
55
flex-flow: column nowrap;
56
height: fit-content;
57
}
58
}
59
*/
60
61
@media screen and (max-width: 640px) {
62
#repo-table > * > tr > :is(td, th):is(:nth-child(3), :nth-child(4)) {
63
display: none;
64
}
65
66
.commit-message {
67
display: none !important;
68
}
69
}
70
71
/*
72
@media screen and (max-width: 544px) {
73
.navbar > ul {
74
flex-flow: row wrap;
75
justify-content: center;
76
}
77
#commit-dialog {
78
align-items: stretch;
79
}
80
}
81
@media screen and (max-width: 512px) {
82
.breadcrumbs {
83
flex-flow: column nowrap;
84
justify-content: center;
85
height: auto;
86
gap: 1em;
87
}
88
}
89
*/
90
91
.file-icon {
92
font-size: 1.25em;
93
}
94
95
.file-name, .commit-message {
96
display: inline-block;
97
white-space: nowrap;
98
overflow: hidden;
99
text-overflow: ellipsis;
100
}
101
102
.file-link {
103
text-decoration: none;
104
}
105
106
.button {
107
text-decoration: none;
108
}
109
110
.password-error {
111
background: var(--color-error);
112
color: var(--color-error-text);
113
padding: 8px;
114
gap: 4px;
115
border-radius: 2px;
116
}
117
118
#username p {
119
font-size: 1.5em;
120
font-weight: 300;
121
}
122
123
.box-center {
124
align-items: center;
125
}
126
127
#global-nav > x-hbox > a > x-hbox {
128
height: 100%;
129
}
130
131
footer {
132
background: var(--color-callout-1);
133
color: var(--color-callout-1-text);
134
padding: 16px;
135
}
136
footer a {
137
color: var(--color-callout-1-text) !important;
138
}
139
body {
140
display: flex;
141
flex-flow: column;
142
}
143
main {
144
flex: 1 0 auto;
145
}
146
body > footer hr {
147
border-color: #ffffff80;
148
margin: 8px 0;
149
}
150
151
.branch-icon {
152
width: 2em;
153
font-size: 32px;
154
align-items: center;
155
justify-content: center;
156
display: flex;
157
}
158
159
dd {
160
margin-left: 2em;
161
}
162
163
.navbar-mini {
164
--height-navbar: 48px;
165
}
166
167
.dialog-tools {
168
position: relative;
169
left: 8px;
170
}
171
172
.thumbnail-marquee {
173
height: 1.5em;
174
overflow: hidden;
175
position: relative;
176
}
177
178
.inner-thumbnail-marquee {
179
position: absolute;
180
width: 100%;
181
height: 100%;
182
overflow: visible;
183
text-align: center;
184
animation: marquee 3000ms linear infinite;
185
}
186
187
@keyframes marquee {
188
0% {
189
transform: translateX(200%);
190
}
191
100% {
192
transform: translateX(-200%);
193
}
194
}
195
196
@media screen and (min-width: 641px) {
197
#sidenav-trigger {
198
display: none;
199
}
200
#global-nav {
201
padding-left: 16px;
202
}
203
}
204
205
@media screen and (max-width: 640px) {
206
#navbar-separator ~ a {
207
display: none;
208
}
209
}
210
211
hr {
212
border-color: currentColor;
213
border-width: 1px;
214
margin: 1em 0;
215
opacity: 0.5;
216
}
217
218
.state-label {
219
writing-mode: vertical-lr;
220
text-transform: uppercase;
221
padding: 1em;
222
margin: 0;
223
}
224
225
.breadcrumbs > x-buttonbox iconify-icon {
226
font-size: 1.5rem;
227
}
228
229
.breadcrumbs > x-buttonbox > a {
230
display: flex;
231
align-items: center;
232
}
233
234
#repo-tabs > li > a {
235
display: flex;
236
flex-flow: row wrap;
237
gap: 0.5ch;
238
text-transform: uppercase;
239
position: relative;
240
overflow: hidden;
241
padding: 4px 16px;
242
}
243
244
#repo-tabs > li.selected > a {
245
box-shadow: inset 0 -0.25rem var(--color-accent);
246
}
247
248
#repo-nav {
249
padding-left: 0;
250
}
251
252
x-buttonbox.segmented {
253
box-shadow: var(--shadow-button);
254
padding: 0;
255
gap: 0;
256
overflow: hidden;
257
border-radius: var(--radius-button);
258
width: fit-content;
259
}
260
261
x-buttonbox.segmented > * {
262
border-radius: 0;
263
}
264
265
.vote-button:not(.selected) {
266
box-shadow: none !important;
267
color: inherit !important;
268
background: transparent !important;
269
outline: 0.1px solid #00000080;
270
}
271
272
.vote-button:not(.selected):hover {
273
background: var(--color-flat-button-hover) !important;
274
}
275
276
.vote-button {
277
padding: 4px;
278
}
279
280
.vote-score {
281
min-width: 3ch;
282
text-align: center;
283
}
284
285
.reply-area {
286
box-shadow: var(--shadow-card);
287
margin: var(--margin-card);
288
border-radius: var(--radius-card);
289
background: var(--color-card);
290
color: var(--color-card-text);
291
border: var(--border-card);
292
overflow: hidden; /* So rounded corners can cut through the content */
293
display: flex;
294
flex-flow: column nowrap;
295
height: 100%;
296
}
297
298
.reply-area > summary {
299
display: flex;
300
align-items: center;
301
cursor: pointer;
302
padding: var(--padding-card);
303
padding-top: var(--padding-card-top);
304
text-transform: uppercase;
305
font-weight: 500;
306
transition: box-shadow 250ms cubic-bezier(0.33, 1, 0.68, 1);
307
}
308
309
.reply-area > form {
310
padding: var(--padding-card);
311
padding-top: var(--padding-card-top);
312
}
313
314
.reply-area > summary::before {
315
content: " ";
316
background-image: url("/static/efficient-ui/icons/expand.svg");
317
transform: rotate(-90deg);
318
width: 1.5em;
319
height: 1.5em;
320
background-size: contain;
321
background-repeat: no-repeat;
322
transition: transform 250ms cubic-bezier(0.33, 1, 0.68, 1);
323
}
324
325
.reply-area[open] > summary::before {
326
transform: rotate(0);
327
}
328
329
.reply-area[open] > summary {
330
box-shadow: var(--shadow-card);
331
}
332
333
.post-author {
334
color: inherit;
335
text-decoration: inherit;
336
}
337
338
.post-details {
339
color: var(--color-caption-text);
340
}
341
342
#forum-banner {
343
background: var(--color-navbar);
344
color: #ffffff;
345
min-height: 56px;
346
position: sticky;
347
top: 0;
348
z-index: 1;
349
box-shadow: var(--shadow-navbar);
350
}
351
352
#forum-banner h1 {
353
font-size: 1rem;
354
font-weight: 600;
355
}
356
357
#forum-banner a, .nolink {
358
color: inherit;
359
text-decoration: none;
360
}
361
362
header {
363
z-index: 2;
364
}
365
366
.icon-button {
367
border-radius: 50%;
368
aspect-ratio: 1/1;
369
height: 3rem;
370
width: 3rem;
371
padding: 0;
372
font-size: 1.5rem;
373
background: transparent !important;
374
box-shadow: none !important;
375
}
376
377
#cookie-info {
378
background: var(--color-primary);
379
color: var(--color-primary-text);
380
align-items: center;
381
justify-content: space-between;
382
}
383
384
#cookie-info > p {
385
padding: 8px 1em;
386
}
387
388
.interrupt-top {
389
--mask: conic-gradient(from 135deg at top, #0000, #000 0 90deg,#0000 90deg) 50%/16px 100%;
390
padding-top: calc(var(--padding-code) + 8px);
391
-webkit-mask: var(--mask);
392
mask: var(--mask);
393
}
394
395
.diff-position {
396
width: 100%;
397
background: var(--color-code-line-number);
398
color: var(--color-code-text);
399
padding: 8px;
400
}
401
402
.code-view {
403
white-space: normal;
404
padding: 0;
405
display: grid;
406
grid-template-columns: min-content min-content;
407
grid-auto-rows: min-content;
408
width: 100%;
409
overflow: auto;
410
}
411
412
.inner-wrapper {
413
display: inline-block;
414
}
415
416
.code-view :is(code, ins, del, x-codeline) {
417
white-space: pre;
418
font: inherit;
419
color: inherit;
420
background: inherit;
421
display: inline;
422
padding: 0;
423
margin: 0;
424
width: 100%;
425
padding-left: 1ch;
426
}
427
428
.code-view > .line-number:first-child,
429
.code-view > .line-number:first-child + :is(code, ins, del, x-codeline) {
430
padding-top: 1ch;
431
}
432
433
.code-view > :is(code, ins, del, x-codeline):last-child {
434
padding-bottom: 1ch;
435
}
436
437
.ln::before {
438
content: attr(data-ln);
439
display: inline-block;
440
width: 8ch;
441
box-sizing: content-box;
442
text-align: right;
443
padding-right: 1ch;
444
margin-right: 1ch;
445
background: var(--color-code-line-number);
446
position: sticky;
447
left: 0;
448
}
449
450
.line-number {
451
display: inline-block;
452
width: 8ch;
453
box-sizing: content-box;
454
text-align: right;
455
padding-right: 1ch;
456
background: var(--color-code-line-number);
457
position: sticky;
458
left: 0;
459
}
460
461
ins, .code-view > ins {
462
background: var(--color-insertion);
463
color: var(--color-insertion-text);
464
text-decoration: none;
465
}
466
467
del, .code-view > del {
468
background: var(--color-deletion);
469
color: var(--color-deletion-text);
470
text-decoration: none;
471
}
472