engineering blog at https://blog.tangled.sh
input.css: use latest css from core
Signed-off-by: oppiliappan <me@oppi.li>
authored by
+852
-31
input.css
+852
-31
input.css
···
66
66
font-display: swap;
67
67
}
68
68
69
-
h1 {
70
-
@apply text-2xl;
71
-
@apply text-black;
72
-
@apply font-bold;
73
-
}
74
-
75
69
::selection {
76
70
@apply bg-yellow-400 text-black bg-opacity-30 dark:bg-yellow-600 dark:bg-opacity-50 dark:text-white;
77
71
}
···
84
78
@supports (font-variation-settings: normal) {
85
79
html {
86
80
font-feature-settings:
87
-
"ss01" 1,
88
81
"kern" 1,
89
82
"liga" 1,
90
83
"cv05" 1,
···
96
89
@apply no-underline text-black hover:underline hover:text-gray-800 dark:text-white dark:hover:text-gray-300;
97
90
}
98
91
99
-
img {
100
-
@apply border border-gray-200 rounded dark:border-gray-700;
101
-
}
102
-
103
-
img.icon {
104
-
@apply border-0 dark:brightness-100 dark:opacity-100;
105
-
}
106
-
107
92
label {
108
-
@apply block mb-2 text-gray-900 text-sm font-bold py-2 uppercase dark:text-gray-100;
93
+
@apply block text-gray-900 text-sm font-bold py-2 uppercase dark:text-gray-100;
109
94
}
110
95
input {
111
-
@apply bg-white border border-gray-400 rounded-sm focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
96
+
@apply border border-gray-400 block rounded bg-gray-50 focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
112
97
}
113
98
textarea {
114
-
@apply bg-white border border-gray-400 rounded-sm focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
99
+
@apply border border-gray-400 block rounded bg-gray-50 focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
115
100
}
116
101
details summary::-webkit-details-marker {
117
102
display: none;
118
103
}
104
+
105
+
code {
106
+
@apply font-mono rounded bg-gray-100 dark:bg-gray-700 text-black dark:text-white;
107
+
}
119
108
}
120
109
121
110
@layer components {
122
111
.btn {
123
-
@apply relative z-10 inline-flex min-h-[30px] cursor-pointer items-center
124
-
justify-center bg-transparent px-2 pb-[0.2rem] text-base
125
-
text-gray-900 before:absolute before:inset-0 before:-z-10
126
-
before:block before:rounded-sm before:border before:border-gray-200
127
-
before:bg-white before:drop-shadow-sm
128
-
before:content-[''] hover:before:border-gray-300
129
-
hover:before:bg-gray-50
130
-
hover:before:shadow-[0_2px_2px_0_rgba(20,20,96,0.1),inset_0_-2px_0_0_#f5f5f5]
131
-
focus:outline-none focus-visible:before:outline
132
-
focus-visible:before:outline-4 focus-visible:before:outline-gray-500
133
-
active:before:shadow-[inset_0_2px_2px_0_rgba(20,20,96,0.1)];
112
+
@apply relative z-10 inline-flex min-h-[30px] cursor-pointer items-center justify-center
113
+
bg-transparent px-2 pb-[0.2rem] text-sm text-gray-900
114
+
before:absolute before:inset-0 before:-z-10 before:block before:rounded
115
+
before:border before:border-gray-200 before:bg-white
116
+
before:shadow-[inset_0_-2px_0_0_rgba(0,0,0,0.1),0_1px_0_0_rgba(0,0,0,0.04)]
117
+
before:content-[''] before:transition-all before:duration-150 before:ease-in-out
118
+
hover:before:shadow-[inset_0_-2px_0_0_rgba(0,0,0,0.15),0_2px_1px_0_rgba(0,0,0,0.06)]
119
+
hover:before:bg-gray-50
120
+
dark:hover:before:bg-gray-700
121
+
active:before:shadow-[inset_0_2px_2px_0_rgba(0,0,0,0.1)]
122
+
focus:outline-none focus-visible:before:outline focus-visible:before:outline-2 focus-visible:before:outline-gray-400
123
+
disabled:cursor-not-allowed disabled:opacity-50
124
+
dark:text-gray-100 dark:before:bg-gray-800 dark:before:border-gray-700;
125
+
}
126
+
127
+
.btn-create {
128
+
@apply btn text-white
129
+
before:bg-green-600 hover:before:bg-green-700
130
+
dark:before:bg-green-700 dark:hover:before:bg-green-800
131
+
before:border before:border-green-700 hover:before:border-green-800
132
+
focus-visible:before:outline-green-500
133
+
disabled:before:bg-green-400 dark:disabled:before:bg-green-600;
134
+
}
135
+
136
+
.prose hr {
137
+
@apply my-2;
138
+
}
139
+
140
+
.prose li:has(input) {
141
+
@apply list-none;
142
+
}
143
+
144
+
.prose ul:has(input) {
145
+
@apply pl-2;
146
+
}
147
+
148
+
.prose .heading .anchor {
149
+
@apply no-underline mx-2 opacity-0;
150
+
}
151
+
152
+
.prose .heading:hover .anchor {
153
+
@apply opacity-70;
154
+
}
155
+
156
+
.prose .heading .anchor:hover {
157
+
@apply opacity-70;
158
+
}
159
+
160
+
.prose a.footnote-backref {
161
+
@apply no-underline;
162
+
}
163
+
164
+
.prose a.mention {
165
+
@apply no-underline hover:underline font-bold;
166
+
}
167
+
168
+
.prose li {
169
+
@apply my-0 py-0;
170
+
}
171
+
172
+
.prose ul,
173
+
.prose ol {
174
+
@apply my-1 py-0;
175
+
}
176
+
177
+
.prose img {
178
+
display: inline;
179
+
margin: 0;
180
+
vertical-align: middle;
181
+
}
182
+
183
+
.prose input {
184
+
@apply inline-block my-0 mb-1 mx-1;
185
+
}
186
+
187
+
.prose input[type="checkbox"] {
188
+
@apply disabled:accent-blue-500 checked:accent-blue-500 disabled:checked:accent-blue-500;
189
+
}
190
+
191
+
/* Base callout */
192
+
details[data-callout] {
193
+
@apply border-l-4 pl-3 py-2 text-gray-800 dark:text-gray-200 my-4;
194
+
}
195
+
196
+
details[data-callout] > summary {
197
+
@apply font-bold cursor-pointer mb-1;
198
+
}
199
+
200
+
details[data-callout] > .callout-content {
201
+
@apply text-sm leading-snug;
202
+
}
203
+
204
+
/* Note (blue) */
205
+
details[data-callout="note" i] {
206
+
@apply border-blue-400 dark:border-blue-500;
207
+
}
208
+
details[data-callout="note" i] > summary {
209
+
@apply text-blue-700 dark:text-blue-400;
210
+
}
211
+
212
+
/* Important (purple) */
213
+
details[data-callout="important" i] {
214
+
@apply border-purple-400 dark:border-purple-500;
215
+
}
216
+
details[data-callout="important" i] > summary {
217
+
@apply text-purple-700 dark:text-purple-400;
218
+
}
219
+
220
+
/* Warning (yellow) */
221
+
details[data-callout="warning" i] {
222
+
@apply border-yellow-400 dark:border-yellow-500;
223
+
}
224
+
details[data-callout="warning" i] > summary {
225
+
@apply text-yellow-700 dark:text-yellow-400;
226
+
}
227
+
228
+
/* Caution (red) */
229
+
details[data-callout="caution" i] {
230
+
@apply border-red-400 dark:border-red-500;
231
+
}
232
+
details[data-callout="caution" i] > summary {
233
+
@apply text-red-700 dark:text-red-400;
234
+
}
235
+
236
+
/* Tip (green) */
237
+
details[data-callout="tip" i] {
238
+
@apply border-green-400 dark:border-green-500;
239
+
}
240
+
details[data-callout="tip" i] > summary {
241
+
@apply text-green-700 dark:text-green-400;
134
242
}
243
+
244
+
/* Optional: hide the disclosure arrow like GitHub */
245
+
details[data-callout] > summary::-webkit-details-marker {
246
+
display: none;
247
+
}
248
+
135
249
}
136
250
@layer utilities {
137
251
.error {
138
-
@apply py-1 text-red-400;
252
+
@apply py-1 text-red-400 dark:text-red-300;
139
253
}
140
254
.success {
141
-
@apply py-1 text-black;
255
+
@apply py-1 text-gray-900 dark:text-gray-100;
142
256
}
143
257
}
258
+
259
+
}
260
+
261
+
/* Background */
262
+
.bg {
263
+
color: #4c4f69;
264
+
background-color: #eff1f5;
265
+
}
266
+
/* PreWrapper */
267
+
.chroma {
268
+
color: #4c4f69;
269
+
}
270
+
/* Error */
271
+
.chroma .err {
272
+
color: #d20f39;
273
+
}
274
+
/* LineLink */
275
+
.chroma .lnlinks {
276
+
outline: none;
277
+
text-decoration: none;
278
+
color: inherit;
279
+
}
280
+
/* LineTableTD */
281
+
.chroma .lntd {
282
+
vertical-align: top;
283
+
padding: 0;
284
+
margin: 0;
285
+
border: 0;
286
+
}
287
+
/* LineTable */
288
+
.chroma .lntable {
289
+
border-spacing: 0;
290
+
padding: 0;
291
+
margin: 0;
292
+
border: 0;
293
+
}
294
+
/* LineHighlight */
295
+
.chroma .hl {
296
+
@apply bg-amber-400/30 dark:bg-amber-500/20;
297
+
}
298
+
299
+
/* LineNumbersTable */
300
+
.chroma .lnt {
301
+
white-space: pre;
302
+
-webkit-user-select: none;
303
+
user-select: none;
304
+
margin-right: 0.4em;
305
+
padding: 0 0.4em 0 0.4em;
306
+
color: #8c8fa1;
307
+
}
308
+
/* LineNumbers */
309
+
.chroma .ln {
310
+
white-space: pre;
311
+
-webkit-user-select: none;
312
+
user-select: none;
313
+
margin-right: 0.4em;
314
+
padding: 0 0.4em 0 0.4em;
315
+
color: #8c8fa1;
316
+
}
317
+
/* Line */
318
+
.chroma .line {
319
+
display: flex;
320
+
}
321
+
/* Keyword */
322
+
.chroma .k {
323
+
color: #8839ef;
324
+
}
325
+
/* KeywordConstant */
326
+
.chroma .kc {
327
+
color: #fe640b;
328
+
}
329
+
/* KeywordDeclaration */
330
+
.chroma .kd {
331
+
color: #d20f39;
332
+
}
333
+
/* KeywordNamespace */
334
+
.chroma .kn {
335
+
color: #179299;
336
+
}
337
+
/* KeywordPseudo */
338
+
.chroma .kp {
339
+
color: #8839ef;
340
+
}
341
+
/* KeywordReserved */
342
+
.chroma .kr {
343
+
color: #8839ef;
344
+
}
345
+
/* KeywordType */
346
+
.chroma .kt {
347
+
color: #d20f39;
348
+
}
349
+
/* NameAttribute */
350
+
.chroma .na {
351
+
color: #1e66f5;
352
+
}
353
+
/* NameBuiltin */
354
+
.chroma .nb {
355
+
color: #04a5e5;
356
+
}
357
+
/* NameBuiltinPseudo */
358
+
.chroma .bp {
359
+
color: #04a5e5;
360
+
}
361
+
/* NameClass */
362
+
.chroma .nc {
363
+
color: #df8e1d;
364
+
}
365
+
/* NameConstant */
366
+
.chroma .no {
367
+
color: #df8e1d;
368
+
}
369
+
/* NameDecorator */
370
+
.chroma .nd {
371
+
color: #1e66f5;
372
+
font-weight: bold;
373
+
}
374
+
/* NameEntity */
375
+
.chroma .ni {
376
+
color: #179299;
377
+
}
378
+
/* NameException */
379
+
.chroma .ne {
380
+
color: #fe640b;
381
+
}
382
+
/* NameFunction */
383
+
.chroma .nf {
384
+
color: #1e66f5;
385
+
}
386
+
/* NameFunctionMagic */
387
+
.chroma .fm {
388
+
color: #1e66f5;
389
+
}
390
+
/* NameLabel */
391
+
.chroma .nl {
392
+
color: #04a5e5;
393
+
}
394
+
/* NameNamespace */
395
+
.chroma .nn {
396
+
color: #fe640b;
397
+
}
398
+
/* NameProperty */
399
+
.chroma .py {
400
+
color: #fe640b;
401
+
}
402
+
/* NameTag */
403
+
.chroma .nt {
404
+
color: #8839ef;
405
+
}
406
+
/* NameVariable */
407
+
.chroma .nv {
408
+
color: #dc8a78;
409
+
}
410
+
/* NameVariableClass */
411
+
.chroma .vc {
412
+
color: #dc8a78;
413
+
}
414
+
/* NameVariableGlobal */
415
+
.chroma .vg {
416
+
color: #dc8a78;
417
+
}
418
+
/* NameVariableInstance */
419
+
.chroma .vi {
420
+
color: #dc8a78;
421
+
}
422
+
/* NameVariableMagic */
423
+
.chroma .vm {
424
+
color: #dc8a78;
425
+
}
426
+
/* LiteralString */
427
+
.chroma .s {
428
+
color: #40a02b;
429
+
}
430
+
/* LiteralStringAffix */
431
+
.chroma .sa {
432
+
color: #d20f39;
433
+
}
434
+
/* LiteralStringBacktick */
435
+
.chroma .sb {
436
+
color: #40a02b;
437
+
}
438
+
/* LiteralStringChar */
439
+
.chroma .sc {
440
+
color: #40a02b;
441
+
}
442
+
/* LiteralStringDelimiter */
443
+
.chroma .dl {
444
+
color: #1e66f5;
445
+
}
446
+
/* LiteralStringDoc */
447
+
.chroma .sd {
448
+
color: #9ca0b0;
449
+
}
450
+
/* LiteralStringDouble */
451
+
.chroma .s2 {
452
+
color: #40a02b;
453
+
}
454
+
/* LiteralStringEscape */
455
+
.chroma .se {
456
+
color: #1e66f5;
457
+
}
458
+
/* LiteralStringHeredoc */
459
+
.chroma .sh {
460
+
color: #9ca0b0;
461
+
}
462
+
/* LiteralStringInterpol */
463
+
.chroma .si {
464
+
color: #40a02b;
465
+
}
466
+
/* LiteralStringOther */
467
+
.chroma .sx {
468
+
color: #40a02b;
469
+
}
470
+
/* LiteralStringRegex */
471
+
.chroma .sr {
472
+
color: #179299;
473
+
}
474
+
/* LiteralStringSingle */
475
+
.chroma .s1 {
476
+
color: #40a02b;
477
+
}
478
+
/* LiteralStringSymbol */
479
+
.chroma .ss {
480
+
color: #40a02b;
481
+
}
482
+
/* LiteralNumber */
483
+
.chroma .m {
484
+
color: #fe640b;
485
+
}
486
+
/* LiteralNumberBin */
487
+
.chroma .mb {
488
+
color: #fe640b;
489
+
}
490
+
/* LiteralNumberFloat */
491
+
.chroma .mf {
492
+
color: #fe640b;
493
+
}
494
+
/* LiteralNumberHex */
495
+
.chroma .mh {
496
+
color: #fe640b;
497
+
}
498
+
/* LiteralNumberInteger */
499
+
.chroma .mi {
500
+
color: #fe640b;
501
+
}
502
+
/* LiteralNumberIntegerLong */
503
+
.chroma .il {
504
+
color: #fe640b;
505
+
}
506
+
/* LiteralNumberOct */
507
+
.chroma .mo {
508
+
color: #fe640b;
509
+
}
510
+
/* Operator */
511
+
.chroma .o {
512
+
color: #04a5e5;
513
+
font-weight: bold;
514
+
}
515
+
/* OperatorWord */
516
+
.chroma .ow {
517
+
color: #04a5e5;
518
+
font-weight: bold;
519
+
}
520
+
/* Comment */
521
+
.chroma .c {
522
+
color: #9ca0b0;
523
+
font-style: italic;
524
+
}
525
+
/* CommentHashbang */
526
+
.chroma .ch {
527
+
color: #9ca0b0;
528
+
font-style: italic;
529
+
}
530
+
/* CommentMultiline */
531
+
.chroma .cm {
532
+
color: #9ca0b0;
533
+
font-style: italic;
534
+
}
535
+
/* CommentSingle */
536
+
.chroma .c1 {
537
+
color: #9ca0b0;
538
+
font-style: italic;
539
+
}
540
+
/* CommentSpecial */
541
+
.chroma .cs {
542
+
color: #9ca0b0;
543
+
font-style: italic;
544
+
}
545
+
/* CommentPreproc */
546
+
.chroma .cp {
547
+
color: #9ca0b0;
548
+
font-style: italic;
549
+
}
550
+
/* CommentPreprocFile */
551
+
.chroma .cpf {
552
+
color: #9ca0b0;
553
+
font-weight: bold;
554
+
font-style: italic;
555
+
}
556
+
/* GenericDeleted */
557
+
.chroma .gd {
558
+
color: #d20f39;
559
+
background-color: oklch(93.6% 0.032 17.717);
560
+
}
561
+
/* GenericEmph */
562
+
.chroma .ge {
563
+
font-style: italic;
564
+
}
565
+
/* GenericError */
566
+
.chroma .gr {
567
+
color: #d20f39;
568
+
}
569
+
/* GenericHeading */
570
+
.chroma .gh {
571
+
color: #fe640b;
572
+
font-weight: bold;
573
+
}
574
+
/* GenericInserted */
575
+
.chroma .gi {
576
+
color: #40a02b;
577
+
background-color: oklch(96.2% 0.044 156.743);
578
+
}
579
+
/* GenericStrong */
580
+
.chroma .gs {
581
+
font-weight: bold;
582
+
}
583
+
/* GenericSubheading */
584
+
.chroma .gu {
585
+
color: #fe640b;
586
+
font-weight: bold;
587
+
}
588
+
/* GenericTraceback */
589
+
.chroma .gt {
590
+
color: #d20f39;
591
+
}
592
+
/* GenericUnderline */
593
+
.chroma .gl {
594
+
text-decoration: underline;
595
+
}
596
+
597
+
@media (prefers-color-scheme: dark) {
598
+
/* Background */
599
+
.bg {
600
+
color: #cad3f5;
601
+
background-color: #24273a;
602
+
}
603
+
/* PreWrapper */
604
+
.chroma {
605
+
color: #cad3f5;
606
+
}
607
+
/* Error */
608
+
.chroma .err {
609
+
color: #ed8796;
610
+
}
611
+
/* LineLink */
612
+
.chroma .lnlinks {
613
+
outline: none;
614
+
text-decoration: none;
615
+
color: inherit;
616
+
}
617
+
/* LineTableTD */
618
+
.chroma .lntd {
619
+
vertical-align: top;
620
+
padding: 0;
621
+
margin: 0;
622
+
border: 0;
623
+
}
624
+
/* LineTable */
625
+
.chroma .lntable {
626
+
border-spacing: 0;
627
+
padding: 0;
628
+
margin: 0;
629
+
border: 0;
630
+
}
631
+
/* LineHighlight */
632
+
.chroma .hl {
633
+
background-color: #494d64;
634
+
}
635
+
/* LineNumbersTable */
636
+
.chroma .lnt {
637
+
white-space: pre;
638
+
-webkit-user-select: none;
639
+
user-select: none;
640
+
margin-right: 0.4em;
641
+
padding: 0 0.4em 0 0.4em;
642
+
color: #8087a2;
643
+
}
644
+
/* LineNumbers */
645
+
.chroma .ln {
646
+
white-space: pre;
647
+
-webkit-user-select: none;
648
+
user-select: none;
649
+
margin-right: 0.4em;
650
+
padding: 0 0.4em 0 0.4em;
651
+
color: #8087a2;
652
+
}
653
+
/* Line */
654
+
.chroma .line {
655
+
display: flex;
656
+
}
657
+
/* Keyword */
658
+
.chroma .k {
659
+
color: #c6a0f6;
660
+
}
661
+
/* KeywordConstant */
662
+
.chroma .kc {
663
+
color: #f5a97f;
664
+
}
665
+
/* KeywordDeclaration */
666
+
.chroma .kd {
667
+
color: #ed8796;
668
+
}
669
+
/* KeywordNamespace */
670
+
.chroma .kn {
671
+
color: #8bd5ca;
672
+
}
673
+
/* KeywordPseudo */
674
+
.chroma .kp {
675
+
color: #c6a0f6;
676
+
}
677
+
/* KeywordReserved */
678
+
.chroma .kr {
679
+
color: #c6a0f6;
680
+
}
681
+
/* KeywordType */
682
+
.chroma .kt {
683
+
color: #ed8796;
684
+
}
685
+
/* NameAttribute */
686
+
.chroma .na {
687
+
color: #8aadf4;
688
+
}
689
+
/* NameBuiltin */
690
+
.chroma .nb {
691
+
color: #91d7e3;
692
+
}
693
+
/* NameBuiltinPseudo */
694
+
.chroma .bp {
695
+
color: #91d7e3;
696
+
}
697
+
/* NameClass */
698
+
.chroma .nc {
699
+
color: #eed49f;
700
+
}
701
+
/* NameConstant */
702
+
.chroma .no {
703
+
color: #eed49f;
704
+
}
705
+
/* NameDecorator */
706
+
.chroma .nd {
707
+
color: #8aadf4;
708
+
font-weight: bold;
709
+
}
710
+
/* NameEntity */
711
+
.chroma .ni {
712
+
color: #8bd5ca;
713
+
}
714
+
/* NameException */
715
+
.chroma .ne {
716
+
color: #f5a97f;
717
+
}
718
+
/* NameFunction */
719
+
.chroma .nf {
720
+
color: #8aadf4;
721
+
}
722
+
/* NameFunctionMagic */
723
+
.chroma .fm {
724
+
color: #8aadf4;
725
+
}
726
+
/* NameLabel */
727
+
.chroma .nl {
728
+
color: #91d7e3;
729
+
}
730
+
/* NameNamespace */
731
+
.chroma .nn {
732
+
color: #f5a97f;
733
+
}
734
+
/* NameProperty */
735
+
.chroma .py {
736
+
color: #f5a97f;
737
+
}
738
+
/* NameTag */
739
+
.chroma .nt {
740
+
color: #c6a0f6;
741
+
}
742
+
/* NameVariable */
743
+
.chroma .nv {
744
+
color: #f4dbd6;
745
+
}
746
+
/* NameVariableClass */
747
+
.chroma .vc {
748
+
color: #f4dbd6;
749
+
}
750
+
/* NameVariableGlobal */
751
+
.chroma .vg {
752
+
color: #f4dbd6;
753
+
}
754
+
/* NameVariableInstance */
755
+
.chroma .vi {
756
+
color: #f4dbd6;
757
+
}
758
+
/* NameVariableMagic */
759
+
.chroma .vm {
760
+
color: #f4dbd6;
761
+
}
762
+
/* LiteralString */
763
+
.chroma .s {
764
+
color: #a6da95;
765
+
}
766
+
/* LiteralStringAffix */
767
+
.chroma .sa {
768
+
color: #ed8796;
769
+
}
770
+
/* LiteralStringBacktick */
771
+
.chroma .sb {
772
+
color: #a6da95;
773
+
}
774
+
/* LiteralStringChar */
775
+
.chroma .sc {
776
+
color: #a6da95;
777
+
}
778
+
/* LiteralStringDelimiter */
779
+
.chroma .dl {
780
+
color: #8aadf4;
781
+
}
782
+
/* LiteralStringDoc */
783
+
.chroma .sd {
784
+
color: #6e738d;
785
+
}
786
+
/* LiteralStringDouble */
787
+
.chroma .s2 {
788
+
color: #a6da95;
789
+
}
790
+
/* LiteralStringEscape */
791
+
.chroma .se {
792
+
color: #8aadf4;
793
+
}
794
+
/* LiteralStringHeredoc */
795
+
.chroma .sh {
796
+
color: #6e738d;
797
+
}
798
+
/* LiteralStringInterpol */
799
+
.chroma .si {
800
+
color: #a6da95;
801
+
}
802
+
/* LiteralStringOther */
803
+
.chroma .sx {
804
+
color: #a6da95;
805
+
}
806
+
/* LiteralStringRegex */
807
+
.chroma .sr {
808
+
color: #8bd5ca;
809
+
}
810
+
/* LiteralStringSingle */
811
+
.chroma .s1 {
812
+
color: #a6da95;
813
+
}
814
+
/* LiteralStringSymbol */
815
+
.chroma .ss {
816
+
color: #a6da95;
817
+
}
818
+
/* LiteralNumber */
819
+
.chroma .m {
820
+
color: #f5a97f;
821
+
}
822
+
/* LiteralNumberBin */
823
+
.chroma .mb {
824
+
color: #f5a97f;
825
+
}
826
+
/* LiteralNumberFloat */
827
+
.chroma .mf {
828
+
color: #f5a97f;
829
+
}
830
+
/* LiteralNumberHex */
831
+
.chroma .mh {
832
+
color: #f5a97f;
833
+
}
834
+
/* LiteralNumberInteger */
835
+
.chroma .mi {
836
+
color: #f5a97f;
837
+
}
838
+
/* LiteralNumberIntegerLong */
839
+
.chroma .il {
840
+
color: #f5a97f;
841
+
}
842
+
/* LiteralNumberOct */
843
+
.chroma .mo {
844
+
color: #f5a97f;
845
+
}
846
+
/* Operator */
847
+
.chroma .o {
848
+
color: #91d7e3;
849
+
font-weight: bold;
850
+
}
851
+
/* OperatorWord */
852
+
.chroma .ow {
853
+
color: #91d7e3;
854
+
font-weight: bold;
855
+
}
856
+
/* Comment */
857
+
.chroma .c {
858
+
color: #6e738d;
859
+
font-style: italic;
860
+
}
861
+
/* CommentHashbang */
862
+
.chroma .ch {
863
+
color: #6e738d;
864
+
font-style: italic;
865
+
}
866
+
/* CommentMultiline */
867
+
.chroma .cm {
868
+
color: #6e738d;
869
+
font-style: italic;
870
+
}
871
+
/* CommentSingle */
872
+
.chroma .c1 {
873
+
color: #6e738d;
874
+
font-style: italic;
875
+
}
876
+
/* CommentSpecial */
877
+
.chroma .cs {
878
+
color: #6e738d;
879
+
font-style: italic;
880
+
}
881
+
/* CommentPreproc */
882
+
.chroma .cp {
883
+
color: #6e738d;
884
+
font-style: italic;
885
+
}
886
+
/* CommentPreprocFile */
887
+
.chroma .cpf {
888
+
color: #6e738d;
889
+
font-weight: bold;
890
+
font-style: italic;
891
+
}
892
+
/* GenericDeleted */
893
+
.chroma .gd {
894
+
color: #ed8796;
895
+
background-color: oklch(44.4% 0.177 26.899 / 0.5);
896
+
}
897
+
/* GenericEmph */
898
+
.chroma .ge {
899
+
font-style: italic;
900
+
}
901
+
/* GenericError */
902
+
.chroma .gr {
903
+
color: #ed8796;
904
+
}
905
+
/* GenericHeading */
906
+
.chroma .gh {
907
+
color: #f5a97f;
908
+
font-weight: bold;
909
+
}
910
+
/* GenericInserted */
911
+
.chroma .gi {
912
+
color: #a6da95;
913
+
background-color: oklch(44.8% 0.119 151.328 / 0.5);
914
+
}
915
+
/* GenericStrong */
916
+
.chroma .gs {
917
+
font-weight: bold;
918
+
}
919
+
/* GenericSubheading */
920
+
.chroma .gu {
921
+
color: #f5a97f;
922
+
font-weight: bold;
923
+
}
924
+
/* GenericTraceback */
925
+
.chroma .gt {
926
+
color: #ed8796;
927
+
}
928
+
/* GenericUnderline */
929
+
.chroma .gl {
930
+
text-decoration: underline;
931
+
}
932
+
}
933
+
934
+
actor-typeahead {
935
+
--color-background: #ffffff;
936
+
--color-border: #d1d5db;
937
+
--color-shadow: #000000;
938
+
--color-hover: #f9fafb;
939
+
--color-avatar-fallback: #e5e7eb;
940
+
--radius: 0.0;
941
+
--padding-menu: 0.0rem;
942
+
z-index: 1000;
943
+
}
944
+
945
+
actor-typeahead::part(handle) {
946
+
color: #111827;
947
+
}
948
+
949
+
actor-typeahead::part(menu) {
950
+
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
951
+
}
952
+
953
+
@media (prefers-color-scheme: dark) {
954
+
actor-typeahead {
955
+
--color-background: #1f2937;
956
+
--color-border: #4b5563;
957
+
--color-shadow: #000000;
958
+
--color-hover: #374151;
959
+
--color-avatar-fallback: #4b5563;
960
+
}
961
+
962
+
actor-typeahead::part(handle) {
963
+
color: #f9fafb;
964
+
}
144
965
}