@cirthcss/cirth 0.12.0 → 0.13.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/README.md +21 -13
- package/dist/cirth.classless.css +305 -503
- package/dist/cirth.classless.min.css +1 -1
- package/dist/cirth.classless.scoped.css +305 -495
- package/dist/cirth.classless.scoped.min.css +1 -1
- package/dist/cirth.css +388 -511
- package/dist/cirth.min.css +1 -1
- package/dist/cirth.print.classless.css +127 -0
- package/dist/cirth.print.classless.min.css +1 -0
- package/dist/cirth.print.classless.scoped.css +119 -0
- package/dist/cirth.print.classless.scoped.min.css +1 -0
- package/dist/cirth.print.css +133 -0
- package/dist/cirth.print.min.css +1 -0
- package/dist/cirth.print.scoped.css +125 -0
- package/dist/cirth.print.scoped.min.css +1 -0
- package/dist/cirth.scoped.css +388 -503
- package/dist/cirth.scoped.min.css +1 -1
- package/dist/presets/plain.css +16 -0
- package/dist/presets/plain.min.css +1 -0
- package/dist/presets/playroom.css +38 -0
- package/dist/presets/playroom.min.css +1 -0
- package/package.json +7 -4
- package/dist/presets/cobalt.css +0 -95
- package/dist/presets/cobalt.min.css +0 -1
- package/dist/presets/coral.css +0 -103
- package/dist/presets/coral.min.css +0 -1
|
@@ -225,7 +225,7 @@
|
|
|
225
225
|
}
|
|
226
226
|
|
|
227
227
|
.cirth button, .cirth [type="submit"], .cirth [type="reset"], .cirth [type="button"] {
|
|
228
|
-
|
|
228
|
+
appearance: auto;
|
|
229
229
|
}
|
|
230
230
|
|
|
231
231
|
.cirth button, .cirth [type="submit"], .cirth [type="reset"], .cirth [type="button"], .cirth [role="button"] {
|
|
@@ -234,7 +234,7 @@
|
|
|
234
234
|
--cirth-color: var(--cirth-primary-inverse);
|
|
235
235
|
--cirth-box-shadow: var(--cirth-button-box-shadow, 0 0 0 #0000);
|
|
236
236
|
max-width: 100%;
|
|
237
|
-
min-block-size: calc(var(--cirth-size-
|
|
237
|
+
min-block-size: calc(var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2);
|
|
238
238
|
padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
|
|
239
239
|
border: var(--cirth-border-width) solid var(--cirth-border-color);
|
|
240
240
|
border-radius: var(--cirth-border-radius);
|
|
@@ -259,7 +259,7 @@
|
|
|
259
259
|
--cirth-color: var(--cirth-primary-inverse);
|
|
260
260
|
--cirth-box-shadow: var(--cirth-button-box-shadow, 0 0 0 #0000);
|
|
261
261
|
max-width: 100%;
|
|
262
|
-
min-block-size: calc(var(--cirth-size-
|
|
262
|
+
min-block-size: calc(var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2);
|
|
263
263
|
padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
|
|
264
264
|
border: var(--cirth-border-width) solid var(--cirth-border-color);
|
|
265
265
|
border-radius: var(--cirth-border-radius);
|
|
@@ -513,7 +513,7 @@
|
|
|
513
513
|
}
|
|
514
514
|
|
|
515
515
|
.cirth [type="search"] {
|
|
516
|
-
|
|
516
|
+
appearance: textfield;
|
|
517
517
|
outline-offset: -2px;
|
|
518
518
|
}
|
|
519
519
|
|
|
@@ -522,7 +522,7 @@
|
|
|
522
522
|
}
|
|
523
523
|
|
|
524
524
|
.cirth ::file-selector-button {
|
|
525
|
-
|
|
525
|
+
appearance: auto;
|
|
526
526
|
font: inherit;
|
|
527
527
|
}
|
|
528
528
|
|
|
@@ -536,11 +536,11 @@
|
|
|
536
536
|
}
|
|
537
537
|
|
|
538
538
|
.cirth input:not([type="checkbox"], [type="radio"], [type="range"]) {
|
|
539
|
-
height: calc(var(--cirth-size-
|
|
539
|
+
height: calc(var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2);
|
|
540
540
|
}
|
|
541
541
|
|
|
542
542
|
.cirth select, .cirth textarea {
|
|
543
|
-
min-block-size: calc(var(--cirth-size-
|
|
543
|
+
min-block-size: calc(var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2);
|
|
544
544
|
}
|
|
545
545
|
|
|
546
546
|
.cirth fieldset {
|
|
@@ -594,6 +594,12 @@
|
|
|
594
594
|
--cirth-border-color: var(--cirth-form-element-active-border-color);
|
|
595
595
|
}
|
|
596
596
|
|
|
597
|
+
.cirth input:not([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="range"], [type="file"], [readonly]):hover:not(:active, :focus, [disabled], [aria-invalid]), .cirth :where(select, textarea):not([readonly]):hover:not(:active, :focus, [disabled], [aria-invalid]) {
|
|
598
|
+
--cirth-border-color: color-mix(in oklch,
|
|
599
|
+
var(--cirth-form-element-border-color) 65%,
|
|
600
|
+
var(--cirth-color));
|
|
601
|
+
}
|
|
602
|
+
|
|
597
603
|
.cirth input:not([type="submit"], [type="button"], [type="reset"], [type="range"], [type="file"], [readonly]):focus, .cirth :where(select, textarea):not([readonly]):focus {
|
|
598
604
|
--cirth-box-shadow: 0 0 0 var(--cirth-outline-width)
|
|
599
605
|
var(--cirth-form-element-focus-color);
|
|
@@ -612,7 +618,7 @@
|
|
|
612
618
|
.cirth :where(input, select, textarea):not([type="checkbox"], [type="radio"], [type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"], [type="range"]):is([aria-invalid], :user-invalid:not([aria-invalid], [type="range"]):not(select:focus)) {
|
|
613
619
|
padding-inline: var(--cirth-form-element-spacing-horizontal) calc(var(--cirth-form-element-spacing-horizontal) + var(--cirth-space-6));
|
|
614
620
|
background-position: center right var(--cirth-space-3);
|
|
615
|
-
background-size: var(--cirth-size-
|
|
621
|
+
background-size: var(--cirth-font-size-md) auto;
|
|
616
622
|
background-repeat: no-repeat;
|
|
617
623
|
}
|
|
618
624
|
|
|
@@ -671,7 +677,7 @@
|
|
|
671
677
|
padding-inline: var(--cirth-form-element-spacing-horizontal) calc(var(--cirth-form-element-spacing-horizontal) + var(--cirth-space-6));
|
|
672
678
|
background-image: var(--cirth-icon-chevron);
|
|
673
679
|
background-position: center right var(--cirth-space-3);
|
|
674
|
-
background-size: var(--cirth-size-
|
|
680
|
+
background-size: var(--cirth-font-size-md) auto;
|
|
675
681
|
background-repeat: no-repeat;
|
|
676
682
|
}
|
|
677
683
|
|
|
@@ -694,11 +700,11 @@
|
|
|
694
700
|
}
|
|
695
701
|
|
|
696
702
|
.cirth textarea:is([aria-invalid], :user-invalid:not([aria-invalid], [type="range"]):not(select:focus)) {
|
|
697
|
-
--cirth-icon-height: calc(var(--cirth-size-
|
|
703
|
+
--cirth-icon-height: calc(var(--cirth-font-size-md) * var(--cirth-line-height) +
|
|
698
704
|
var(--cirth-form-element-spacing-vertical) * 2 +
|
|
699
705
|
var(--cirth-border-width) * 2);
|
|
700
706
|
background-position: top right var(--cirth-space-3);
|
|
701
|
-
background-size: var(--cirth-size-
|
|
707
|
+
background-size: var(--cirth-font-size-md) var(--cirth-icon-height);
|
|
702
708
|
}
|
|
703
709
|
|
|
704
710
|
.cirth :where(input, select, textarea, fieldset) + small {
|
|
@@ -740,10 +746,6 @@
|
|
|
740
746
|
.cirth [type="checkbox"]:checked, .cirth [type="checkbox"]:checked:active, .cirth [type="checkbox"]:checked:focus, .cirth [type="radio"]:checked, .cirth [type="radio"]:checked:active, .cirth [type="radio"]:checked:focus {
|
|
741
747
|
--cirth-background-color: var(--cirth-primary-background);
|
|
742
748
|
--cirth-border-color: var(--cirth-primary-border);
|
|
743
|
-
background-image: var(--cirth-icon-checkbox);
|
|
744
|
-
background-position: center;
|
|
745
|
-
background-repeat: no-repeat;
|
|
746
|
-
background-size: .9em;
|
|
747
749
|
}
|
|
748
750
|
|
|
749
751
|
.cirth [type="checkbox"] ~ label, .cirth [type="radio"] ~ label {
|
|
@@ -756,13 +758,34 @@
|
|
|
756
758
|
margin-inline-end: 1em;
|
|
757
759
|
}
|
|
758
760
|
|
|
759
|
-
.cirth [type="checkbox"]:indeterminate {
|
|
761
|
+
.cirth [type="checkbox"]:not([role="switch"]):checked:before, .cirth [type="checkbox"]:not([role="switch"]):indeterminate:before {
|
|
762
|
+
background-color: var(--cirth-primary-inverse);
|
|
763
|
+
content: "";
|
|
764
|
+
width: 100%;
|
|
765
|
+
height: 100%;
|
|
766
|
+
display: block;
|
|
767
|
+
mask-position: center;
|
|
768
|
+
mask-size: .9em;
|
|
769
|
+
mask-repeat: no-repeat;
|
|
770
|
+
}
|
|
771
|
+
|
|
772
|
+
@media (forced-colors: active) {
|
|
773
|
+
.cirth [type="checkbox"]:not([role="switch"]):checked:before, .cirth [type="checkbox"]:not([role="switch"]):indeterminate:before {
|
|
774
|
+
background-color: canvastext;
|
|
775
|
+
}
|
|
776
|
+
}
|
|
777
|
+
|
|
778
|
+
.cirth [type="checkbox"]:not([role="switch"]):checked:before {
|
|
779
|
+
mask-image: var(--cirth-icon-checkbox);
|
|
780
|
+
}
|
|
781
|
+
|
|
782
|
+
.cirth [type="checkbox"]:not([role="switch"]):indeterminate {
|
|
760
783
|
--cirth-background-color: var(--cirth-primary-background);
|
|
761
784
|
--cirth-border-color: var(--cirth-primary-border);
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
785
|
+
}
|
|
786
|
+
|
|
787
|
+
.cirth [type="checkbox"]:not([role="switch"]):indeterminate:before {
|
|
788
|
+
mask-image: var(--cirth-icon-minus);
|
|
766
789
|
}
|
|
767
790
|
|
|
768
791
|
.cirth [type="radio"] {
|
|
@@ -771,7 +794,6 @@
|
|
|
771
794
|
|
|
772
795
|
.cirth [type="radio"]:checked, .cirth [type="radio"]:checked:active, .cirth [type="radio"]:checked:focus {
|
|
773
796
|
--cirth-background-color: var(--cirth-primary-inverse);
|
|
774
|
-
background-image: none;
|
|
775
797
|
border-width: .42em;
|
|
776
798
|
}
|
|
777
799
|
|
|
@@ -809,7 +831,6 @@
|
|
|
809
831
|
.cirth [type="checkbox"][role="switch"]:checked {
|
|
810
832
|
--cirth-background-color: var(--cirth-switch-checked-background-color);
|
|
811
833
|
--cirth-border-color: var(--cirth-switch-checked-background-color);
|
|
812
|
-
background-image: none;
|
|
813
834
|
}
|
|
814
835
|
|
|
815
836
|
.cirth [type="checkbox"][role="switch"]:checked:before {
|
|
@@ -856,7 +877,7 @@
|
|
|
856
877
|
|
|
857
878
|
.cirth input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]):is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
|
|
858
879
|
--cirth-icon-position: var(--cirth-space-3);
|
|
859
|
-
--cirth-icon-width: var(--cirth-size-
|
|
880
|
+
--cirth-icon-width: var(--cirth-font-size-md);
|
|
860
881
|
min-width: 0;
|
|
861
882
|
background-image: var(--cirth-icon-date);
|
|
862
883
|
background-position: center right var(--cirth-icon-position);
|
|
@@ -1039,7 +1060,7 @@
|
|
|
1039
1060
|
}
|
|
1040
1061
|
|
|
1041
1062
|
.cirth details summary {
|
|
1042
|
-
line-height: var(--cirth-size-
|
|
1063
|
+
line-height: var(--cirth-font-size-md);
|
|
1043
1064
|
cursor: pointer;
|
|
1044
1065
|
transition: color var(--cirth-transition);
|
|
1045
1066
|
list-style-type: none;
|
|
@@ -1058,18 +1079,28 @@
|
|
|
1058
1079
|
}
|
|
1059
1080
|
|
|
1060
1081
|
.cirth details summary:after {
|
|
1061
|
-
width: var(--cirth-size-
|
|
1062
|
-
height: var(--cirth-size-
|
|
1082
|
+
width: var(--cirth-font-size-md);
|
|
1083
|
+
height: var(--cirth-font-size-md);
|
|
1063
1084
|
float: right;
|
|
1064
|
-
background-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
|
|
1068
|
-
transition: transform var(--cirth-transition);
|
|
1069
|
-
background-repeat: no-repeat;
|
|
1085
|
+
background-color: var(--cirth-muted-color);
|
|
1086
|
+
mask-image: var(--cirth-icon-chevron);
|
|
1087
|
+
mask-position: 100%;
|
|
1088
|
+
mask-size: var(--cirth-font-size-md) auto;
|
|
1070
1089
|
margin-inline-start: calc(var(--cirth-spacing, var(--cirth-space-4)) * .5);
|
|
1071
1090
|
display: block;
|
|
1072
1091
|
transform: rotate(-90deg);
|
|
1092
|
+
mask-repeat: no-repeat;
|
|
1093
|
+
}
|
|
1094
|
+
|
|
1095
|
+
@media (forced-colors: active) {
|
|
1096
|
+
.cirth details summary:after {
|
|
1097
|
+
background-color: canvastext;
|
|
1098
|
+
}
|
|
1099
|
+
}
|
|
1100
|
+
|
|
1101
|
+
.cirth details summary:after {
|
|
1102
|
+
content: "";
|
|
1103
|
+
transition: transform var(--cirth-transition);
|
|
1073
1104
|
}
|
|
1074
1105
|
|
|
1075
1106
|
.cirth details summary:focus {
|
|
@@ -1092,7 +1123,7 @@
|
|
|
1092
1123
|
}
|
|
1093
1124
|
|
|
1094
1125
|
.cirth details summary[role="button"]:after {
|
|
1095
|
-
height: calc(var(--cirth-size-
|
|
1126
|
+
height: calc(var(--cirth-font-size-md) * var(--cirth-line-height, var(--cirth-line-height-normal)));
|
|
1096
1127
|
}
|
|
1097
1128
|
|
|
1098
1129
|
.cirth details[open] > summary {
|
|
@@ -1190,12 +1221,7 @@
|
|
|
1190
1221
|
z-index: 2;
|
|
1191
1222
|
}
|
|
1192
1223
|
|
|
1193
|
-
.cirth [role="search"] > :has( + small:last-child) {
|
|
1194
|
-
border-start-end-radius: var(--cirth-border-radius);
|
|
1195
|
-
border-end-end-radius: var(--cirth-border-radius);
|
|
1196
|
-
}
|
|
1197
|
-
|
|
1198
|
-
.cirth [role="group"]:not(fieldset) > :has( + small:last-child) {
|
|
1224
|
+
.cirth [role="search"] > :has( + small:last-child), .cirth [role="group"]:not(fieldset) > :has( + small:last-child) {
|
|
1199
1225
|
border-start-end-radius: var(--cirth-border-radius);
|
|
1200
1226
|
border-end-end-radius: var(--cirth-border-radius);
|
|
1201
1227
|
}
|
|
@@ -1208,98 +1234,27 @@
|
|
|
1208
1234
|
width: auto;
|
|
1209
1235
|
}
|
|
1210
1236
|
|
|
1211
|
-
|
|
1212
|
-
|
|
1213
|
-
|
|
1214
|
-
}
|
|
1215
|
-
|
|
1216
|
-
.cirth [role="group"]:not(fieldset):has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) {
|
|
1217
|
-
--cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-button);
|
|
1218
|
-
}
|
|
1219
|
-
|
|
1220
|
-
.cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) input:not([type="checkbox"], [type="radio"], [aria-invalid]) {
|
|
1221
|
-
border-color: #0000;
|
|
1222
|
-
}
|
|
1223
|
-
|
|
1224
|
-
.cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) select:not([aria-invalid]) {
|
|
1225
|
-
border-color: #0000;
|
|
1226
|
-
}
|
|
1227
|
-
|
|
1228
|
-
.cirth [role="group"]:not(fieldset):has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) input:not([type="checkbox"], [type="radio"], [aria-invalid]) {
|
|
1229
|
-
border-color: #0000;
|
|
1230
|
-
}
|
|
1231
|
-
|
|
1232
|
-
.cirth [role="group"]:not(fieldset):has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) select:not([aria-invalid]) {
|
|
1233
|
-
border-color: #0000;
|
|
1234
|
-
}
|
|
1235
|
-
|
|
1236
|
-
.cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) {
|
|
1237
|
-
--cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-input);
|
|
1238
|
-
}
|
|
1239
|
-
|
|
1240
|
-
.cirth [role="group"]:not(fieldset):has(input:not([type="submit"], [type="button"]):focus, select:focus) {
|
|
1241
|
-
--cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-input);
|
|
1242
|
-
}
|
|
1243
|
-
|
|
1244
|
-
.cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) button {
|
|
1245
|
-
--cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1246
|
-
var(--cirth-primary-border);
|
|
1247
|
-
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1248
|
-
var(--cirth-primary-hover-border);
|
|
1249
|
-
}
|
|
1250
|
-
|
|
1251
|
-
.cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) [type="submit"] {
|
|
1252
|
-
--cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1253
|
-
var(--cirth-primary-border);
|
|
1254
|
-
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1255
|
-
var(--cirth-primary-hover-border);
|
|
1256
|
-
}
|
|
1257
|
-
|
|
1258
|
-
.cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) [type="button"] {
|
|
1259
|
-
--cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1260
|
-
var(--cirth-primary-border);
|
|
1261
|
-
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1262
|
-
var(--cirth-primary-hover-border);
|
|
1263
|
-
}
|
|
1264
|
-
|
|
1265
|
-
.cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) [role="button"] {
|
|
1266
|
-
--cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1267
|
-
var(--cirth-primary-border);
|
|
1268
|
-
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1269
|
-
var(--cirth-primary-hover-border);
|
|
1270
|
-
}
|
|
1271
|
-
|
|
1272
|
-
.cirth [role="group"]:not(fieldset):has(input:not([type="submit"], [type="button"]):focus, select:focus) button {
|
|
1273
|
-
--cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1274
|
-
var(--cirth-primary-border);
|
|
1275
|
-
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1276
|
-
var(--cirth-primary-hover-border);
|
|
1277
|
-
}
|
|
1237
|
+
.cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus), .cirth [role="group"]:not(fieldset):has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) {
|
|
1238
|
+
--cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-button);
|
|
1239
|
+
}
|
|
1278
1240
|
|
|
1279
|
-
|
|
1280
|
-
|
|
1281
|
-
|
|
1282
|
-
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1283
|
-
var(--cirth-primary-hover-border);
|
|
1284
|
-
}
|
|
1241
|
+
.cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) input:not([type="checkbox"], [type="radio"], [aria-invalid]), .cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) select:not([aria-invalid]), .cirth [role="group"]:not(fieldset):has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) input:not([type="checkbox"], [type="radio"], [aria-invalid]), .cirth [role="group"]:not(fieldset):has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) select:not([aria-invalid]) {
|
|
1242
|
+
border-color: #0000;
|
|
1243
|
+
}
|
|
1285
1244
|
|
|
1286
|
-
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1290
|
-
var(--cirth-primary-hover-border);
|
|
1291
|
-
}
|
|
1245
|
+
.cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus), .cirth [role="group"]:not(fieldset):has(input:not([type="submit"], [type="button"]):focus, select:focus) {
|
|
1246
|
+
--cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-input);
|
|
1247
|
+
}
|
|
1292
1248
|
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1249
|
+
.cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) button, .cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) [type="submit"], .cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) [type="button"], .cirth [role="search"]:has(input:not([type="submit"], [type="button"]):focus, select:focus) [role="button"], .cirth [role="group"]:not(fieldset):has(input:not([type="submit"], [type="button"]):focus, select:focus) button, .cirth [role="group"]:not(fieldset):has(input:not([type="submit"], [type="button"]):focus, select:focus) [type="submit"], .cirth [role="group"]:not(fieldset):has(input:not([type="submit"], [type="button"]):focus, select:focus) [type="button"], .cirth [role="group"]:not(fieldset):has(input:not([type="submit"], [type="button"]):focus, select:focus) [role="button"] {
|
|
1250
|
+
--cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1251
|
+
var(--cirth-primary-border);
|
|
1252
|
+
--cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
|
|
1253
|
+
var(--cirth-primary-hover-border);
|
|
1254
|
+
}
|
|
1299
1255
|
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
}
|
|
1256
|
+
.cirth [role="search"] button:focus, .cirth [role="search"] [type="submit"]:focus, .cirth [role="search"] [type="reset"]:focus, .cirth [role="search"] [type="button"]:focus, .cirth [role="search"] [role="button"]:focus, .cirth [role="group"]:not(fieldset) button:focus, .cirth [role="group"]:not(fieldset) [type="submit"]:focus, .cirth [role="group"]:not(fieldset) [type="reset"]:focus, .cirth [role="group"]:not(fieldset) [type="button"]:focus, .cirth [role="group"]:not(fieldset) [role="button"]:focus {
|
|
1257
|
+
box-shadow: none;
|
|
1303
1258
|
}
|
|
1304
1259
|
|
|
1305
1260
|
.cirth [role="search"] > :not([hidden], input[type="hidden"]):nth-child(1 of :not([hidden], input[type="hidden"])) {
|
|
@@ -1307,12 +1262,7 @@
|
|
|
1307
1262
|
border-end-start-radius: var(--cirth-radius-pill);
|
|
1308
1263
|
}
|
|
1309
1264
|
|
|
1310
|
-
.cirth [role="search"] > :not([hidden], input[type="hidden"]):nth-last-child(1 of :not([hidden], input[type="hidden"])) {
|
|
1311
|
-
border-start-end-radius: var(--cirth-radius-pill);
|
|
1312
|
-
border-end-end-radius: var(--cirth-radius-pill);
|
|
1313
|
-
}
|
|
1314
|
-
|
|
1315
|
-
.cirth [role="search"] > :has( + small:last-child) {
|
|
1265
|
+
.cirth [role="search"] > :not([hidden], input[type="hidden"]):nth-last-child(1 of :not([hidden], input[type="hidden"])), .cirth [role="search"] > :has( + small:last-child) {
|
|
1316
1266
|
border-start-end-radius: var(--cirth-radius-pill);
|
|
1317
1267
|
border-end-end-radius: var(--cirth-radius-pill);
|
|
1318
1268
|
}
|
|
@@ -1326,13 +1276,10 @@
|
|
|
1326
1276
|
vertical-align: -.125em;
|
|
1327
1277
|
width: 1em;
|
|
1328
1278
|
height: 1em;
|
|
1329
|
-
-webkit-mask-image: var(--cirth-icon-loading);
|
|
1330
1279
|
mask-image: var(--cirth-icon-loading);
|
|
1331
1280
|
background-color: currentColor;
|
|
1332
1281
|
display: inline-block;
|
|
1333
|
-
-webkit-mask-size: 1em;
|
|
1334
1282
|
mask-size: 1em;
|
|
1335
|
-
-webkit-mask-repeat: no-repeat;
|
|
1336
1283
|
mask-repeat: no-repeat;
|
|
1337
1284
|
}
|
|
1338
1285
|
|
|
@@ -1373,7 +1320,7 @@
|
|
|
1373
1320
|
.cirth meter {
|
|
1374
1321
|
appearance: none;
|
|
1375
1322
|
width: 100%;
|
|
1376
|
-
height: var(--cirth-
|
|
1323
|
+
height: var(--cirth-space-2);
|
|
1377
1324
|
margin-bottom: calc(var(--cirth-spacing) * .5);
|
|
1378
1325
|
border: var(--cirth-border-width-1) solid var(--cirth-meter-border-color);
|
|
1379
1326
|
border-radius: var(--cirth-border-radius);
|
|
@@ -1477,7 +1424,7 @@
|
|
|
1477
1424
|
}
|
|
1478
1425
|
|
|
1479
1426
|
.cirth dialog > article > header :is(a, button)[rel="prev"] {
|
|
1480
|
-
margin: calc(calc((var(--cirth-size-
|
|
1427
|
+
margin: calc(calc((var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2 - var(--cirth-font-size-md)) / 2) * -1);
|
|
1481
1428
|
float: right;
|
|
1482
1429
|
margin-inline-start: var(--cirth-spacing);
|
|
1483
1430
|
padding: 0;
|
|
@@ -1496,23 +1443,37 @@
|
|
|
1496
1443
|
}
|
|
1497
1444
|
|
|
1498
1445
|
.cirth dialog > article :is(a, button)[rel="prev"] {
|
|
1499
|
-
width: calc(var(--cirth-size-
|
|
1500
|
-
height: calc(var(--cirth-size-
|
|
1501
|
-
margin-top: calc(var(--cirth-spacing) * -1 - calc((var(--cirth-size-
|
|
1502
|
-
margin-right: calc(calc((var(--cirth-size-
|
|
1503
|
-
margin-bottom: calc(var(--cirth-spacing) - calc((var(--cirth-size-
|
|
1504
|
-
background-image: var(--cirth-icon-close);
|
|
1505
|
-
background-position: center;
|
|
1506
|
-
background-size: auto var(--cirth-size-4);
|
|
1446
|
+
width: calc(var(--cirth-font-size-md) + calc((var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2 - var(--cirth-font-size-md)) / 2) * 2);
|
|
1447
|
+
height: calc(var(--cirth-font-size-md) + calc((var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2 - var(--cirth-font-size-md)) / 2) * 2);
|
|
1448
|
+
margin-top: calc(var(--cirth-spacing) * -1 - calc((var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2 - var(--cirth-font-size-md)) / 2));
|
|
1449
|
+
margin-right: calc(calc((var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2 - var(--cirth-font-size-md)) / 2) * -1);
|
|
1450
|
+
margin-bottom: calc(var(--cirth-spacing) - calc((var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2 - var(--cirth-font-size-md)) / 2));
|
|
1507
1451
|
opacity: .5;
|
|
1508
1452
|
transition: opacity var(--cirth-transition);
|
|
1509
1453
|
background-color: #0000;
|
|
1510
|
-
background-repeat: no-repeat;
|
|
1511
1454
|
border: none;
|
|
1512
1455
|
margin-inline-start: auto;
|
|
1513
1456
|
display: block;
|
|
1514
1457
|
}
|
|
1515
1458
|
|
|
1459
|
+
.cirth dialog > article :is(a, button)[rel="prev"]:before {
|
|
1460
|
+
background-color: var(--cirth-muted-color);
|
|
1461
|
+
content: "";
|
|
1462
|
+
width: 100%;
|
|
1463
|
+
height: 100%;
|
|
1464
|
+
mask-image: var(--cirth-icon-close);
|
|
1465
|
+
mask-position: center;
|
|
1466
|
+
mask-size: auto var(--cirth-font-size-md);
|
|
1467
|
+
display: block;
|
|
1468
|
+
mask-repeat: no-repeat;
|
|
1469
|
+
}
|
|
1470
|
+
|
|
1471
|
+
@media (forced-colors: active) {
|
|
1472
|
+
.cirth dialog > article :is(a, button)[rel="prev"]:before {
|
|
1473
|
+
background-color: canvastext;
|
|
1474
|
+
}
|
|
1475
|
+
}
|
|
1476
|
+
|
|
1516
1477
|
.cirth dialog > article :is(a, button)[rel="prev"]:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
|
|
1517
1478
|
opacity: 1;
|
|
1518
1479
|
}
|
|
@@ -1578,7 +1539,7 @@
|
|
|
1578
1539
|
|
|
1579
1540
|
.cirth nav li button, .cirth nav li [role="button"], .cirth nav li [type="button"], .cirth nav li input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]), .cirth nav li select {
|
|
1580
1541
|
height: auto;
|
|
1581
|
-
min-block-size: var(--cirth-
|
|
1542
|
+
min-block-size: var(--cirth-space-6);
|
|
1582
1543
|
margin-inline: inherit;
|
|
1583
1544
|
padding: calc(var(--cirth-nav-link-spacing-vertical) - var(--cirth-border-width) * 2) var(--cirth-nav-link-spacing-horizontal);
|
|
1584
1545
|
margin-bottom: 0;
|
|
@@ -1666,7 +1627,7 @@
|
|
|
1666
1627
|
vertical-align: baseline;
|
|
1667
1628
|
appearance: none;
|
|
1668
1629
|
width: 100%;
|
|
1669
|
-
height: var(--cirth-
|
|
1630
|
+
height: var(--cirth-space-2);
|
|
1670
1631
|
margin-bottom: calc(var(--cirth-spacing) * .5);
|
|
1671
1632
|
border: var(--cirth-border-width-1) solid var(--cirth-progress-border-color);
|
|
1672
1633
|
border-radius: var(--cirth-border-radius);
|
|
@@ -1752,27 +1713,23 @@
|
|
|
1752
1713
|
}
|
|
1753
1714
|
|
|
1754
1715
|
.cirth {
|
|
1755
|
-
--cirth-color-black: #000;
|
|
1756
|
-
--cirth-color-white: #fff;
|
|
1757
|
-
--cirth-color-transparent: transparent;
|
|
1758
|
-
--cirth-color-current: currentColor;
|
|
1759
1716
|
--cirth-font-family-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
1760
1717
|
--cirth-font-family-sans: system-ui, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, Helvetica, Arial,
|
|
1761
1718
|
"Helvetica Neue", sans-serif, var(--cirth-font-family-emoji);
|
|
1762
1719
|
--cirth-font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif;
|
|
1763
1720
|
--cirth-font-family-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
|
|
1764
1721
|
monospace, var(--cirth-font-family-emoji);
|
|
1765
|
-
--cirth-font-family-display: var(--cirth-font-family-serif);
|
|
1766
1722
|
--cirth-font-size-xs: .75rem;
|
|
1767
1723
|
--cirth-font-size-sm: .875rem;
|
|
1768
1724
|
--cirth-font-size-md: 1rem;
|
|
1769
1725
|
--cirth-font-size-lg: 1.125rem;
|
|
1770
1726
|
--cirth-font-size-xl: 1.25rem;
|
|
1771
|
-
--cirth-font-size-2xl: 1.
|
|
1772
|
-
--cirth-font-size-3xl: 1.
|
|
1773
|
-
--cirth-font-size-4xl:
|
|
1774
|
-
--cirth-font-size-5xl:
|
|
1775
|
-
--cirth-font-size-6xl: 2.
|
|
1727
|
+
--cirth-font-size-2xl: 1.5rem;
|
|
1728
|
+
--cirth-font-size-3xl: 1.75rem;
|
|
1729
|
+
--cirth-font-size-4xl: 2rem;
|
|
1730
|
+
--cirth-font-size-5xl: 2.25rem;
|
|
1731
|
+
--cirth-font-size-6xl: 2.75rem;
|
|
1732
|
+
--cirth-font-size-7xl: 3.5rem;
|
|
1776
1733
|
--cirth-font-weight-light: 300;
|
|
1777
1734
|
--cirth-font-weight-regular: 400;
|
|
1778
1735
|
--cirth-font-weight-medium: 500;
|
|
@@ -1799,19 +1756,6 @@
|
|
|
1799
1756
|
--cirth-space-16: 4rem;
|
|
1800
1757
|
--cirth-space-20: 5rem;
|
|
1801
1758
|
--cirth-space-24: 6rem;
|
|
1802
|
-
--cirth-size-0: 0;
|
|
1803
|
-
--cirth-size-1: .25rem;
|
|
1804
|
-
--cirth-size-2: .5rem;
|
|
1805
|
-
--cirth-size-3: .75rem;
|
|
1806
|
-
--cirth-size-4: 1rem;
|
|
1807
|
-
--cirth-size-5: 1.25rem;
|
|
1808
|
-
--cirth-size-6: 1.5rem;
|
|
1809
|
-
--cirth-size-8: 2rem;
|
|
1810
|
-
--cirth-size-10: 2.5rem;
|
|
1811
|
-
--cirth-size-12: 3rem;
|
|
1812
|
-
--cirth-size-16: 4rem;
|
|
1813
|
-
--cirth-size-20: 5rem;
|
|
1814
|
-
--cirth-size-24: 6rem;
|
|
1815
1759
|
--cirth-radius-none: 0;
|
|
1816
1760
|
--cirth-radius-xs: .125rem;
|
|
1817
1761
|
--cirth-radius-sm: .25rem;
|
|
@@ -1824,9 +1768,6 @@
|
|
|
1824
1768
|
--cirth-border-width-1: .0625rem;
|
|
1825
1769
|
--cirth-border-width-2: .125rem;
|
|
1826
1770
|
--cirth-border-width-4: .25rem;
|
|
1827
|
-
--cirth-outline-width-1: .0625rem;
|
|
1828
|
-
--cirth-outline-width-2: .125rem;
|
|
1829
|
-
--cirth-outline-width-4: .25rem;
|
|
1830
1771
|
--cirth-duration-instant: 0s;
|
|
1831
1772
|
--cirth-duration-fast: .1s;
|
|
1832
1773
|
--cirth-duration-normal: .2s;
|
|
@@ -1837,7 +1778,6 @@
|
|
|
1837
1778
|
--cirth-ease-out: cubic-bezier(0, 0, .2, 1);
|
|
1838
1779
|
--cirth-ease-in-out: cubic-bezier(.4, 0, .2, 1);
|
|
1839
1780
|
--cirth-opacity-disabled: .5;
|
|
1840
|
-
--cirth-opacity-muted: .72;
|
|
1841
1781
|
--cirth-opacity-overlay: .75;
|
|
1842
1782
|
--cirth-z-index-dropdown: 1000;
|
|
1843
1783
|
--cirth-z-index-sticky: 1020;
|
|
@@ -1845,6 +1785,7 @@
|
|
|
1845
1785
|
--cirth-z-index-modal-backdrop: 1040;
|
|
1846
1786
|
--cirth-z-index-modal: 1050;
|
|
1847
1787
|
--cirth-font-family: var(--cirth-font-family-sans);
|
|
1788
|
+
--cirth-font-family-display: var(--cirth-font-family-serif);
|
|
1848
1789
|
--cirth-line-height: var(--cirth-line-height-normal);
|
|
1849
1790
|
--cirth-font-weight: var(--cirth-font-weight-regular);
|
|
1850
1791
|
--cirth-font-size: 100%;
|
|
@@ -1856,7 +1797,8 @@
|
|
|
1856
1797
|
--cirth-code-border-radius: min(var(--cirth-border-radius),
|
|
1857
1798
|
var(--cirth-radius-sm));
|
|
1858
1799
|
--cirth-border-width: var(--cirth-border-width-1);
|
|
1859
|
-
--cirth-outline-width: var(--cirth-
|
|
1800
|
+
--cirth-outline-width: var(--cirth-border-width-2);
|
|
1801
|
+
--cirth-background-color: var(--cirth-canvas);
|
|
1860
1802
|
--cirth-transition: var(--cirth-duration-normal) var(--cirth-ease-out);
|
|
1861
1803
|
--cirth-spacing: var(--cirth-space-4);
|
|
1862
1804
|
--cirth-typography-spacing-vertical: var(--cirth-space-4);
|
|
@@ -1884,13 +1826,9 @@
|
|
|
1884
1826
|
--cirth-nav-link-spacing-vertical: var(--cirth-space-2);
|
|
1885
1827
|
--cirth-nav-link-spacing-horizontal: var(--cirth-space-2);
|
|
1886
1828
|
--cirth-nav-breadcrumb-divider: ">";
|
|
1887
|
-
--cirth-icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='
|
|
1888
|
-
--cirth-icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='
|
|
1889
|
-
--cirth-icon-
|
|
1890
|
-
--cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
|
1891
|
-
--cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
|
|
1892
|
-
--cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
|
|
1893
|
-
--cirth-icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
|
|
1829
|
+
--cirth-icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
|
|
1830
|
+
--cirth-icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
|
|
1831
|
+
--cirth-icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
|
|
1894
1832
|
--cirth-icon-loading: url("data:image/svg+xml,%3Csvg fill='none' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E g %7B animation: rotate 2s linear infinite; transform-origin: center center; %7D circle %7B stroke-dasharray: 75,100; stroke-dashoffset: -5; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; %7D @keyframes rotate %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D @keyframes dash %7B 0%25 %7B stroke-dasharray: 1,100; stroke-dashoffset: 0; %7D 50%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -17.5; %7D 100%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -62; %7D %7D %3C/style%3E%3Cg%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='rgb(136, 146, 164)' stroke-width='4' /%3E%3C/g%3E%3C/svg%3E");
|
|
1895
1833
|
}
|
|
1896
1834
|
|
|
@@ -1912,21 +1850,27 @@
|
|
|
1912
1850
|
}
|
|
1913
1851
|
|
|
1914
1852
|
.cirth h1 {
|
|
1915
|
-
--cirth-font-size: clamp(
|
|
1853
|
+
--cirth-font-size: clamp(var(--cirth-font-size-5xl),
|
|
1854
|
+
1.7rem + 2.2vw,
|
|
1855
|
+
var(--cirth-font-size-7xl));
|
|
1916
1856
|
--cirth-line-height: var(--cirth-line-height-tight);
|
|
1917
1857
|
--cirth-letter-spacing: var(--cirth-letter-spacing-tight);
|
|
1918
1858
|
--cirth-typography-spacing-top: var(--cirth-space-12);
|
|
1919
1859
|
}
|
|
1920
1860
|
|
|
1921
1861
|
.cirth h2 {
|
|
1922
|
-
--cirth-font-size: clamp(
|
|
1862
|
+
--cirth-font-size: clamp(var(--cirth-font-size-2xl),
|
|
1863
|
+
1.3rem + 1vw,
|
|
1864
|
+
var(--cirth-font-size-4xl));
|
|
1923
1865
|
--cirth-line-height: 1.15;
|
|
1924
1866
|
--cirth-letter-spacing: var(--cirth-letter-spacing-tight);
|
|
1925
1867
|
--cirth-typography-spacing-top: var(--cirth-space-12);
|
|
1926
1868
|
}
|
|
1927
1869
|
|
|
1928
1870
|
.cirth h3 {
|
|
1929
|
-
--cirth-font-size: clamp(
|
|
1871
|
+
--cirth-font-size: clamp(var(--cirth-font-size-xl),
|
|
1872
|
+
1.15rem + .5vw,
|
|
1873
|
+
var(--cirth-font-size-2xl));
|
|
1930
1874
|
--cirth-line-height: 1.2;
|
|
1931
1875
|
--cirth-letter-spacing: var(--cirth-letter-spacing-snug);
|
|
1932
1876
|
--cirth-typography-spacing-top: var(--cirth-space-10);
|
|
@@ -1974,7 +1918,7 @@
|
|
|
1974
1918
|
}
|
|
1975
1919
|
|
|
1976
1920
|
.cirth input:not([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"]), .cirth :where(select, textarea) {
|
|
1977
|
-
--cirth-outline-width: var(--cirth-
|
|
1921
|
+
--cirth-outline-width: var(--cirth-border-width-1);
|
|
1978
1922
|
--cirth-line-height: var(--cirth-line-height-relaxed);
|
|
1979
1923
|
}
|
|
1980
1924
|
|
|
@@ -2020,107 +1964,131 @@
|
|
|
2020
1964
|
filter: brightness(0) invert();
|
|
2021
1965
|
}
|
|
2022
1966
|
|
|
1967
|
+
.cirth {
|
|
1968
|
+
--cirth-canvas: light-dark(oklch(97.4% .004 69.35), oklch(20.15% .003 264));
|
|
1969
|
+
--cirth-color: light-dark(oklch(35.3% .021 264), oklch(83% .016 264));
|
|
1970
|
+
--cirth-text-selection-color: light-dark(oklch(65.7% .121 69.35 / .25), oklch(70% .129 69.35 / .1875));
|
|
1971
|
+
--cirth-muted-color: light-dark(oklch(52.7% .032 264), oklch(61.3% .032 264));
|
|
1972
|
+
--cirth-muted-border-color: light-dark(oklch(93.85% .003 264), oklch(26.7% .011 264));
|
|
1973
|
+
--cirth-error: light-dark(oklch(44% .151 29.73), oklch(74.3% .133 29.73));
|
|
1974
|
+
--cirth-success: light-dark(oklch(52.7% .1 160.59), oklch(65.7% .125 160.59));
|
|
1975
|
+
--cirth-warning: light-dark(oklch(48.3% .086 78), oklch(70% .124 78));
|
|
1976
|
+
--cirth-primary: light-dark(oklch(52.7% .097 69.35), oklch(70% .129 69.35));
|
|
1977
|
+
--cirth-secondary: light-dark(oklch(52.7% .032 264), oklch(70% .028 264));
|
|
1978
|
+
--cirth-secondary-underline: light-dark(oklch(52.7% .032 264 / .5), oklch(70% .028 264 / .5));
|
|
1979
|
+
--cirth-secondary-hover: light-dark(oklch(44% .028 264), oklch(78.7% .021 264));
|
|
1980
|
+
--cirth-secondary-hover-background: light-dark(oklch(44% .028 264), oklch(52.7% .032 264));
|
|
1981
|
+
--cirth-secondary-focus: light-dark(oklch(48.3% .03 264 / .7), oklch(70% .028 264 / .7));
|
|
1982
|
+
--cirth-contrast: light-dark(oklch(22.3% .006 264), oklch(91.7% .006 264));
|
|
1983
|
+
--cirth-contrast-background: light-dark(oklch(22.3% .006 264), oklch(96% 0 264));
|
|
1984
|
+
--cirth-contrast-underline: light-dark(oklch(22.3% .006 264 / .5), oklch(91.7% .006 264 / .5));
|
|
1985
|
+
--cirth-contrast-hover: light-dark(oklch(0% 0 0), oklch(100% 0 0));
|
|
1986
|
+
--cirth-contrast-hover-background: light-dark(oklch(0% 0 0), oklch(100% 0 0));
|
|
1987
|
+
--cirth-contrast-focus: light-dark(oklch(48.3% .03 264 / .7), oklch(87.3% .011 264 / .5));
|
|
1988
|
+
--cirth-contrast-inverse: light-dark(oklch(100% 0 0), oklch(0% 0 0));
|
|
1989
|
+
--cirth-link-visited-color: light-dark(oklch(48.3% .03 264), oklch(65.7% .03 264));
|
|
1990
|
+
--cirth-box-shadow: light-dark(.0145rem .029rem .174rem oklch(65.7% .03 264 / .01698), .0335rem .067rem .402rem oklch(65.7% .03 264 / .024), .0625rem .125rem .75rem oklch(65.7% .03 264 / .03), .1125rem .225rem 1.35rem oklch(65.7% .03 264 / .036), .2085rem .417rem 2.502rem oklch(65.7% .03 264 / .04302), .5rem 1rem 6rem oklch(65.7% .03 264 / .06), 0 0 0 .0625rem oklch(65.7% .03 264 / .015),
|
|
1991
|
+
.0145rem .029rem .174rem oklch(9% 0 312 / .01698), .0335rem .067rem .402rem oklch(9% 0 312 / .024), .0625rem .125rem .75rem oklch(9% 0 312 / .03), .1125rem .225rem 1.35rem oklch(9% 0 312 / .036), .2085rem .417rem 2.502rem oklch(9% 0 312 / .04302), .5rem 1rem 6rem oklch(9% 0 312 / .06), 0 0 0 .0625rem oklch(9% 0 312 / .015));
|
|
1992
|
+
--cirth-h1-color: light-dark(oklch(22.3% .006 264), oklch(96% 0 264));
|
|
1993
|
+
--cirth-h2-color: light-dark(oklch(26.7% .011 264), oklch(91.7% .006 264));
|
|
1994
|
+
--cirth-h3-color: light-dark(oklch(31% .016 264), oklch(83% .016 264));
|
|
1995
|
+
--cirth-h4-color: light-dark(oklch(35.3% .021 264), oklch(78.7% .021 264));
|
|
1996
|
+
--cirth-h5-color: light-dark(oklch(39.7% .025 264), oklch(74.3% .025 264));
|
|
1997
|
+
--cirth-h6-color: light-dark(oklch(44% .028 264), oklch(65.7% .03 264));
|
|
1998
|
+
--cirth-mark-color: light-dark(oklch(18% 0 264), oklch(100% 0 0));
|
|
1999
|
+
--cirth-code-background-color: light-dark(oklch(97% 0 288), oklch(23.4% .00725 264));
|
|
2000
|
+
--cirth-code-color: light-dark(oklch(52.7% .032 264), oklch(65.7% .03 264));
|
|
2001
|
+
--cirth-form-element-background-color: light-dark(oklch(99% 0 336), oklch(24.5% .0085 264));
|
|
2002
|
+
--cirth-form-element-selected-background-color: light-dark(oklch(91.7% .006 264), oklch(31% .016 264));
|
|
2003
|
+
--cirth-form-element-border-color: light-dark(oklch(61.3% .032 264), oklch(52.7% .032 264));
|
|
2004
|
+
--cirth-form-element-color: light-dark(oklch(26.7% .011 264), oklch(91.7% .006 264));
|
|
2005
|
+
--cirth-form-element-active-background-color: light-dark(oklch(100% 0 0), oklch(23.4% .00725 264));
|
|
2006
|
+
--cirth-switch-background-color: light-dark(oklch(61.3% .032 264), oklch(52.7% .032 264));
|
|
2007
|
+
--cirth-range-border-color: light-dark(oklch(91.7% .006 264), oklch(26.7% .011 264));
|
|
2008
|
+
--cirth-range-active-border-color: light-dark(oklch(83% .016 264), oklch(31% .016 264));
|
|
2009
|
+
--cirth-card-background-color: light-dark(oklch(100% 0 0), oklch(22.3% .006 264));
|
|
2010
|
+
--cirth-card-sectioning-background-color: light-dark(oklch(99% 0 336), oklch(23.4% .00725 264));
|
|
2011
|
+
--cirth-dropdown-background-color: light-dark(oklch(100% 0 0), oklch(22.3% .006 264));
|
|
2012
|
+
--cirth-dropdown-border-color: light-dark(oklch(96% 0 264), oklch(26.7% .011 264));
|
|
2013
|
+
--cirth-dropdown-hover-background-color: light-dark(oklch(96% 0 264), oklch(26.7% .011 264));
|
|
2014
|
+
--cirth-progress-background-color: light-dark(oklch(91.7% .006 264), oklch(26.7% .011 264));
|
|
2015
|
+
--cirth-progress-border-color: light-dark(oklch(61.3% .032 264), oklch(52.7% .032 264));
|
|
2016
|
+
}
|
|
2017
|
+
|
|
2023
2018
|
.cirth:where([data-theme="light"]), .cirth :where([data-theme="light"]), .cirth:where(:not([data-theme="dark"])) {
|
|
2024
|
-
--lightningcss-light: initial;
|
|
2025
|
-
--lightningcss-dark: ;
|
|
2026
2019
|
color-scheme: light;
|
|
2027
|
-
--cirth-
|
|
2028
|
-
--cirth-
|
|
2029
|
-
--cirth-
|
|
2030
|
-
--cirth-
|
|
2031
|
-
--cirth-
|
|
2032
|
-
--cirth-
|
|
2033
|
-
--cirth-
|
|
2020
|
+
--cirth-error-text: color-mix(in oklch, var(--cirth-error) 80.2%, black);
|
|
2021
|
+
--cirth-error-border: oklch(from var(--cirth-error) calc(l * 1.493) calc(c * 1.298) h);
|
|
2022
|
+
--cirth-error-active: oklch(from var(--cirth-error) calc(l * 1.198) calc(c * 1.199) h);
|
|
2023
|
+
--cirth-error-surface: oklch(from var(--cirth-error) 93% .05 h);
|
|
2024
|
+
--cirth-success-text: color-mix(in oklch, var(--cirth-success) 67%, black);
|
|
2025
|
+
--cirth-success-border: oklch(from var(--cirth-success) calc(l * 1.163) calc(c * 1.17) h);
|
|
2026
|
+
--cirth-success-active: var(--cirth-success);
|
|
2027
|
+
--cirth-success-surface: oklch(from var(--cirth-success) 93% .05 h);
|
|
2028
|
+
--cirth-warning-text: color-mix(in oklch, var(--cirth-warning) 73.1%, black);
|
|
2029
|
+
--cirth-warning-border: oklch(from var(--cirth-warning) calc(l * 1.269) calc(c * 1.267) h);
|
|
2030
|
+
--cirth-warning-active: oklch(from var(--cirth-warning) calc(l * 1.091) calc(c * 1.081) h);
|
|
2031
|
+
--cirth-warning-surface: oklch(from var(--cirth-warning) 93% .05 h);
|
|
2032
|
+
--cirth-primary-background: var(--cirth-primary);
|
|
2034
2033
|
--cirth-primary-border: var(--cirth-primary-background);
|
|
2035
|
-
--cirth-primary-underline: oklch(
|
|
2036
|
-
--cirth-primary-hover: oklch(
|
|
2037
|
-
--cirth-primary-hover-background:
|
|
2034
|
+
--cirth-primary-underline: oklch(from var(--cirth-primary) l c h / 50%);
|
|
2035
|
+
--cirth-primary-hover: color-mix(in oklch, var(--cirth-primary) 83.5%, black);
|
|
2036
|
+
--cirth-primary-hover-background: color-mix(in oklch,
|
|
2037
|
+
var(--cirth-primary) 91.7%,
|
|
2038
|
+
black);
|
|
2038
2039
|
--cirth-primary-hover-border: var(--cirth-primary-hover-background);
|
|
2039
2040
|
--cirth-primary-hover-underline: var(--cirth-primary-hover);
|
|
2040
|
-
--cirth-primary-focus: oklch(
|
|
2041
|
+
--cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 75%);
|
|
2041
2042
|
--cirth-primary-inverse: oklch(100% 0 0);
|
|
2042
|
-
--cirth-secondary: oklch(52.7% .032 264);
|
|
2043
2043
|
--cirth-secondary-background: oklch(48.3% .03 264);
|
|
2044
2044
|
--cirth-secondary-border: var(--cirth-secondary-background);
|
|
2045
|
-
--cirth-secondary-underline: oklch(52.7% .032 264 / .5);
|
|
2046
|
-
--cirth-secondary-hover: oklch(44% .028 264);
|
|
2047
|
-
--cirth-secondary-hover-background: oklch(44% .028 264);
|
|
2048
2045
|
--cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
|
|
2049
2046
|
--cirth-secondary-hover-underline: var(--cirth-secondary-hover);
|
|
2050
|
-
--cirth-secondary-focus: oklch(48.3% .03 264 / .7);
|
|
2051
2047
|
--cirth-secondary-inverse: oklch(100% 0 0);
|
|
2052
|
-
--cirth-contrast: oklch(22.3% .006 264);
|
|
2053
|
-
--cirth-contrast-background: oklch(22.3% .006 264);
|
|
2054
2048
|
--cirth-contrast-border: var(--cirth-contrast-background);
|
|
2055
|
-
--cirth-contrast-underline: oklch(22.3% .006 264 / .5);
|
|
2056
|
-
--cirth-contrast-hover: oklch(0% 0 0);
|
|
2057
|
-
--cirth-contrast-hover-background: oklch(0% 0 0);
|
|
2058
2049
|
--cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
|
|
2059
2050
|
--cirth-contrast-hover-underline: var(--cirth-secondary-hover);
|
|
2060
|
-
--cirth-
|
|
2061
|
-
--cirth-
|
|
2062
|
-
--cirth-
|
|
2063
|
-
--cirth-box-shadow: .0145rem .029rem .174rem oklch(65.7% .03 264 / .01698), .0335rem .067rem .402rem oklch(65.7% .03 264 / .024), .0625rem .125rem .75rem oklch(65.7% .03 264 / .03), .1125rem .225rem 1.35rem oklch(65.7% .03 264 / .036), .2085rem .417rem 2.502rem oklch(65.7% .03 264 / .04302), .5rem 1rem 6rem oklch(65.7% .03 264 / .06), 0 0 0 .0625rem oklch(65.7% .03 264 / .015);
|
|
2064
|
-
--cirth-h1-color: oklch(22.3% .006 264);
|
|
2065
|
-
--cirth-h2-color: oklch(26.7% .011 264);
|
|
2066
|
-
--cirth-h3-color: oklch(31% .016 264);
|
|
2067
|
-
--cirth-h4-color: oklch(35.3% .021 264);
|
|
2068
|
-
--cirth-h5-color: oklch(39.7% .025 264);
|
|
2069
|
-
--cirth-h6-color: oklch(44% .028 264);
|
|
2070
|
-
--cirth-mark-background-color: oklch(93% .05 78);
|
|
2071
|
-
--cirth-mark-color: oklch(18% 0 264);
|
|
2072
|
-
--cirth-ins-color: oklch(35.3% .067 160.59);
|
|
2073
|
-
--cirth-del-color: oklch(35.3% .122 29.73);
|
|
2051
|
+
--cirth-mark-background-color: var(--cirth-warning-surface);
|
|
2052
|
+
--cirth-ins-color: var(--cirth-success-text);
|
|
2053
|
+
--cirth-del-color: var(--cirth-error-text);
|
|
2074
2054
|
--cirth-blockquote-border-color: var(--cirth-muted-border-color);
|
|
2075
2055
|
--cirth-blockquote-footer-color: var(--cirth-muted-color);
|
|
2076
2056
|
--cirth-button-box-shadow: 0 0 0 #0000;
|
|
2077
2057
|
--cirth-button-hover-box-shadow: 0 0 0 #0000;
|
|
2078
2058
|
--cirth-table-border-color: var(--cirth-muted-border-color);
|
|
2079
2059
|
--cirth-table-row-stripped-background-color: oklch(57% .032 264 / .0375);
|
|
2080
|
-
--cirth-code-background-color: oklch(97% 0 288);
|
|
2081
|
-
--cirth-code-color: oklch(52.7% .032 264);
|
|
2082
2060
|
--cirth-code-kbd-background-color: var(--cirth-color);
|
|
2083
2061
|
--cirth-code-kbd-color: var(--cirth-background-color);
|
|
2084
|
-
--cirth-form-element-background-color: oklch(99% 0 336);
|
|
2085
|
-
--cirth-form-element-selected-background-color: oklch(91.7% .006 264);
|
|
2086
|
-
--cirth-form-element-border-color: oklch(61.3% .032 264);
|
|
2087
|
-
--cirth-form-element-color: oklch(26.7% .011 264);
|
|
2088
2062
|
--cirth-form-element-placeholder-color: var(--cirth-muted-color);
|
|
2089
|
-
--cirth-form-element-active-background-color: oklch(100% 0 0);
|
|
2090
2063
|
--cirth-form-element-active-border-color: var(--cirth-primary-border);
|
|
2091
2064
|
--cirth-form-element-focus-color: var(--cirth-primary-border);
|
|
2092
2065
|
--cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
|
|
2093
|
-
--cirth-form-element-invalid-border-color:
|
|
2094
|
-
--cirth-form-element-invalid-active-border-color:
|
|
2066
|
+
--cirth-form-element-invalid-border-color: var(--cirth-error-border);
|
|
2067
|
+
--cirth-form-element-invalid-active-border-color: var(--cirth-error-active);
|
|
2095
2068
|
--cirth-form-element-invalid-focus-color: var(--cirth-form-element-invalid-active-border-color);
|
|
2096
|
-
--cirth-form-element-valid-border-color:
|
|
2097
|
-
--cirth-form-element-valid-active-border-color:
|
|
2069
|
+
--cirth-form-element-valid-border-color: var(--cirth-success-border);
|
|
2070
|
+
--cirth-form-element-valid-active-border-color: var(--cirth-success-active);
|
|
2098
2071
|
--cirth-form-element-valid-focus-color: var(--cirth-form-element-valid-active-border-color);
|
|
2099
|
-
--cirth-switch-
|
|
2072
|
+
--cirth-switch-thumb-box-shadow: 0 0 0 #0000;
|
|
2100
2073
|
--cirth-switch-checked-background-color: var(--cirth-primary-background);
|
|
2101
2074
|
--cirth-switch-color: var(--cirth-primary-inverse);
|
|
2102
|
-
--cirth-switch-thumb-box-shadow: 0 0 0 #0000;
|
|
2103
|
-
--cirth-range-border-color: oklch(91.7% .006 264);
|
|
2104
|
-
--cirth-range-active-border-color: oklch(83% .016 264);
|
|
2105
2075
|
--cirth-range-thumb-border-color: var(--cirth-background-color);
|
|
2106
2076
|
--cirth-range-thumb-color: var(--cirth-secondary-background);
|
|
2107
2077
|
--cirth-range-thumb-active-color: var(--cirth-primary-background);
|
|
2108
|
-
--cirth-accordion-border-color: var(--cirth-muted-border-color);
|
|
2109
2078
|
--cirth-accordion-active-summary-color: var(--cirth-primary-hover);
|
|
2110
2079
|
--cirth-accordion-close-summary-color: var(--cirth-color);
|
|
2111
2080
|
--cirth-accordion-open-summary-color: var(--cirth-muted-color);
|
|
2112
|
-
--cirth-card-background-color: oklch(100% 0 0);
|
|
2113
2081
|
--cirth-card-border-color: var(--cirth-muted-border-color);
|
|
2114
2082
|
--cirth-card-box-shadow: var(--cirth-box-shadow);
|
|
2115
|
-
--cirth-card-sectioning-background-color: oklch(99% 0 336);
|
|
2116
|
-
--cirth-loading-spinner-opacity: var(--cirth-opacity-disabled);
|
|
2117
2083
|
--cirth-modal-overlay-background-color: oklch(93.85% .003 264deg / var(--cirth-opacity-overlay));
|
|
2118
|
-
--cirth-meter-optimum-color:
|
|
2119
|
-
--cirth-meter-suboptimum-color:
|
|
2120
|
-
--cirth-meter-even-less-good-color:
|
|
2121
|
-
--cirth-progress-background-color: oklch(91.7% .006 264);
|
|
2122
|
-
--cirth-progress-border-color: oklch(61.3% .032 264);
|
|
2084
|
+
--cirth-meter-optimum-color: var(--cirth-success);
|
|
2085
|
+
--cirth-meter-suboptimum-color: var(--cirth-warning);
|
|
2086
|
+
--cirth-meter-even-less-good-color: var(--cirth-error);
|
|
2123
2087
|
--cirth-progress-color: var(--cirth-primary-background);
|
|
2088
|
+
--cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2089
|
+
--cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
|
2090
|
+
--cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2091
|
+
--cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
|
|
2124
2092
|
--cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(40, 124, 87)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2125
2093
|
--cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(189, 47, 33)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
|
|
2126
2094
|
}
|
|
@@ -2131,106 +2099,81 @@
|
|
|
2131
2099
|
|
|
2132
2100
|
@media only screen and (prefers-color-scheme: dark) {
|
|
2133
2101
|
.cirth:where(:not([data-theme])) {
|
|
2134
|
-
--lightningcss-light: ;
|
|
2135
|
-
--lightningcss-dark: initial;
|
|
2136
2102
|
color-scheme: dark;
|
|
2137
|
-
--cirth-
|
|
2138
|
-
--cirth-
|
|
2139
|
-
--cirth-
|
|
2140
|
-
--cirth-
|
|
2141
|
-
--cirth-
|
|
2142
|
-
--cirth-
|
|
2143
|
-
--cirth-
|
|
2103
|
+
--cirth-error-text: oklch(from var(--cirth-error) calc(l * 1.059) calc(c * .797) h);
|
|
2104
|
+
--cirth-error-border: oklch(from var(--cirth-error) calc(l * .942) calc(c * 1.226) h);
|
|
2105
|
+
--cirth-error-active: oklch(from var(--cirth-error) calc(l * 1.059) calc(c * .797) h);
|
|
2106
|
+
--cirth-error-surface: oklch(from var(--cirth-error) 35.3% .063 h);
|
|
2107
|
+
--cirth-success-text: oklch(from var(--cirth-success) calc(l * 1.198) calc(c * 1.2) h);
|
|
2108
|
+
--cirth-success-border: oklch(from var(--cirth-success) calc(l * 1.065) calc(c * 1.064) h);
|
|
2109
|
+
--cirth-success-active: oklch(from var(--cirth-success) calc(l * 1.198) calc(c * 1.2) h);
|
|
2110
|
+
--cirth-success-surface: oklch(from var(--cirth-success) 35.3% .063 h);
|
|
2111
|
+
--cirth-warning-text: oklch(from var(--cirth-warning) calc(l * 1.124) calc(c * 1.121) h);
|
|
2112
|
+
--cirth-warning-border: var(--cirth-warning);
|
|
2113
|
+
--cirth-warning-active: oklch(from var(--cirth-warning) calc(l * 1.124) calc(c * 1.121) h);
|
|
2114
|
+
--cirth-warning-surface: oklch(from var(--cirth-warning) 35.3% .063 h);
|
|
2115
|
+
--cirth-primary-background: color-mix(in oklch,
|
|
2116
|
+
var(--cirth-primary) 75.2%,
|
|
2117
|
+
black);
|
|
2144
2118
|
--cirth-primary-border: var(--cirth-primary-background);
|
|
2145
|
-
--cirth-primary-underline: oklch(
|
|
2146
|
-
--cirth-primary-hover: oklch(
|
|
2147
|
-
--cirth-primary-hover-background:
|
|
2119
|
+
--cirth-primary-underline: oklch(from var(--cirth-primary) l c h / 50%);
|
|
2120
|
+
--cirth-primary-hover: oklch(from var(--cirth-primary) calc(l * 1.124) calc(c * 1.132) h);
|
|
2121
|
+
--cirth-primary-hover-background: color-mix(in oklch,
|
|
2122
|
+
var(--cirth-primary) 81.4%,
|
|
2123
|
+
black);
|
|
2148
2124
|
--cirth-primary-hover-border: var(--cirth-primary-hover-background);
|
|
2149
2125
|
--cirth-primary-hover-underline: var(--cirth-primary-hover);
|
|
2150
|
-
--cirth-primary-focus: oklch(
|
|
2126
|
+
--cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 70%);
|
|
2151
2127
|
--cirth-primary-inverse: oklch(100% 0 0);
|
|
2152
|
-
--cirth-secondary: oklch(70% .028 264);
|
|
2153
2128
|
--cirth-secondary-background: oklch(48.3% .03 264);
|
|
2154
2129
|
--cirth-secondary-border: var(--cirth-secondary-background);
|
|
2155
|
-
--cirth-secondary-underline: oklch(70% .028 264 / .5);
|
|
2156
|
-
--cirth-secondary-hover: oklch(78.7% .021 264);
|
|
2157
|
-
--cirth-secondary-hover-background: oklch(52.7% .032 264);
|
|
2158
2130
|
--cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
|
|
2159
2131
|
--cirth-secondary-hover-underline: var(--cirth-secondary-hover);
|
|
2160
|
-
--cirth-secondary-focus: oklch(70% .028 264 / .7);
|
|
2161
2132
|
--cirth-secondary-inverse: oklch(100% 0 0);
|
|
2162
|
-
--cirth-contrast: oklch(91.7% .006 264);
|
|
2163
|
-
--cirth-contrast-background: oklch(96% 0 264);
|
|
2164
2133
|
--cirth-contrast-border: var(--cirth-contrast-background);
|
|
2165
|
-
--cirth-contrast-underline: oklch(91.7% .006 264 / .5);
|
|
2166
|
-
--cirth-contrast-hover: oklch(100% 0 0);
|
|
2167
|
-
--cirth-contrast-hover-background: oklch(100% 0 0);
|
|
2168
2134
|
--cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
|
|
2169
2135
|
--cirth-contrast-hover-underline: var(--cirth-contrast-hover);
|
|
2170
|
-
--cirth-
|
|
2171
|
-
--cirth-
|
|
2172
|
-
--cirth-
|
|
2173
|
-
--cirth-box-shadow: .0145rem .029rem .174rem oklch(9% 0 312 / .01698), .0335rem .067rem .402rem oklch(9% 0 312 / .024), .0625rem .125rem .75rem oklch(9% 0 312 / .03), .1125rem .225rem 1.35rem oklch(9% 0 312 / .036), .2085rem .417rem 2.502rem oklch(9% 0 312 / .04302), .5rem 1rem 6rem oklch(9% 0 312 / .06), 0 0 0 .0625rem oklch(9% 0 312 / .015);
|
|
2174
|
-
--cirth-h1-color: oklch(96% 0 264);
|
|
2175
|
-
--cirth-h2-color: oklch(91.7% .006 264);
|
|
2176
|
-
--cirth-h3-color: oklch(83% .016 264);
|
|
2177
|
-
--cirth-h4-color: oklch(78.7% .021 264);
|
|
2178
|
-
--cirth-h5-color: oklch(74.3% .025 264);
|
|
2179
|
-
--cirth-h6-color: oklch(65.7% .03 264);
|
|
2180
|
-
--cirth-mark-background-color: oklch(35.3% .063 78);
|
|
2181
|
-
--cirth-mark-color: oklch(100% 0 0);
|
|
2182
|
-
--cirth-ins-color: oklch(78.7% .15 160.59);
|
|
2183
|
-
--cirth-del-color: oklch(78.7% .106 29.73);
|
|
2136
|
+
--cirth-mark-background-color: var(--cirth-warning-surface);
|
|
2137
|
+
--cirth-ins-color: var(--cirth-success-text);
|
|
2138
|
+
--cirth-del-color: var(--cirth-error-text);
|
|
2184
2139
|
--cirth-blockquote-border-color: var(--cirth-muted-border-color);
|
|
2185
2140
|
--cirth-blockquote-footer-color: var(--cirth-muted-color);
|
|
2186
2141
|
--cirth-button-box-shadow: 0 0 0 #0000;
|
|
2187
2142
|
--cirth-button-hover-box-shadow: 0 0 0 #0000;
|
|
2188
2143
|
--cirth-table-border-color: var(--cirth-muted-border-color);
|
|
2189
2144
|
--cirth-table-row-stripped-background-color: oklch(57% .032 264 / .0375);
|
|
2190
|
-
--cirth-code-background-color: oklch(23.4% .00725 264);
|
|
2191
|
-
--cirth-code-color: oklch(65.7% .03 264);
|
|
2192
2145
|
--cirth-code-kbd-background-color: var(--cirth-color);
|
|
2193
2146
|
--cirth-code-kbd-color: var(--cirth-background-color);
|
|
2194
|
-
--cirth-form-element-background-color: oklch(24.5% .0085 264);
|
|
2195
|
-
--cirth-form-element-selected-background-color: oklch(31% .016 264);
|
|
2196
|
-
--cirth-form-element-border-color: oklch(52.7% .032 264);
|
|
2197
|
-
--cirth-form-element-color: oklch(91.7% .006 264);
|
|
2198
2147
|
--cirth-form-element-placeholder-color: oklch(65.7% .03 264);
|
|
2199
|
-
--cirth-form-element-active-background-color: oklch(23.4% .00725 264);
|
|
2200
2148
|
--cirth-form-element-active-border-color: var(--cirth-primary-border);
|
|
2201
2149
|
--cirth-form-element-focus-color: var(--cirth-primary-border);
|
|
2202
2150
|
--cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
|
|
2203
|
-
--cirth-form-element-invalid-border-color:
|
|
2204
|
-
--cirth-form-element-invalid-active-border-color:
|
|
2151
|
+
--cirth-form-element-invalid-border-color: var(--cirth-error-border);
|
|
2152
|
+
--cirth-form-element-invalid-active-border-color: var(--cirth-error-active);
|
|
2205
2153
|
--cirth-form-element-invalid-focus-color: var(--cirth-form-element-invalid-active-border-color);
|
|
2206
|
-
--cirth-form-element-valid-border-color:
|
|
2207
|
-
--cirth-form-element-valid-active-border-color:
|
|
2154
|
+
--cirth-form-element-valid-border-color: var(--cirth-success-border);
|
|
2155
|
+
--cirth-form-element-valid-active-border-color: var(--cirth-success-active);
|
|
2208
2156
|
--cirth-form-element-valid-focus-color: var(--cirth-form-element-valid-active-border-color);
|
|
2209
|
-
--cirth-switch-
|
|
2157
|
+
--cirth-switch-thumb-box-shadow: 0 0 0 #0000;
|
|
2210
2158
|
--cirth-switch-checked-background-color: var(--cirth-primary-background);
|
|
2211
2159
|
--cirth-switch-color: var(--cirth-primary-inverse);
|
|
2212
|
-
--cirth-switch-thumb-box-shadow: 0 0 0 #0000;
|
|
2213
|
-
--cirth-range-border-color: oklch(26.7% .011 264);
|
|
2214
|
-
--cirth-range-active-border-color: oklch(31% .016 264);
|
|
2215
2160
|
--cirth-range-thumb-border-color: var(--cirth-background-color);
|
|
2216
2161
|
--cirth-range-thumb-color: var(--cirth-secondary-background);
|
|
2217
2162
|
--cirth-range-thumb-active-color: var(--cirth-primary-background);
|
|
2218
|
-
--cirth-accordion-border-color: var(--cirth-muted-border-color);
|
|
2219
2163
|
--cirth-accordion-active-summary-color: var(--cirth-primary-hover);
|
|
2220
2164
|
--cirth-accordion-close-summary-color: var(--cirth-color);
|
|
2221
2165
|
--cirth-accordion-open-summary-color: var(--cirth-muted-color);
|
|
2222
|
-
--cirth-card-background-color: oklch(22.3% .006 264);
|
|
2223
2166
|
--cirth-card-border-color: var(--cirth-card-background-color);
|
|
2224
2167
|
--cirth-card-box-shadow: var(--cirth-box-shadow);
|
|
2225
|
-
--cirth-card-sectioning-background-color: oklch(23.4% .00725 264);
|
|
2226
|
-
--cirth-loading-spinner-opacity: var(--cirth-opacity-disabled);
|
|
2227
2168
|
--cirth-modal-overlay-background-color: oklch(9% 0 312deg / var(--cirth-opacity-overlay));
|
|
2228
|
-
--cirth-meter-optimum-color:
|
|
2229
|
-
--cirth-meter-suboptimum-color:
|
|
2230
|
-
--cirth-meter-even-less-good-color:
|
|
2231
|
-
--cirth-progress-background-color: oklch(26.7% .011 264);
|
|
2232
|
-
--cirth-progress-border-color: oklch(52.7% .032 264);
|
|
2169
|
+
--cirth-meter-optimum-color: var(--cirth-success);
|
|
2170
|
+
--cirth-meter-suboptimum-color: var(--cirth-warning);
|
|
2171
|
+
--cirth-meter-even-less-good-color: var(--cirth-error);
|
|
2233
2172
|
--cirth-progress-color: oklch(61.3% .113 69.35);
|
|
2173
|
+
--cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2174
|
+
--cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
|
2175
|
+
--cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2176
|
+
--cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
|
|
2234
2177
|
--cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(75, 215, 153)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2235
2178
|
--cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(246, 160, 145)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
|
|
2236
2179
|
}
|
|
@@ -2241,106 +2184,81 @@
|
|
|
2241
2184
|
}
|
|
2242
2185
|
|
|
2243
2186
|
.cirth:where([data-theme="dark"]), .cirth :where([data-theme="dark"]) {
|
|
2244
|
-
--lightningcss-light: ;
|
|
2245
|
-
--lightningcss-dark: initial;
|
|
2246
2187
|
color-scheme: dark;
|
|
2247
|
-
--cirth-
|
|
2248
|
-
--cirth-
|
|
2249
|
-
--cirth-
|
|
2250
|
-
--cirth-
|
|
2251
|
-
--cirth-
|
|
2252
|
-
--cirth-
|
|
2253
|
-
--cirth-
|
|
2188
|
+
--cirth-error-text: oklch(from var(--cirth-error) calc(l * 1.059) calc(c * .797) h);
|
|
2189
|
+
--cirth-error-border: oklch(from var(--cirth-error) calc(l * .942) calc(c * 1.226) h);
|
|
2190
|
+
--cirth-error-active: oklch(from var(--cirth-error) calc(l * 1.059) calc(c * .797) h);
|
|
2191
|
+
--cirth-error-surface: oklch(from var(--cirth-error) 35.3% .063 h);
|
|
2192
|
+
--cirth-success-text: oklch(from var(--cirth-success) calc(l * 1.198) calc(c * 1.2) h);
|
|
2193
|
+
--cirth-success-border: oklch(from var(--cirth-success) calc(l * 1.065) calc(c * 1.064) h);
|
|
2194
|
+
--cirth-success-active: oklch(from var(--cirth-success) calc(l * 1.198) calc(c * 1.2) h);
|
|
2195
|
+
--cirth-success-surface: oklch(from var(--cirth-success) 35.3% .063 h);
|
|
2196
|
+
--cirth-warning-text: oklch(from var(--cirth-warning) calc(l * 1.124) calc(c * 1.121) h);
|
|
2197
|
+
--cirth-warning-border: var(--cirth-warning);
|
|
2198
|
+
--cirth-warning-active: oklch(from var(--cirth-warning) calc(l * 1.124) calc(c * 1.121) h);
|
|
2199
|
+
--cirth-warning-surface: oklch(from var(--cirth-warning) 35.3% .063 h);
|
|
2200
|
+
--cirth-primary-background: color-mix(in oklch,
|
|
2201
|
+
var(--cirth-primary) 75.2%,
|
|
2202
|
+
black);
|
|
2254
2203
|
--cirth-primary-border: var(--cirth-primary-background);
|
|
2255
|
-
--cirth-primary-underline: oklch(
|
|
2256
|
-
--cirth-primary-hover: oklch(
|
|
2257
|
-
--cirth-primary-hover-background:
|
|
2204
|
+
--cirth-primary-underline: oklch(from var(--cirth-primary) l c h / 50%);
|
|
2205
|
+
--cirth-primary-hover: oklch(from var(--cirth-primary) calc(l * 1.124) calc(c * 1.132) h);
|
|
2206
|
+
--cirth-primary-hover-background: color-mix(in oklch,
|
|
2207
|
+
var(--cirth-primary) 81.4%,
|
|
2208
|
+
black);
|
|
2258
2209
|
--cirth-primary-hover-border: var(--cirth-primary-hover-background);
|
|
2259
2210
|
--cirth-primary-hover-underline: var(--cirth-primary-hover);
|
|
2260
|
-
--cirth-primary-focus: oklch(
|
|
2211
|
+
--cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 70%);
|
|
2261
2212
|
--cirth-primary-inverse: oklch(100% 0 0);
|
|
2262
|
-
--cirth-secondary: oklch(70% .028 264);
|
|
2263
2213
|
--cirth-secondary-background: oklch(48.3% .03 264);
|
|
2264
2214
|
--cirth-secondary-border: var(--cirth-secondary-background);
|
|
2265
|
-
--cirth-secondary-underline: oklch(70% .028 264 / .5);
|
|
2266
|
-
--cirth-secondary-hover: oklch(78.7% .021 264);
|
|
2267
|
-
--cirth-secondary-hover-background: oklch(52.7% .032 264);
|
|
2268
2215
|
--cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
|
|
2269
2216
|
--cirth-secondary-hover-underline: var(--cirth-secondary-hover);
|
|
2270
|
-
--cirth-secondary-focus: oklch(70% .028 264 / .7);
|
|
2271
2217
|
--cirth-secondary-inverse: oklch(100% 0 0);
|
|
2272
|
-
--cirth-contrast: oklch(91.7% .006 264);
|
|
2273
|
-
--cirth-contrast-background: oklch(96% 0 264);
|
|
2274
2218
|
--cirth-contrast-border: var(--cirth-contrast-background);
|
|
2275
|
-
--cirth-contrast-underline: oklch(91.7% .006 264 / .5);
|
|
2276
|
-
--cirth-contrast-hover: oklch(100% 0 0);
|
|
2277
|
-
--cirth-contrast-hover-background: oklch(100% 0 0);
|
|
2278
2219
|
--cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
|
|
2279
2220
|
--cirth-contrast-hover-underline: var(--cirth-contrast-hover);
|
|
2280
|
-
--cirth-
|
|
2281
|
-
--cirth-
|
|
2282
|
-
--cirth-
|
|
2283
|
-
--cirth-box-shadow: .0145rem .029rem .174rem oklch(9% 0 312 / .01698), .0335rem .067rem .402rem oklch(9% 0 312 / .024), .0625rem .125rem .75rem oklch(9% 0 312 / .03), .1125rem .225rem 1.35rem oklch(9% 0 312 / .036), .2085rem .417rem 2.502rem oklch(9% 0 312 / .04302), .5rem 1rem 6rem oklch(9% 0 312 / .06), 0 0 0 .0625rem oklch(9% 0 312 / .015);
|
|
2284
|
-
--cirth-h1-color: oklch(96% 0 264);
|
|
2285
|
-
--cirth-h2-color: oklch(91.7% .006 264);
|
|
2286
|
-
--cirth-h3-color: oklch(83% .016 264);
|
|
2287
|
-
--cirth-h4-color: oklch(78.7% .021 264);
|
|
2288
|
-
--cirth-h5-color: oklch(74.3% .025 264);
|
|
2289
|
-
--cirth-h6-color: oklch(65.7% .03 264);
|
|
2290
|
-
--cirth-mark-background-color: oklch(35.3% .063 78);
|
|
2291
|
-
--cirth-mark-color: oklch(100% 0 0);
|
|
2292
|
-
--cirth-ins-color: oklch(78.7% .15 160.59);
|
|
2293
|
-
--cirth-del-color: oklch(78.7% .106 29.73);
|
|
2221
|
+
--cirth-mark-background-color: var(--cirth-warning-surface);
|
|
2222
|
+
--cirth-ins-color: var(--cirth-success-text);
|
|
2223
|
+
--cirth-del-color: var(--cirth-error-text);
|
|
2294
2224
|
--cirth-blockquote-border-color: var(--cirth-muted-border-color);
|
|
2295
2225
|
--cirth-blockquote-footer-color: var(--cirth-muted-color);
|
|
2296
2226
|
--cirth-button-box-shadow: 0 0 0 #0000;
|
|
2297
2227
|
--cirth-button-hover-box-shadow: 0 0 0 #0000;
|
|
2298
2228
|
--cirth-table-border-color: var(--cirth-muted-border-color);
|
|
2299
2229
|
--cirth-table-row-stripped-background-color: oklch(57% .032 264 / .0375);
|
|
2300
|
-
--cirth-code-background-color: oklch(23.4% .00725 264);
|
|
2301
|
-
--cirth-code-color: oklch(65.7% .03 264);
|
|
2302
2230
|
--cirth-code-kbd-background-color: var(--cirth-color);
|
|
2303
2231
|
--cirth-code-kbd-color: var(--cirth-background-color);
|
|
2304
|
-
--cirth-form-element-background-color: oklch(24.5% .0085 264);
|
|
2305
|
-
--cirth-form-element-selected-background-color: oklch(31% .016 264);
|
|
2306
|
-
--cirth-form-element-border-color: oklch(52.7% .032 264);
|
|
2307
|
-
--cirth-form-element-color: oklch(91.7% .006 264);
|
|
2308
2232
|
--cirth-form-element-placeholder-color: oklch(65.7% .03 264);
|
|
2309
|
-
--cirth-form-element-active-background-color: oklch(23.4% .00725 264);
|
|
2310
2233
|
--cirth-form-element-active-border-color: var(--cirth-primary-border);
|
|
2311
2234
|
--cirth-form-element-focus-color: var(--cirth-primary-border);
|
|
2312
2235
|
--cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
|
|
2313
|
-
--cirth-form-element-invalid-border-color:
|
|
2314
|
-
--cirth-form-element-invalid-active-border-color:
|
|
2236
|
+
--cirth-form-element-invalid-border-color: var(--cirth-error-border);
|
|
2237
|
+
--cirth-form-element-invalid-active-border-color: var(--cirth-error-active);
|
|
2315
2238
|
--cirth-form-element-invalid-focus-color: var(--cirth-form-element-invalid-active-border-color);
|
|
2316
|
-
--cirth-form-element-valid-border-color:
|
|
2317
|
-
--cirth-form-element-valid-active-border-color:
|
|
2239
|
+
--cirth-form-element-valid-border-color: var(--cirth-success-border);
|
|
2240
|
+
--cirth-form-element-valid-active-border-color: var(--cirth-success-active);
|
|
2318
2241
|
--cirth-form-element-valid-focus-color: var(--cirth-form-element-valid-active-border-color);
|
|
2319
|
-
--cirth-switch-
|
|
2242
|
+
--cirth-switch-thumb-box-shadow: 0 0 0 #0000;
|
|
2320
2243
|
--cirth-switch-checked-background-color: var(--cirth-primary-background);
|
|
2321
2244
|
--cirth-switch-color: var(--cirth-primary-inverse);
|
|
2322
|
-
--cirth-switch-thumb-box-shadow: 0 0 0 #0000;
|
|
2323
|
-
--cirth-range-border-color: oklch(26.7% .011 264);
|
|
2324
|
-
--cirth-range-active-border-color: oklch(31% .016 264);
|
|
2325
2245
|
--cirth-range-thumb-border-color: var(--cirth-background-color);
|
|
2326
2246
|
--cirth-range-thumb-color: var(--cirth-secondary-background);
|
|
2327
2247
|
--cirth-range-thumb-active-color: var(--cirth-primary-background);
|
|
2328
|
-
--cirth-accordion-border-color: var(--cirth-muted-border-color);
|
|
2329
2248
|
--cirth-accordion-active-summary-color: var(--cirth-primary-hover);
|
|
2330
2249
|
--cirth-accordion-close-summary-color: var(--cirth-color);
|
|
2331
2250
|
--cirth-accordion-open-summary-color: var(--cirth-muted-color);
|
|
2332
|
-
--cirth-card-background-color: oklch(22.3% .006 264);
|
|
2333
2251
|
--cirth-card-border-color: var(--cirth-card-background-color);
|
|
2334
2252
|
--cirth-card-box-shadow: var(--cirth-box-shadow);
|
|
2335
|
-
--cirth-card-sectioning-background-color: oklch(23.4% .00725 264);
|
|
2336
|
-
--cirth-loading-spinner-opacity: var(--cirth-opacity-disabled);
|
|
2337
2253
|
--cirth-modal-overlay-background-color: oklch(9% 0 312deg / var(--cirth-opacity-overlay));
|
|
2338
|
-
--cirth-meter-optimum-color:
|
|
2339
|
-
--cirth-meter-suboptimum-color:
|
|
2340
|
-
--cirth-meter-even-less-good-color:
|
|
2341
|
-
--cirth-progress-background-color: oklch(26.7% .011 264);
|
|
2342
|
-
--cirth-progress-border-color: oklch(52.7% .032 264);
|
|
2254
|
+
--cirth-meter-optimum-color: var(--cirth-success);
|
|
2255
|
+
--cirth-meter-suboptimum-color: var(--cirth-warning);
|
|
2256
|
+
--cirth-meter-even-less-good-color: var(--cirth-error);
|
|
2343
2257
|
--cirth-progress-color: oklch(61.3% .113 69.35);
|
|
2258
|
+
--cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2259
|
+
--cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
|
2260
|
+
--cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2261
|
+
--cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(122, 132, 152)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
|
|
2344
2262
|
--cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(75, 215, 153)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2345
2263
|
--cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(246, 160, 145)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
|
|
2346
2264
|
}
|
|
@@ -2367,6 +2285,10 @@
|
|
|
2367
2285
|
--cirth-code-color: oklch(35.3% .021 264);
|
|
2368
2286
|
--cirth-link-visited-color: oklch(35.3% .021 264);
|
|
2369
2287
|
--cirth-muted-border-color: oklch(57% .032 264);
|
|
2288
|
+
--cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2289
|
+
--cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
|
2290
|
+
--cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2291
|
+
--cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
|
|
2370
2292
|
--cirth-form-element-border-color: oklch(39.7% .025 264);
|
|
2371
2293
|
--cirth-form-element-invalid-border-color: oklch(48.3% .166 29.73);
|
|
2372
2294
|
--cirth-form-element-valid-border-color: oklch(48.3% .092 160.59);
|
|
@@ -2396,6 +2318,10 @@
|
|
|
2396
2318
|
--cirth-h5-color: var(--cirth-color);
|
|
2397
2319
|
--cirth-h6-color: var(--cirth-color);
|
|
2398
2320
|
--cirth-muted-color: oklch(78.7% .021 264);
|
|
2321
|
+
--cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2322
|
+
--cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
|
2323
|
+
--cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2324
|
+
--cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
|
|
2399
2325
|
--cirth-secondary: oklch(78.7% .021 264);
|
|
2400
2326
|
--cirth-code-color: oklch(83% .016 264);
|
|
2401
2327
|
--cirth-link-visited-color: oklch(78.7% .021 264);
|
|
@@ -2406,6 +2332,8 @@
|
|
|
2406
2332
|
--cirth-form-element-valid-border-color: oklch(78.7% .15 160.59);
|
|
2407
2333
|
--cirth-primary: oklch(78.7% .146 69.35);
|
|
2408
2334
|
--cirth-primary-hover: oklch(87.3% .082 69.35);
|
|
2335
|
+
--cirth-primary-background: oklch(44% .081 69.35);
|
|
2336
|
+
--cirth-primary-hover-background: oklch(39.7% .073 69.35);
|
|
2409
2337
|
--cirth-primary-underline: var(--cirth-primary);
|
|
2410
2338
|
--cirth-secondary-underline: var(--cirth-secondary);
|
|
2411
2339
|
--cirth-contrast-underline: var(--cirth-contrast);
|
|
@@ -2430,6 +2358,10 @@
|
|
|
2430
2358
|
--cirth-h5-color: var(--cirth-color);
|
|
2431
2359
|
--cirth-h6-color: var(--cirth-color);
|
|
2432
2360
|
--cirth-muted-color: oklch(78.7% .021 264);
|
|
2361
|
+
--cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2362
|
+
--cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
|
2363
|
+
--cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
|
|
2364
|
+
--cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
|
|
2433
2365
|
--cirth-secondary: oklch(78.7% .021 264);
|
|
2434
2366
|
--cirth-code-color: oklch(83% .016 264);
|
|
2435
2367
|
--cirth-link-visited-color: oklch(78.7% .021 264);
|
|
@@ -2440,6 +2372,8 @@
|
|
|
2440
2372
|
--cirth-form-element-valid-border-color: oklch(78.7% .15 160.59);
|
|
2441
2373
|
--cirth-primary: oklch(78.7% .146 69.35);
|
|
2442
2374
|
--cirth-primary-hover: oklch(87.3% .082 69.35);
|
|
2375
|
+
--cirth-primary-background: oklch(44% .081 69.35);
|
|
2376
|
+
--cirth-primary-hover-background: oklch(39.7% .073 69.35);
|
|
2443
2377
|
--cirth-primary-underline: var(--cirth-primary);
|
|
2444
2378
|
--cirth-secondary-underline: var(--cirth-secondary);
|
|
2445
2379
|
--cirth-contrast-underline: var(--cirth-contrast);
|
|
@@ -2453,127 +2387,3 @@
|
|
|
2453
2387
|
--cirth-meter-even-less-good-color: oklch(83% .081 29.73);
|
|
2454
2388
|
}
|
|
2455
2389
|
}
|
|
2456
|
-
|
|
2457
|
-
@media print {
|
|
2458
|
-
.cirth {
|
|
2459
|
-
--cirth-print-color: oklch(0% 0 0);
|
|
2460
|
-
--cirth-print-muted-color: oklch(48.3% .03 264);
|
|
2461
|
-
--cirth-print-border-color: oklch(61.3% .032 264);
|
|
2462
|
-
color: var(--cirth-print-color);
|
|
2463
|
-
--lightningcss-light: initial;
|
|
2464
|
-
--lightningcss-dark: ;
|
|
2465
|
-
--lightningcss-light: initial;
|
|
2466
|
-
--lightningcss-dark: ;
|
|
2467
|
-
color-scheme: light;
|
|
2468
|
-
--cirth-color: var(--cirth-print-color);
|
|
2469
|
-
--cirth-h1-color: var(--cirth-print-color);
|
|
2470
|
-
--cirth-h2-color: var(--cirth-print-color);
|
|
2471
|
-
--cirth-h3-color: var(--cirth-print-color);
|
|
2472
|
-
--cirth-h4-color: var(--cirth-print-color);
|
|
2473
|
-
--cirth-h5-color: var(--cirth-print-color);
|
|
2474
|
-
--cirth-h6-color: var(--cirth-print-color);
|
|
2475
|
-
--cirth-code-color: var(--cirth-print-color);
|
|
2476
|
-
--cirth-code-kbd-color: var(--cirth-print-color);
|
|
2477
|
-
--cirth-form-element-color: var(--cirth-print-color);
|
|
2478
|
-
--cirth-muted-color: var(--cirth-print-muted-color);
|
|
2479
|
-
--cirth-form-element-placeholder-color: var(--cirth-print-muted-color);
|
|
2480
|
-
--cirth-primary: var(--cirth-print-color);
|
|
2481
|
-
--cirth-primary-hover: var(--cirth-print-color);
|
|
2482
|
-
--cirth-primary-underline: var(--cirth-print-color);
|
|
2483
|
-
--cirth-secondary: var(--cirth-print-color);
|
|
2484
|
-
--cirth-secondary-underline: var(--cirth-print-color);
|
|
2485
|
-
--cirth-contrast: var(--cirth-print-color);
|
|
2486
|
-
--cirth-contrast-underline: var(--cirth-print-color);
|
|
2487
|
-
--cirth-link-visited-color: var(--cirth-print-color);
|
|
2488
|
-
--cirth-muted-border-color: var(--cirth-print-border-color);
|
|
2489
|
-
--cirth-form-element-border-color: var(--cirth-print-border-color);
|
|
2490
|
-
--cirth-box-shadow: none;
|
|
2491
|
-
--cirth-card-box-shadow: none;
|
|
2492
|
-
--cirth-card-background-color: transparent;
|
|
2493
|
-
--cirth-card-sectioning-background-color: transparent;
|
|
2494
|
-
--cirth-code-background-color: transparent;
|
|
2495
|
-
--cirth-code-kbd-background-color: transparent;
|
|
2496
|
-
--cirth-form-element-background-color: transparent;
|
|
2497
|
-
--cirth-form-element-active-background-color: transparent;
|
|
2498
|
-
--cirth-table-row-stripped-background-color: transparent;
|
|
2499
|
-
--cirth-modal-overlay-background-color: transparent;
|
|
2500
|
-
--cirth-ins-color: oklch(35.3% .067 160.59);
|
|
2501
|
-
--cirth-del-color: oklch(35.3% .122 29.73);
|
|
2502
|
-
--cirth-meter-optimum-color: oklch(52.7% .1 160.59);
|
|
2503
|
-
--cirth-meter-suboptimum-color: oklch(48.3% .086 78);
|
|
2504
|
-
--cirth-meter-even-less-good-color: oklch(44% .151 29.73);
|
|
2505
|
-
background: none;
|
|
2506
|
-
}
|
|
2507
|
-
|
|
2508
|
-
.cirth kbd {
|
|
2509
|
-
border: var(--cirth-border-width) solid var(--cirth-print-border-color);
|
|
2510
|
-
}
|
|
2511
|
-
|
|
2512
|
-
.cirth :is(button, [type="submit"], [type="reset"], [type="button"], [role="button"]) {
|
|
2513
|
-
border-color: var(--cirth-print-border-color);
|
|
2514
|
-
box-shadow: none;
|
|
2515
|
-
color: var(--cirth-print-color);
|
|
2516
|
-
background: none;
|
|
2517
|
-
}
|
|
2518
|
-
|
|
2519
|
-
.cirth [type="file"]::file-selector-button {
|
|
2520
|
-
border-color: var(--cirth-print-border-color);
|
|
2521
|
-
box-shadow: none;
|
|
2522
|
-
color: var(--cirth-print-color);
|
|
2523
|
-
background: none;
|
|
2524
|
-
}
|
|
2525
|
-
|
|
2526
|
-
.cirth :is(mark, meter, progress, [type="checkbox"], [type="radio"]) {
|
|
2527
|
-
-webkit-print-color-adjust: exact;
|
|
2528
|
-
print-color-adjust: exact;
|
|
2529
|
-
}
|
|
2530
|
-
|
|
2531
|
-
.cirth a[href^="http"]:not([role="button"], nav a):after {
|
|
2532
|
-
content: " (" attr(href) ")";
|
|
2533
|
-
color: var(--cirth-print-muted-color);
|
|
2534
|
-
font-size: var(--cirth-font-size-sm);
|
|
2535
|
-
word-break: break-all;
|
|
2536
|
-
}
|
|
2537
|
-
|
|
2538
|
-
.cirth thead {
|
|
2539
|
-
display: table-header-group;
|
|
2540
|
-
}
|
|
2541
|
-
|
|
2542
|
-
.cirth tfoot {
|
|
2543
|
-
display: table-footer-group;
|
|
2544
|
-
}
|
|
2545
|
-
|
|
2546
|
-
.cirth tr {
|
|
2547
|
-
break-inside: avoid;
|
|
2548
|
-
}
|
|
2549
|
-
|
|
2550
|
-
.cirth pre {
|
|
2551
|
-
white-space: pre-wrap;
|
|
2552
|
-
overflow: visible;
|
|
2553
|
-
}
|
|
2554
|
-
|
|
2555
|
-
.cirth dialog {
|
|
2556
|
-
backdrop-filter: none;
|
|
2557
|
-
min-width: 0;
|
|
2558
|
-
min-height: 0;
|
|
2559
|
-
position: static;
|
|
2560
|
-
}
|
|
2561
|
-
|
|
2562
|
-
.cirth dialog > article {
|
|
2563
|
-
max-height: none;
|
|
2564
|
-
overflow: visible;
|
|
2565
|
-
}
|
|
2566
|
-
|
|
2567
|
-
.cirth :is(h1, h2, h3, h4, h5, h6) {
|
|
2568
|
-
break-after: avoid;
|
|
2569
|
-
}
|
|
2570
|
-
|
|
2571
|
-
.cirth :is(figure, img) {
|
|
2572
|
-
break-inside: avoid;
|
|
2573
|
-
}
|
|
2574
|
-
|
|
2575
|
-
.cirth :is(blockquote, li, p) {
|
|
2576
|
-
orphans: 3;
|
|
2577
|
-
widows: 3;
|
|
2578
|
-
}
|
|
2579
|
-
}
|