@ctrliq/quantic-components 1.84.0 → 1.84.1
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/dist/capacity-bar/index.js +30 -30
- package/dist/card/card-carousel.component.js +35 -35
- package/dist/card/card-group.component.js +2 -8
- package/dist/card/card.component.js +38 -38
- package/dist/code-input/index.js +33 -33
- package/dist/combobox/index.js +30 -30
- package/dist/dialog/dialog.js +18 -18
- package/dist/dropdown-menu/item.component.js +24 -24
- package/dist/field/field-group.component.js +13 -13
- package/dist/field/field.component.js +31 -31
- package/dist/fieldset/fieldset.component.js +27 -27
- package/dist/grid/grid.component.js +31 -31
- package/dist/index.js.map +1 -1
- package/dist/layout/layout.component.js +1 -0
- package/dist/layout/navbar-menu-item.component.js +1 -0
- package/dist/layout/sidebar-menu-item.component.js +1 -0
- package/dist/log-output/log-output.component.js +1 -1
- package/dist/meta/index.js.map +1 -1
- package/dist/meta/public-css-variables.test.d.ts +1 -0
- package/dist/meta/public-css-variables.test.js +244 -0
- package/dist/meta.json +1 -1
- package/dist/number-input/index.js +18 -17
- package/dist/option-card/option-card.component.js +27 -27
- package/dist/panel/panel-group.component.js +10 -7
- package/dist/panel/panel.component.js +3 -3
- package/dist/progress/index.js +15 -15
- package/dist/quantic-components.js +443 -439
- package/dist/quantic-components.js.map +1 -1
- package/dist/quantic-components.min.js +443 -439
- package/dist/quantic-components.min.js.map +1 -1
- package/dist/register.js.map +1 -1
- package/dist/select/index.js +8 -8
- package/dist/spinner/index.js +7 -3
- package/dist/table/table-cell.component.js +2 -2
- package/dist/table/table-head.component.js +1 -1
- package/dist/table/table.component.js +16 -16
- package/dist/text-input/index.js +10 -10
- package/dist/textarea/index.js +10 -10
- package/dist/tooltip/tooltip.js +0 -1
- package/dist/types/meta/public-css-variables.test.d.ts +1 -0
- package/package.json +2 -1
|
@@ -687,8 +687,8 @@ const{I:ut}=de,ht=e=>e,pt=()=>document.createComment(""),gt=(e,t,i)=>{const n=e.
|
|
|
687
687
|
position: relative;
|
|
688
688
|
width: 100%;
|
|
689
689
|
|
|
690
|
-
--quantic-
|
|
691
|
-
--quantic-
|
|
690
|
+
--quantic-internal-combobox-padding-inline: var(--quantic-spacing-3);
|
|
691
|
+
--quantic-internal-combobox-padding-block: var(--quantic-spacing-md);
|
|
692
692
|
}
|
|
693
693
|
|
|
694
694
|
.main {
|
|
@@ -703,8 +703,8 @@ const{I:ut}=de,ht=e=>e,pt=()=>document.createComment(""),gt=(e,t,i)=>{const n=e.
|
|
|
703
703
|
border-radius: var(--quantic-component-combobox-border-radius, var(--quantic-radius-sm));
|
|
704
704
|
color: var(--quantic-text-primary);
|
|
705
705
|
background-color: var(--quantic-bg-primary);
|
|
706
|
-
padding: var(--quantic-component-combobox-padding-block)
|
|
707
|
-
var(--quantic-component-combobox-padding-inline);
|
|
706
|
+
padding: var(--quantic-component-combobox-padding-block, var(--quantic-internal-combobox-padding-block))
|
|
707
|
+
var(--quantic-component-combobox-padding-inline, var(--quantic-internal-combobox-padding-inline));
|
|
708
708
|
transition:
|
|
709
709
|
border-color 0.2s ease-in-out,
|
|
710
710
|
box-shadow 0.2s ease-in-out;
|
|
@@ -724,14 +724,14 @@ const{I:ut}=de,ht=e=>e,pt=()=>document.createComment(""),gt=(e,t,i)=>{const n=e.
|
|
|
724
724
|
|
|
725
725
|
.main.size--xs {
|
|
726
726
|
font-size: 13px;
|
|
727
|
-
--quantic-
|
|
728
|
-
--quantic-
|
|
727
|
+
--quantic-internal-combobox-padding-inline: var(--quantic-spacing-2);
|
|
728
|
+
--quantic-internal-combobox-padding-block: var(--quantic-spacing-xxs);
|
|
729
729
|
}
|
|
730
730
|
|
|
731
731
|
.main.size--sm {
|
|
732
732
|
font-size: var(--quantic-font-size-body-sm);
|
|
733
|
-
--quantic-
|
|
734
|
-
--quantic-
|
|
733
|
+
--quantic-internal-combobox-padding-inline: var(--quantic-spacing-2);
|
|
734
|
+
--quantic-internal-combobox-padding-block: var(--quantic-spacing-sm);
|
|
735
735
|
}
|
|
736
736
|
|
|
737
737
|
.main.size--md {
|
|
@@ -740,8 +740,8 @@ const{I:ut}=de,ht=e=>e,pt=()=>document.createComment(""),gt=(e,t,i)=>{const n=e.
|
|
|
740
740
|
|
|
741
741
|
.main.size--lg {
|
|
742
742
|
font-size: var(--quantic-font-size-body-lg);
|
|
743
|
-
--quantic-
|
|
744
|
-
--quantic-
|
|
743
|
+
--quantic-internal-combobox-padding-inline: var(--quantic-spacing-4);
|
|
744
|
+
--quantic-internal-combobox-padding-block: var(--quantic-spacing-3);
|
|
745
745
|
}
|
|
746
746
|
|
|
747
747
|
.main:focus-within::before {
|
|
@@ -837,59 +837,59 @@ const{I:ut}=de,ht=e=>e,pt=()=>document.createComment(""),gt=(e,t,i)=>{const n=e.
|
|
|
837
837
|
}
|
|
838
838
|
|
|
839
839
|
.listbox.size--xs {
|
|
840
|
-
--quantic-
|
|
840
|
+
--quantic-internal-combobox-option-padding-block: var(
|
|
841
841
|
--quantic-spacing-1
|
|
842
842
|
);
|
|
843
|
-
--quantic-
|
|
843
|
+
--quantic-internal-combobox-option-padding-inline: var(
|
|
844
844
|
--quantic-spacing-1-5
|
|
845
845
|
);
|
|
846
|
-
--quantic-
|
|
847
|
-
--quantic-
|
|
846
|
+
--quantic-internal-combobox-option-font-size: 13px;
|
|
847
|
+
--quantic-internal-combobox-option-line-height: var(
|
|
848
848
|
--quantic-line-height-body-xs
|
|
849
849
|
);
|
|
850
850
|
}
|
|
851
851
|
|
|
852
852
|
.listbox.size--sm {
|
|
853
|
-
--quantic-
|
|
853
|
+
--quantic-internal-combobox-option-padding-block: var(
|
|
854
854
|
--quantic-spacing-1-5
|
|
855
855
|
);
|
|
856
|
-
--quantic-
|
|
856
|
+
--quantic-internal-combobox-option-padding-inline: var(
|
|
857
857
|
--quantic-spacing-2
|
|
858
858
|
);
|
|
859
|
-
--quantic-
|
|
859
|
+
--quantic-internal-combobox-option-font-size: var(
|
|
860
860
|
--quantic-font-size-body-sm
|
|
861
861
|
);
|
|
862
|
-
--quantic-
|
|
862
|
+
--quantic-internal-combobox-option-line-height: var(
|
|
863
863
|
--quantic-line-height-body-sm
|
|
864
864
|
);
|
|
865
865
|
}
|
|
866
866
|
|
|
867
867
|
.listbox.size--md {
|
|
868
|
-
--quantic-
|
|
868
|
+
--quantic-internal-combobox-option-padding-block: var(
|
|
869
869
|
--quantic-spacing-2
|
|
870
870
|
);
|
|
871
|
-
--quantic-
|
|
871
|
+
--quantic-internal-combobox-option-padding-inline: var(
|
|
872
872
|
--quantic-spacing-3
|
|
873
873
|
);
|
|
874
|
-
--quantic-
|
|
874
|
+
--quantic-internal-combobox-option-font-size: var(
|
|
875
875
|
--quantic-font-size-body-md
|
|
876
876
|
);
|
|
877
|
-
--quantic-
|
|
877
|
+
--quantic-internal-combobox-option-line-height: var(
|
|
878
878
|
--quantic-line-height-body-md
|
|
879
879
|
);
|
|
880
880
|
}
|
|
881
881
|
|
|
882
882
|
.listbox.size--lg {
|
|
883
|
-
--quantic-
|
|
883
|
+
--quantic-internal-combobox-option-padding-block: var(
|
|
884
884
|
--quantic-spacing-3
|
|
885
885
|
);
|
|
886
|
-
--quantic-
|
|
886
|
+
--quantic-internal-combobox-option-padding-inline: var(
|
|
887
887
|
--quantic-spacing-4
|
|
888
888
|
);
|
|
889
|
-
--quantic-
|
|
889
|
+
--quantic-internal-combobox-option-font-size: var(
|
|
890
890
|
--quantic-font-size-body-lg
|
|
891
891
|
);
|
|
892
|
-
--quantic-
|
|
892
|
+
--quantic-internal-combobox-option-line-height: var(
|
|
893
893
|
--quantic-line-height-body-lg
|
|
894
894
|
);
|
|
895
895
|
}
|
|
@@ -899,20 +899,20 @@ const{I:ut}=de,ht=e=>e,pt=()=>document.createComment(""),gt=(e,t,i)=>{const n=e.
|
|
|
899
899
|
align-items: center;
|
|
900
900
|
padding: var(
|
|
901
901
|
--quantic-component-combobox-option-padding-block,
|
|
902
|
-
var(--quantic-spacing-2)
|
|
902
|
+
var(--quantic-internal-combobox-option-padding-block, var(--quantic-spacing-2))
|
|
903
903
|
)
|
|
904
904
|
var(
|
|
905
905
|
--quantic-component-combobox-option-padding-inline,
|
|
906
|
-
var(--quantic-spacing-3)
|
|
906
|
+
var(--quantic-internal-combobox-option-padding-inline, var(--quantic-spacing-3))
|
|
907
907
|
);
|
|
908
908
|
border-radius: var(--quantic-radius-sm);
|
|
909
909
|
font-size: var(
|
|
910
910
|
--quantic-component-combobox-option-font-size,
|
|
911
|
-
var(--quantic-font-size-body-md)
|
|
911
|
+
var(--quantic-internal-combobox-option-font-size, var(--quantic-font-size-body-md))
|
|
912
912
|
);
|
|
913
913
|
line-height: var(
|
|
914
914
|
--quantic-component-combobox-option-line-height,
|
|
915
|
-
var(--quantic-line-height-body-md)
|
|
915
|
+
var(--quantic-internal-combobox-option-line-height, var(--quantic-line-height-body-md))
|
|
916
916
|
);
|
|
917
917
|
color: var(--quantic-text-primary);
|
|
918
918
|
cursor: pointer;
|
|
@@ -1123,77 +1123,77 @@ const{I:ut}=de,ht=e=>e,pt=()=>document.createComment(""),gt=(e,t,i)=>{const n=e.
|
|
|
1123
1123
|
|
|
1124
1124
|
.label {
|
|
1125
1125
|
color: var(--quantic-text-secondary);
|
|
1126
|
-
font-size: var(--quantic-component-capacity-bar-label-font-size);
|
|
1127
|
-
line-height: var(--quantic-component-capacity-bar-label-line-height);
|
|
1126
|
+
font-size: var(--quantic-component-capacity-bar-label-font-size, var(--quantic-internal-capacity-bar-label-font-size));
|
|
1127
|
+
line-height: var(--quantic-component-capacity-bar-label-line-height, var(--quantic-internal-capacity-bar-label-line-height));
|
|
1128
1128
|
white-space: nowrap;
|
|
1129
1129
|
}
|
|
1130
1130
|
|
|
1131
1131
|
.bar {
|
|
1132
1132
|
display: flex;
|
|
1133
1133
|
flex-wrap: nowrap;
|
|
1134
|
-
gap: var(--quantic-component-capacity-bar-gap, 3px);
|
|
1134
|
+
gap: var(--quantic-component-capacity-bar-gap, var(--quantic-internal-capacity-bar-gap, 3px));
|
|
1135
1135
|
}
|
|
1136
1136
|
|
|
1137
1137
|
.size--xs {
|
|
1138
|
-
--quantic-
|
|
1139
|
-
--quantic-
|
|
1140
|
-
--quantic-
|
|
1141
|
-
--quantic-
|
|
1142
|
-
--quantic-
|
|
1138
|
+
--quantic-internal-capacity-bar-gap: 2px;
|
|
1139
|
+
--quantic-internal-capacity-bar-segment-radius: 2px;
|
|
1140
|
+
--quantic-internal-capacity-bar-segment-width: 3px;
|
|
1141
|
+
--quantic-internal-capacity-bar-segment-height: var(--quantic-spacing-5);
|
|
1142
|
+
--quantic-internal-capacity-bar-label-font-size: var(
|
|
1143
1143
|
--quantic-font-size-body-xs
|
|
1144
1144
|
);
|
|
1145
|
-
--quantic-
|
|
1145
|
+
--quantic-internal-capacity-bar-label-line-height: var(
|
|
1146
1146
|
--quantic-line-height-body-xs
|
|
1147
1147
|
);
|
|
1148
1148
|
}
|
|
1149
1149
|
|
|
1150
1150
|
.size--sm {
|
|
1151
|
-
--quantic-
|
|
1152
|
-
--quantic-
|
|
1153
|
-
--quantic-
|
|
1154
|
-
--quantic-
|
|
1155
|
-
--quantic-
|
|
1151
|
+
--quantic-internal-capacity-bar-gap: 2px;
|
|
1152
|
+
--quantic-internal-capacity-bar-segment-radius: 2px;
|
|
1153
|
+
--quantic-internal-capacity-bar-segment-width: var(--quantic-spacing-1);
|
|
1154
|
+
--quantic-internal-capacity-bar-segment-height: var(--quantic-spacing-6);
|
|
1155
|
+
--quantic-internal-capacity-bar-label-font-size: var(
|
|
1156
1156
|
--quantic-font-size-body-xs
|
|
1157
1157
|
);
|
|
1158
|
-
--quantic-
|
|
1158
|
+
--quantic-internal-capacity-bar-label-line-height: var(
|
|
1159
1159
|
--quantic-line-height-body-xs
|
|
1160
1160
|
);
|
|
1161
1161
|
}
|
|
1162
1162
|
|
|
1163
1163
|
.size--md {
|
|
1164
|
-
--quantic-
|
|
1165
|
-
--quantic-
|
|
1166
|
-
--quantic-
|
|
1164
|
+
--quantic-internal-capacity-bar-gap: 2px;
|
|
1165
|
+
--quantic-internal-capacity-bar-segment-radius: 3px;
|
|
1166
|
+
--quantic-internal-capacity-bar-segment-width: var(
|
|
1167
1167
|
--quantic-spacing-1-5
|
|
1168
1168
|
);
|
|
1169
|
-
--quantic-
|
|
1170
|
-
--quantic-
|
|
1169
|
+
--quantic-internal-capacity-bar-segment-height: var(--quantic-spacing-8);
|
|
1170
|
+
--quantic-internal-capacity-bar-label-font-size: var(
|
|
1171
1171
|
--quantic-font-size-body-sm
|
|
1172
1172
|
);
|
|
1173
|
-
--quantic-
|
|
1173
|
+
--quantic-internal-capacity-bar-label-line-height: var(
|
|
1174
1174
|
--quantic-line-height-body-sm
|
|
1175
1175
|
);
|
|
1176
1176
|
}
|
|
1177
1177
|
|
|
1178
1178
|
.size--lg {
|
|
1179
|
-
--quantic-
|
|
1180
|
-
--quantic-
|
|
1181
|
-
--quantic-
|
|
1182
|
-
--quantic-
|
|
1179
|
+
--quantic-internal-capacity-bar-gap: 3px;
|
|
1180
|
+
--quantic-internal-capacity-bar-segment-radius: 4px;
|
|
1181
|
+
--quantic-internal-capacity-bar-segment-width: var(--quantic-spacing-2);
|
|
1182
|
+
--quantic-internal-capacity-bar-segment-height: var(
|
|
1183
1183
|
--quantic-spacing-12
|
|
1184
1184
|
);
|
|
1185
|
-
--quantic-
|
|
1185
|
+
--quantic-internal-capacity-bar-label-font-size: var(
|
|
1186
1186
|
--quantic-font-size-body-md
|
|
1187
1187
|
);
|
|
1188
|
-
--quantic-
|
|
1188
|
+
--quantic-internal-capacity-bar-label-line-height: var(
|
|
1189
1189
|
--quantic-line-height-body-md
|
|
1190
1190
|
);
|
|
1191
1191
|
}
|
|
1192
1192
|
|
|
1193
1193
|
.segment {
|
|
1194
|
-
width: var(--quantic-component-capacity-bar-segment-width, 6px);
|
|
1195
|
-
height: var(--quantic-component-capacity-bar-segment-height, 6px);
|
|
1196
|
-
border-radius: var(--quantic-component-capacity-bar-segment-radius, 4px);
|
|
1194
|
+
width: var(--quantic-component-capacity-bar-segment-width, var(--quantic-internal-capacity-bar-segment-width, 6px));
|
|
1195
|
+
height: var(--quantic-component-capacity-bar-segment-height, var(--quantic-internal-capacity-bar-segment-height, 6px));
|
|
1196
|
+
border-radius: var(--quantic-component-capacity-bar-segment-radius, var(--quantic-internal-capacity-bar-segment-radius, 4px));
|
|
1197
1197
|
}
|
|
1198
1198
|
|
|
1199
1199
|
.segment--empty {
|
|
@@ -1472,13 +1472,13 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1472
1472
|
color: var(--quantic-text-secondary);
|
|
1473
1473
|
position: relative;
|
|
1474
1474
|
|
|
1475
|
-
--quantic-
|
|
1476
|
-
--quantic-
|
|
1475
|
+
--quantic-internal-card-font-size: var(--quantic-font-size-body-md);
|
|
1476
|
+
--quantic-internal-card-line-height: var(
|
|
1477
1477
|
--quantic-line-height-body-md
|
|
1478
1478
|
);
|
|
1479
|
-
--quantic-
|
|
1480
|
-
--quantic-
|
|
1481
|
-
--quantic-
|
|
1479
|
+
--quantic-internal-card-radius: var(--quantic-radius-md);
|
|
1480
|
+
--quantic-internal-card-spacing: var(--quantic-spacing-4);
|
|
1481
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-6);
|
|
1482
1482
|
}
|
|
1483
1483
|
|
|
1484
1484
|
button.main,
|
|
@@ -1499,16 +1499,16 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1499
1499
|
.main {
|
|
1500
1500
|
display: flex;
|
|
1501
1501
|
flex-direction: column;
|
|
1502
|
-
gap: var(--quantic-component-card-spacing);
|
|
1502
|
+
gap: var(--quantic-component-card-spacing, var(--quantic-internal-card-spacing));
|
|
1503
1503
|
padding: var(
|
|
1504
1504
|
--quantic-component-card-padding,
|
|
1505
|
-
var(--quantic-component-card-size-padding)
|
|
1505
|
+
var(--quantic-component-card-size-padding, var(--quantic-internal-card-size-padding))
|
|
1506
1506
|
);
|
|
1507
|
-
border-radius: var(--quantic-component-card-radius);
|
|
1507
|
+
border-radius: var(--quantic-component-card-radius, var(--quantic-internal-card-radius));
|
|
1508
1508
|
border: 1px solid var(--quantic-border-primary);
|
|
1509
1509
|
overflow: hidden;
|
|
1510
|
-
font-size: var(--quantic-component-card-font-size);
|
|
1511
|
-
line-height: var(--quantic-component-card-line-height);
|
|
1510
|
+
font-size: var(--quantic-component-card-font-size, var(--quantic-internal-card-font-size));
|
|
1511
|
+
line-height: var(--quantic-component-card-line-height, var(--quantic-internal-card-line-height));
|
|
1512
1512
|
flex: 1 1 auto;
|
|
1513
1513
|
box-sizing: border-box;
|
|
1514
1514
|
}
|
|
@@ -1529,60 +1529,60 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1529
1529
|
}
|
|
1530
1530
|
|
|
1531
1531
|
.size--xs {
|
|
1532
|
-
--quantic-
|
|
1533
|
-
--quantic-
|
|
1534
|
-
--quantic-
|
|
1535
|
-
--quantic-
|
|
1536
|
-
--quantic-
|
|
1532
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-3);
|
|
1533
|
+
--quantic-internal-card-spacing: var(--quantic-spacing-1);
|
|
1534
|
+
--quantic-internal-card-radius: var(--quantic-radius-sm);
|
|
1535
|
+
--quantic-internal-card-font-size: var(--quantic-font-size-body-xs);
|
|
1536
|
+
--quantic-internal-card-line-height: var(
|
|
1537
1537
|
--quantic-line-height-body-sm
|
|
1538
1538
|
);
|
|
1539
1539
|
}
|
|
1540
1540
|
|
|
1541
1541
|
.size--sm {
|
|
1542
|
-
--quantic-
|
|
1543
|
-
--quantic-
|
|
1544
|
-
--quantic-
|
|
1545
|
-
--quantic-
|
|
1546
|
-
--quantic-
|
|
1542
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-4);
|
|
1543
|
+
--quantic-internal-card-spacing: var(--quantic-spacing-1-5);
|
|
1544
|
+
--quantic-internal-card-radius: var(--quantic-radius-sm);
|
|
1545
|
+
--quantic-internal-card-font-size: var(--quantic-font-size-body-sm);
|
|
1546
|
+
--quantic-internal-card-line-height: var(
|
|
1547
1547
|
--quantic-line-height-body-sm
|
|
1548
1548
|
);
|
|
1549
1549
|
}
|
|
1550
1550
|
|
|
1551
1551
|
.size--md {
|
|
1552
|
-
--quantic-
|
|
1553
|
-
--quantic-
|
|
1554
|
-
--quantic-
|
|
1555
|
-
--quantic-
|
|
1556
|
-
--quantic-
|
|
1552
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-5);
|
|
1553
|
+
--quantic-internal-card-spacing: var(--quantic-spacing-2);
|
|
1554
|
+
--quantic-internal-card-radius: var(--quantic-radius-md);
|
|
1555
|
+
--quantic-internal-card-font-size: var(--quantic-font-size-body-md);
|
|
1556
|
+
--quantic-internal-card-line-height: var(
|
|
1557
1557
|
--quantic-line-height-body-md
|
|
1558
1558
|
);
|
|
1559
1559
|
}
|
|
1560
1560
|
|
|
1561
1561
|
.size--lg {
|
|
1562
|
-
--quantic-
|
|
1563
|
-
--quantic-
|
|
1564
|
-
--quantic-
|
|
1565
|
-
--quantic-
|
|
1566
|
-
--quantic-
|
|
1562
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-6);
|
|
1563
|
+
--quantic-internal-card-spacing: var(--quantic-spacing-3);
|
|
1564
|
+
--quantic-internal-card-radius: var(--quantic-radius-lg);
|
|
1565
|
+
--quantic-internal-card-font-size: var(--quantic-font-size-body-lg);
|
|
1566
|
+
--quantic-internal-card-line-height: var(
|
|
1567
1567
|
--quantic-line-height-body-lg
|
|
1568
1568
|
);
|
|
1569
1569
|
}
|
|
1570
1570
|
|
|
1571
1571
|
@container (min-width: 40rem) {
|
|
1572
1572
|
.size--xs {
|
|
1573
|
-
--quantic-
|
|
1573
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-3);
|
|
1574
1574
|
}
|
|
1575
1575
|
|
|
1576
1576
|
.size--sm {
|
|
1577
|
-
--quantic-
|
|
1577
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-4);
|
|
1578
1578
|
}
|
|
1579
1579
|
|
|
1580
1580
|
.size--md {
|
|
1581
|
-
--quantic-
|
|
1581
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-6);
|
|
1582
1582
|
}
|
|
1583
1583
|
|
|
1584
1584
|
.size--lg {
|
|
1585
|
-
--quantic-
|
|
1585
|
+
--quantic-internal-card-size-padding: var(--quantic-spacing-8);
|
|
1586
1586
|
}
|
|
1587
1587
|
}
|
|
1588
1588
|
|
|
@@ -1593,11 +1593,11 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1593
1593
|
}
|
|
1594
1594
|
|
|
1595
1595
|
.header {
|
|
1596
|
-
padding-bottom: var(--quantic-component-card-spacing);
|
|
1596
|
+
padding-bottom: var(--quantic-component-card-spacing, var(--quantic-internal-card-spacing));
|
|
1597
1597
|
}
|
|
1598
1598
|
|
|
1599
1599
|
.footer {
|
|
1600
|
-
padding-top: var(--quantic-component-card-spacing);
|
|
1600
|
+
padding-top: var(--quantic-component-card-spacing, var(--quantic-internal-card-spacing));
|
|
1601
1601
|
margin-top: auto;
|
|
1602
1602
|
}
|
|
1603
1603
|
|
|
@@ -1606,7 +1606,7 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1606
1606
|
inset: calc(
|
|
1607
1607
|
var(
|
|
1608
1608
|
--quantic-component-card-padding,
|
|
1609
|
-
var(--quantic-component-card-size-padding)
|
|
1609
|
+
var(--quantic-component-card-size-padding, var(--quantic-internal-card-size-padding))
|
|
1610
1610
|
) / 2
|
|
1611
1611
|
);
|
|
1612
1612
|
left: auto;
|
|
@@ -1658,7 +1658,7 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1658
1658
|
padding-right: calc(
|
|
1659
1659
|
var(
|
|
1660
1660
|
--quantic-component-card-padding,
|
|
1661
|
-
var(--quantic-component-card-size-padding)
|
|
1661
|
+
var(--quantic-component-card-size-padding, var(--quantic-internal-card-size-padding))
|
|
1662
1662
|
) * 2
|
|
1663
1663
|
);
|
|
1664
1664
|
}
|
|
@@ -1675,9 +1675,9 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1675
1675
|
|
|
1676
1676
|
.grid {
|
|
1677
1677
|
display: grid;
|
|
1678
|
-
gap: var(--quantic-component-grid-gap, var(--quantic-spacing-4));
|
|
1678
|
+
gap: var(--quantic-component-grid-gap, var(--quantic-internal-grid-gap, var(--quantic-spacing-4)));
|
|
1679
1679
|
grid-template-columns: repeat(
|
|
1680
|
-
var(--quantic-component-grid-columns, 1),
|
|
1680
|
+
var(--quantic-component-grid-columns, var(--quantic-internal-grid-columns, 1)),
|
|
1681
1681
|
minmax(0, 1fr)
|
|
1682
1682
|
);
|
|
1683
1683
|
align-items: stretch;
|
|
@@ -1688,109 +1688,109 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1688
1688
|
}
|
|
1689
1689
|
|
|
1690
1690
|
.density--dense {
|
|
1691
|
-
--quantic-
|
|
1692
|
-
--quantic-
|
|
1691
|
+
--quantic-internal-grid-columns: 2;
|
|
1692
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-2);
|
|
1693
1693
|
}
|
|
1694
1694
|
|
|
1695
1695
|
.density--compact {
|
|
1696
|
-
--quantic-
|
|
1697
|
-
--quantic-
|
|
1696
|
+
--quantic-internal-grid-columns: 1;
|
|
1697
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-2);
|
|
1698
1698
|
}
|
|
1699
1699
|
|
|
1700
1700
|
.density--comfortable {
|
|
1701
|
-
--quantic-
|
|
1702
|
-
--quantic-
|
|
1701
|
+
--quantic-internal-grid-columns: 1;
|
|
1702
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-4);
|
|
1703
1703
|
}
|
|
1704
1704
|
|
|
1705
1705
|
.density--sparse {
|
|
1706
|
-
--quantic-
|
|
1707
|
-
--quantic-
|
|
1706
|
+
--quantic-internal-grid-columns: 1;
|
|
1707
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-4);
|
|
1708
1708
|
}
|
|
1709
1709
|
|
|
1710
1710
|
@container (min-width: ${l(Ye)}) {
|
|
1711
1711
|
.density--dense {
|
|
1712
|
-
--quantic-
|
|
1713
|
-
--quantic-
|
|
1712
|
+
--quantic-internal-grid-columns: 3;
|
|
1713
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-3);
|
|
1714
1714
|
}
|
|
1715
1715
|
|
|
1716
1716
|
.density--compact {
|
|
1717
|
-
--quantic-
|
|
1718
|
-
--quantic-
|
|
1717
|
+
--quantic-internal-grid-columns: 2;
|
|
1718
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-3);
|
|
1719
1719
|
}
|
|
1720
1720
|
}
|
|
1721
1721
|
|
|
1722
1722
|
@container (min-width: ${l(et)}) {
|
|
1723
1723
|
.density--dense {
|
|
1724
|
-
--quantic-
|
|
1724
|
+
--quantic-internal-grid-columns: 4;
|
|
1725
1725
|
}
|
|
1726
1726
|
|
|
1727
1727
|
.density--compact {
|
|
1728
|
-
--quantic-
|
|
1728
|
+
--quantic-internal-grid-columns: 3;
|
|
1729
1729
|
}
|
|
1730
1730
|
|
|
1731
1731
|
.density--comfortable {
|
|
1732
|
-
--quantic-
|
|
1732
|
+
--quantic-internal-grid-columns: 2;
|
|
1733
1733
|
}
|
|
1734
1734
|
}
|
|
1735
1735
|
|
|
1736
1736
|
@container (min-width: ${l(tt)}) {
|
|
1737
1737
|
.density--dense {
|
|
1738
|
-
--quantic-
|
|
1738
|
+
--quantic-internal-grid-columns: 5;
|
|
1739
1739
|
}
|
|
1740
1740
|
|
|
1741
1741
|
.density--compact {
|
|
1742
|
-
--quantic-
|
|
1742
|
+
--quantic-internal-grid-columns: 3;
|
|
1743
1743
|
}
|
|
1744
1744
|
|
|
1745
1745
|
.density--sparse {
|
|
1746
|
-
--quantic-
|
|
1746
|
+
--quantic-internal-grid-columns: 2;
|
|
1747
1747
|
}
|
|
1748
1748
|
}
|
|
1749
1749
|
|
|
1750
1750
|
@container (min-width: ${l(it)}) {
|
|
1751
1751
|
.density--dense {
|
|
1752
|
-
--quantic-
|
|
1752
|
+
--quantic-internal-grid-columns: 6;
|
|
1753
1753
|
}
|
|
1754
1754
|
|
|
1755
1755
|
.density--compact {
|
|
1756
|
-
--quantic-
|
|
1756
|
+
--quantic-internal-grid-columns: 4;
|
|
1757
1757
|
}
|
|
1758
1758
|
|
|
1759
1759
|
.density--comfortable {
|
|
1760
|
-
--quantic-
|
|
1760
|
+
--quantic-internal-grid-columns: 3;
|
|
1761
1761
|
}
|
|
1762
1762
|
|
|
1763
1763
|
.density--sparse {
|
|
1764
|
-
--quantic-
|
|
1764
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-5);
|
|
1765
1765
|
}
|
|
1766
1766
|
}
|
|
1767
1767
|
|
|
1768
1768
|
@container (min-width: ${l(nt)}) {
|
|
1769
1769
|
.density--dense {
|
|
1770
|
-
--quantic-
|
|
1770
|
+
--quantic-internal-grid-columns: 8;
|
|
1771
1771
|
}
|
|
1772
1772
|
|
|
1773
1773
|
.density--compact {
|
|
1774
|
-
--quantic-
|
|
1774
|
+
--quantic-internal-grid-columns: 5;
|
|
1775
1775
|
}
|
|
1776
1776
|
|
|
1777
1777
|
.density--comfortable {
|
|
1778
|
-
--quantic-
|
|
1779
|
-
--quantic-
|
|
1778
|
+
--quantic-internal-grid-columns: 3;
|
|
1779
|
+
--quantic-internal-grid-gap: var(--quantic-spacing-5);
|
|
1780
1780
|
}
|
|
1781
1781
|
}
|
|
1782
1782
|
|
|
1783
1783
|
@container (min-width: ${l(ot)}) {
|
|
1784
1784
|
.density--dense {
|
|
1785
|
-
--quantic-
|
|
1785
|
+
--quantic-internal-grid-columns: 10;
|
|
1786
1786
|
}
|
|
1787
1787
|
|
|
1788
1788
|
.density--compact {
|
|
1789
|
-
--quantic-
|
|
1789
|
+
--quantic-internal-grid-columns: 6;
|
|
1790
1790
|
}
|
|
1791
1791
|
|
|
1792
1792
|
.density--comfortable {
|
|
1793
|
-
--quantic-
|
|
1793
|
+
--quantic-internal-grid-columns: 4;
|
|
1794
1794
|
}
|
|
1795
1795
|
}
|
|
1796
1796
|
`,t([fe({type:"GridDensity",options:Object.values(e.GridDensity),default:e.GridDensity.Comfortable,description:'Controls column count and gap at each breakpoint. "dense" maximises columns; "comfortable" balances spacing; "sparse" widens gaps; "custom" defers to CSS custom properties.'})],e.Grid.prototype,"density",void 0),e.Grid=t([Se("quantic-grid")],e.Grid),e.Grid.ensureDefined(),e.CardGroup=class extends qe{constructor(){super(...arguments),this.density=e.GridDensity.Comfortable}render(){return Re`<quantic-grid density=${this.density}>
|
|
@@ -1801,14 +1801,8 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1801
1801
|
}
|
|
1802
1802
|
|
|
1803
1803
|
quantic-grid {
|
|
1804
|
-
--quantic-component-grid-columns: var(
|
|
1805
|
-
|
|
1806
|
-
var(--quantic-component-grid-columns)
|
|
1807
|
-
);
|
|
1808
|
-
--quantic-component-grid-gap: var(
|
|
1809
|
-
--quantic-component-card-group-gap,
|
|
1810
|
-
var(--quantic-component-grid-gap)
|
|
1811
|
-
);
|
|
1804
|
+
--quantic-component-grid-columns: var(--quantic-component-card-group-columns);
|
|
1805
|
+
--quantic-component-grid-gap: var(--quantic-component-card-group-gap);
|
|
1812
1806
|
}
|
|
1813
1807
|
`,t([fe({type:"GridDensity",options:Object.values(e.GridDensity),default:e.GridDensity.Comfortable,description:"Controls the number of columns and gap at each container breakpoint."})],e.CardGroup.prototype,"density",void 0),e.CardGroup=t([Se("quantic-card-group")],e.CardGroup),e.CardCarousel=class extends qe{constructor(){super(...arguments),this.density=e.GridDensity.Comfortable,this.showNavigation=!0,this.showDots=!0,this.canScrollPrev=!1,this.canScrollNext=!1,this.currentPage=0,this.totalPages=0,this.resizeObserver=null,this.scrollTimeout=null,this.updateScrollState=()=>{if(!this.containerNode)return;const{scrollLeft:e,scrollWidth:t,clientWidth:i}=this.containerNode,n=t-i;this.canScrollPrev=e>1,this.canScrollNext=e<n-1;const{slides:o}=this.getSlideMetrics();o.length>0&&(this.currentPage=o.map((t,i)=>({index:i,distance:Math.abs(t.offsetLeft-e)})).reduce((e,t)=>t.distance<e.distance?t:e).index)},this.calculatePages=()=>{this.totalPages=this.getSlideMetrics().totalPages},this.handleScroll=()=>{this.updateScrollState(),this.scrollTimeout&&window.clearTimeout(this.scrollTimeout),this.scrollTimeout=window.setTimeout(this.updateScrollState,100)},this.handlePrevClick=()=>{const{step:e}=this.getSlideMetrics();this.containerNode?.scrollBy({left:-e,behavior:"smooth"})},this.handleNextClick=()=>{const{step:e}=this.getSlideMetrics();this.containerNode?.scrollBy({left:e,behavior:"smooth"})},this.handleDotClick=e=>{this.currentPage=e;const{slides:t}=this.getSlideMetrics(),i=t[e];i&&this.containerNode.scrollTo({left:i.offsetLeft,behavior:"smooth"})},this.handleSlotChange=()=>{this.calculatePages(),this.updateScrollState()},this.handleKeyDown=e=>{switch(e.key){case"ArrowLeft":e.preventDefault(),this.canScrollPrev&&this.handlePrevClick();break;case"ArrowRight":e.preventDefault(),this.canScrollNext&&this.handleNextClick();break;case"Home":e.preventDefault(),this.totalPages>0&&this.handleDotClick(0);break;case"End":e.preventDefault(),this.totalPages>0&&this.handleDotClick(this.totalPages-1)}}}getSlideMetrics(){const e=this.containerNode?.clientWidth??0,t=(this.slotNode?.assignedElements()??[]).filter(e=>e instanceof HTMLElement);if(!e||0===t.length)return{slides:t,containerWidth:e,step:0,visibleSlides:1,totalPages:0};const i=t[0],n=t[1],o=Math.max(1,n?n.offsetLeft-i.offsetLeft:i.offsetWidth),s=Math.max(1,Math.round(e/o));return{slides:t,containerWidth:e,step:o,visibleSlides:s,totalPages:Math.max(1,t.length-s+1)}}updated(e){e.has("density")&&requestAnimationFrame(()=>{this.calculatePages(),this.updateScrollState()})}firstUpdated(){this.containerNode.addEventListener("scroll",this.handleScroll),this.resizeObserver=new ResizeObserver(()=>{this.calculatePages(),this.updateScrollState()}),this.resizeObserver.observe(this.containerNode),requestAnimationFrame(()=>{this.calculatePages(),this.updateScrollState()})}disconnectedCallback(){super.disconnectedCallback(),this.containerNode?.removeEventListener("scroll",this.handleScroll),this.resizeObserver?.disconnect(),this.scrollTimeout&&window.clearTimeout(this.scrollTimeout)}render(){const e=Ne({"carousel-container":!0,[`density--${this.density}`]:!0});return W`
|
|
1814
1808
|
<div
|
|
@@ -1893,8 +1887,8 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1893
1887
|
container-type: inline-size;
|
|
1894
1888
|
position: relative;
|
|
1895
1889
|
|
|
1896
|
-
--quantic-
|
|
1897
|
-
--quantic-
|
|
1890
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-4);
|
|
1891
|
+
--quantic-internal-card-carousel-slides-to-show: 1;
|
|
1898
1892
|
}
|
|
1899
1893
|
|
|
1900
1894
|
.carousel {
|
|
@@ -1904,7 +1898,7 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1904
1898
|
|
|
1905
1899
|
.carousel-container {
|
|
1906
1900
|
display: flex;
|
|
1907
|
-
gap: var(--quantic-component-card-carousel-gap);
|
|
1901
|
+
gap: var(--quantic-component-card-carousel-gap, var(--quantic-internal-card-carousel-gap));
|
|
1908
1902
|
overflow-x: auto;
|
|
1909
1903
|
overflow-y: clip;
|
|
1910
1904
|
scroll-snap-type: x mandatory;
|
|
@@ -1930,10 +1924,10 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1930
1924
|
flex: 0 0
|
|
1931
1925
|
calc(
|
|
1932
1926
|
(
|
|
1933
|
-
100% - var(--quantic-component-card-carousel-gap) *
|
|
1934
|
-
(var(--quantic-component-card-carousel-slides-to-show) - 1)
|
|
1927
|
+
100% - var(--quantic-component-card-carousel-gap, var(--quantic-internal-card-carousel-gap)) *
|
|
1928
|
+
(var(--quantic-component-card-carousel-slides-to-show, var(--quantic-internal-card-carousel-slides-to-show)) - 1)
|
|
1935
1929
|
) /
|
|
1936
|
-
var(--quantic-component-card-carousel-slides-to-show)
|
|
1930
|
+
var(--quantic-component-card-carousel-slides-to-show, var(--quantic-internal-card-carousel-slides-to-show))
|
|
1937
1931
|
);
|
|
1938
1932
|
min-width: 0;
|
|
1939
1933
|
scroll-snap-align: start;
|
|
@@ -1941,23 +1935,23 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1941
1935
|
}
|
|
1942
1936
|
|
|
1943
1937
|
.density--dense {
|
|
1944
|
-
--quantic-
|
|
1945
|
-
--quantic-
|
|
1938
|
+
--quantic-internal-card-carousel-slides-to-show: 2;
|
|
1939
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-2);
|
|
1946
1940
|
}
|
|
1947
1941
|
|
|
1948
1942
|
.density--compact {
|
|
1949
|
-
--quantic-
|
|
1950
|
-
--quantic-
|
|
1943
|
+
--quantic-internal-card-carousel-slides-to-show: 1;
|
|
1944
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-2);
|
|
1951
1945
|
}
|
|
1952
1946
|
|
|
1953
1947
|
.density--comfortable {
|
|
1954
|
-
--quantic-
|
|
1955
|
-
--quantic-
|
|
1948
|
+
--quantic-internal-card-carousel-slides-to-show: 1;
|
|
1949
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-4);
|
|
1956
1950
|
}
|
|
1957
1951
|
|
|
1958
1952
|
.density--sparse {
|
|
1959
|
-
--quantic-
|
|
1960
|
-
--quantic-
|
|
1953
|
+
--quantic-internal-card-carousel-slides-to-show: 1;
|
|
1954
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-4);
|
|
1961
1955
|
}
|
|
1962
1956
|
|
|
1963
1957
|
.density--custom {
|
|
@@ -1966,88 +1960,88 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
1966
1960
|
|
|
1967
1961
|
@container (min-width: ${l(Ye)}) {
|
|
1968
1962
|
.density--dense {
|
|
1969
|
-
--quantic-
|
|
1970
|
-
--quantic-
|
|
1963
|
+
--quantic-internal-card-carousel-slides-to-show: 3;
|
|
1964
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-3);
|
|
1971
1965
|
}
|
|
1972
1966
|
|
|
1973
1967
|
.density--compact {
|
|
1974
|
-
--quantic-
|
|
1975
|
-
--quantic-
|
|
1968
|
+
--quantic-internal-card-carousel-slides-to-show: 2;
|
|
1969
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-3);
|
|
1976
1970
|
}
|
|
1977
1971
|
}
|
|
1978
1972
|
|
|
1979
1973
|
@container (min-width: ${l(et)}) {
|
|
1980
1974
|
.density--dense {
|
|
1981
|
-
--quantic-
|
|
1975
|
+
--quantic-internal-card-carousel-slides-to-show: 4;
|
|
1982
1976
|
}
|
|
1983
1977
|
|
|
1984
1978
|
.density--compact {
|
|
1985
|
-
--quantic-
|
|
1979
|
+
--quantic-internal-card-carousel-slides-to-show: 3;
|
|
1986
1980
|
}
|
|
1987
1981
|
|
|
1988
1982
|
.density--comfortable {
|
|
1989
|
-
--quantic-
|
|
1983
|
+
--quantic-internal-card-carousel-slides-to-show: 2;
|
|
1990
1984
|
}
|
|
1991
1985
|
}
|
|
1992
1986
|
|
|
1993
1987
|
@container (min-width: ${l(tt)}) {
|
|
1994
1988
|
.density--dense {
|
|
1995
|
-
--quantic-
|
|
1989
|
+
--quantic-internal-card-carousel-slides-to-show: 5;
|
|
1996
1990
|
}
|
|
1997
1991
|
|
|
1998
1992
|
.density--compact {
|
|
1999
|
-
--quantic-
|
|
1993
|
+
--quantic-internal-card-carousel-slides-to-show: 3;
|
|
2000
1994
|
}
|
|
2001
1995
|
|
|
2002
1996
|
.density--sparse {
|
|
2003
|
-
--quantic-
|
|
1997
|
+
--quantic-internal-card-carousel-slides-to-show: 2;
|
|
2004
1998
|
}
|
|
2005
1999
|
}
|
|
2006
2000
|
|
|
2007
2001
|
@container (min-width: ${l(it)}) {
|
|
2008
2002
|
.density--dense {
|
|
2009
|
-
--quantic-
|
|
2003
|
+
--quantic-internal-card-carousel-slides-to-show: 6;
|
|
2010
2004
|
}
|
|
2011
2005
|
|
|
2012
2006
|
.density--compact {
|
|
2013
|
-
--quantic-
|
|
2007
|
+
--quantic-internal-card-carousel-slides-to-show: 4;
|
|
2014
2008
|
}
|
|
2015
2009
|
|
|
2016
2010
|
.density--comfortable {
|
|
2017
|
-
--quantic-
|
|
2011
|
+
--quantic-internal-card-carousel-slides-to-show: 3;
|
|
2018
2012
|
}
|
|
2019
2013
|
|
|
2020
2014
|
.density--sparse {
|
|
2021
|
-
--quantic-
|
|
2015
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-5);
|
|
2022
2016
|
}
|
|
2023
2017
|
}
|
|
2024
2018
|
|
|
2025
2019
|
@container (min-width: ${l(nt)}) {
|
|
2026
2020
|
.density--dense {
|
|
2027
|
-
--quantic-
|
|
2021
|
+
--quantic-internal-card-carousel-slides-to-show: 8;
|
|
2028
2022
|
}
|
|
2029
2023
|
|
|
2030
2024
|
.density--compact {
|
|
2031
|
-
--quantic-
|
|
2025
|
+
--quantic-internal-card-carousel-slides-to-show: 5;
|
|
2032
2026
|
}
|
|
2033
2027
|
|
|
2034
2028
|
.density--comfortable {
|
|
2035
|
-
--quantic-
|
|
2036
|
-
--quantic-
|
|
2029
|
+
--quantic-internal-card-carousel-slides-to-show: 3;
|
|
2030
|
+
--quantic-internal-card-carousel-gap: var(--quantic-spacing-5);
|
|
2037
2031
|
}
|
|
2038
2032
|
}
|
|
2039
2033
|
|
|
2040
2034
|
@container (min-width: ${l(ot)}) {
|
|
2041
2035
|
.density--dense {
|
|
2042
|
-
--quantic-
|
|
2036
|
+
--quantic-internal-card-carousel-slides-to-show: 10;
|
|
2043
2037
|
}
|
|
2044
2038
|
|
|
2045
2039
|
.density--compact {
|
|
2046
|
-
--quantic-
|
|
2040
|
+
--quantic-internal-card-carousel-slides-to-show: 6;
|
|
2047
2041
|
}
|
|
2048
2042
|
|
|
2049
2043
|
.density--comfortable {
|
|
2050
|
-
--quantic-
|
|
2044
|
+
--quantic-internal-card-carousel-slides-to-show: 4;
|
|
2051
2045
|
}
|
|
2052
2046
|
}
|
|
2053
2047
|
|
|
@@ -2269,15 +2263,15 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
2269
2263
|
:host {
|
|
2270
2264
|
display: inline-block;
|
|
2271
2265
|
width: 100%;
|
|
2272
|
-
--quantic-
|
|
2266
|
+
--quantic-internal-code-input-font-size: var(
|
|
2273
2267
|
--quantic-font-size-body-md
|
|
2274
2268
|
);
|
|
2275
|
-
--quantic-
|
|
2269
|
+
--quantic-internal-code-input-line-height: var(
|
|
2276
2270
|
--quantic-line-height-body
|
|
2277
2271
|
);
|
|
2278
|
-
--quantic-
|
|
2279
|
-
--quantic-
|
|
2280
|
-
--quantic-
|
|
2272
|
+
--quantic-internal-code-input-padding-block: var(--quantic-spacing-md);
|
|
2273
|
+
--quantic-internal-code-input-padding-inline: var(--quantic-spacing-3);
|
|
2274
|
+
--quantic-internal-code-input-line-numbers-width: var(
|
|
2281
2275
|
--quantic-spacing-6
|
|
2282
2276
|
);
|
|
2283
2277
|
--quantic-component-code-input-border-width: 1px;
|
|
@@ -2345,59 +2339,59 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
2345
2339
|
}
|
|
2346
2340
|
|
|
2347
2341
|
.main.size--xs {
|
|
2348
|
-
--quantic-
|
|
2342
|
+
--quantic-internal-code-input-font-size: var(
|
|
2349
2343
|
--quantic-font-size-body-xs
|
|
2350
2344
|
);
|
|
2351
|
-
--quantic-
|
|
2345
|
+
--quantic-internal-code-input-line-height: var(
|
|
2352
2346
|
--quantic-line-height-body-xs
|
|
2353
2347
|
);
|
|
2354
|
-
--quantic-
|
|
2348
|
+
--quantic-internal-code-input-line-numbers-width: var(
|
|
2355
2349
|
--quantic-spacing-5
|
|
2356
2350
|
);
|
|
2357
|
-
--quantic-
|
|
2358
|
-
--quantic-
|
|
2351
|
+
--quantic-internal-code-input-padding-block: var(--quantic-spacing-sm);
|
|
2352
|
+
--quantic-internal-code-input-padding-inline: var(--quantic-spacing-2);
|
|
2359
2353
|
}
|
|
2360
2354
|
|
|
2361
2355
|
.main.size--sm {
|
|
2362
|
-
--quantic-
|
|
2356
|
+
--quantic-internal-code-input-font-size: var(
|
|
2363
2357
|
--quantic-font-size-body-sm
|
|
2364
2358
|
);
|
|
2365
|
-
--quantic-
|
|
2359
|
+
--quantic-internal-code-input-line-height: var(
|
|
2366
2360
|
--quantic-line-height-body-sm
|
|
2367
2361
|
);
|
|
2368
|
-
--quantic-
|
|
2362
|
+
--quantic-internal-code-input-line-numbers-width: var(
|
|
2369
2363
|
--quantic-spacing-6
|
|
2370
2364
|
);
|
|
2371
|
-
--quantic-
|
|
2372
|
-
--quantic-
|
|
2365
|
+
--quantic-internal-code-input-padding-block: var(--quantic-spacing-sm);
|
|
2366
|
+
--quantic-internal-code-input-padding-inline: var(--quantic-spacing-2);
|
|
2373
2367
|
}
|
|
2374
2368
|
|
|
2375
2369
|
.main.size--md {
|
|
2376
|
-
--quantic-
|
|
2370
|
+
--quantic-internal-code-input-font-size: var(
|
|
2377
2371
|
--quantic-font-size-body-md
|
|
2378
2372
|
);
|
|
2379
|
-
--quantic-
|
|
2373
|
+
--quantic-internal-code-input-line-height: var(
|
|
2380
2374
|
--quantic-line-height-body
|
|
2381
2375
|
);
|
|
2382
|
-
--quantic-
|
|
2376
|
+
--quantic-internal-code-input-line-numbers-width: var(
|
|
2383
2377
|
--quantic-spacing-8
|
|
2384
2378
|
);
|
|
2385
|
-
--quantic-
|
|
2386
|
-
--quantic-
|
|
2379
|
+
--quantic-internal-code-input-padding-block: var(--quantic-spacing-md);
|
|
2380
|
+
--quantic-internal-code-input-padding-inline: var(--quantic-spacing-3);
|
|
2387
2381
|
}
|
|
2388
2382
|
|
|
2389
2383
|
.main.size--lg {
|
|
2390
|
-
--quantic-
|
|
2384
|
+
--quantic-internal-code-input-font-size: var(
|
|
2391
2385
|
--quantic-font-size-body-lg
|
|
2392
2386
|
);
|
|
2393
|
-
--quantic-
|
|
2387
|
+
--quantic-internal-code-input-line-height: var(
|
|
2394
2388
|
--quantic-line-height-body
|
|
2395
2389
|
);
|
|
2396
|
-
--quantic-
|
|
2390
|
+
--quantic-internal-code-input-line-numbers-width: var(
|
|
2397
2391
|
--quantic-spacing-10
|
|
2398
2392
|
);
|
|
2399
|
-
--quantic-
|
|
2400
|
-
--quantic-
|
|
2393
|
+
--quantic-internal-code-input-padding-block: var(--quantic-spacing-3);
|
|
2394
|
+
--quantic-internal-code-input-padding-inline: var(--quantic-spacing-4);
|
|
2401
2395
|
}
|
|
2402
2396
|
|
|
2403
2397
|
.line-numbers {
|
|
@@ -2405,7 +2399,7 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
2405
2399
|
top: 0;
|
|
2406
2400
|
left: 0;
|
|
2407
2401
|
bottom: 0;
|
|
2408
|
-
width: var(--quantic-component-code-input-line-numbers-width, 2.5rem);
|
|
2402
|
+
width: var(--quantic-component-code-input-line-numbers-width, var(--quantic-internal-code-input-line-numbers-width, 2.5rem));
|
|
2409
2403
|
display: flex;
|
|
2410
2404
|
flex-direction: column;
|
|
2411
2405
|
align-items: flex-end;
|
|
@@ -2414,8 +2408,8 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
2414
2408
|
background-color: var(--quantic-bg-secondary);
|
|
2415
2409
|
color: var(--quantic-color-gray-dark-mode-600);
|
|
2416
2410
|
font-family: var(--quantic-font-family-mono);
|
|
2417
|
-
font-size: var(--quantic-component-code-input-font-size);
|
|
2418
|
-
line-height: var(--quantic-component-code-input-line-height);
|
|
2411
|
+
font-size: var(--quantic-component-code-input-font-size, var(--quantic-internal-code-input-font-size));
|
|
2412
|
+
line-height: var(--quantic-component-code-input-line-height, var(--quantic-internal-code-input-line-height));
|
|
2419
2413
|
user-select: none;
|
|
2420
2414
|
border-right: 1px solid var(--quantic-color-gray-dark-mode-800);
|
|
2421
2415
|
}
|
|
@@ -2432,11 +2426,11 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
2432
2426
|
background: transparent;
|
|
2433
2427
|
outline: none;
|
|
2434
2428
|
color: var(--quantic-text-primary);
|
|
2435
|
-
padding: var(--quantic-component-code-input-padding-block)
|
|
2436
|
-
var(--quantic-component-code-input-padding-inline);
|
|
2429
|
+
padding: var(--quantic-component-code-input-padding-block, var(--quantic-internal-code-input-padding-block))
|
|
2430
|
+
var(--quantic-component-code-input-padding-inline, var(--quantic-internal-code-input-padding-inline));
|
|
2437
2431
|
font-family: var(--quantic-font-family-mono);
|
|
2438
|
-
font-size: var(--quantic-component-code-input-font-size);
|
|
2439
|
-
line-height: var(--quantic-component-code-input-line-height);
|
|
2432
|
+
font-size: var(--quantic-component-code-input-font-size, var(--quantic-internal-code-input-font-size));
|
|
2433
|
+
line-height: var(--quantic-component-code-input-line-height, var(--quantic-internal-code-input-line-height));
|
|
2440
2434
|
resize: none;
|
|
2441
2435
|
overflow-y: auto;
|
|
2442
2436
|
overflow-x: auto;
|
|
@@ -2447,7 +2441,7 @@ function rn({context:e}){return(t,i)=>{const n=new WeakMap;if("object"==typeof i
|
|
|
2447
2441
|
|
|
2448
2442
|
.has-line-numbers .textarea {
|
|
2449
2443
|
--padding-left: calc(
|
|
2450
|
-
var(--quantic-component-code-input-line-numbers-width) + 2em
|
|
2444
|
+
var(--quantic-component-code-input-line-numbers-width, var(--quantic-internal-code-input-line-numbers-width)) + 2em
|
|
2451
2445
|
);
|
|
2452
2446
|
padding: var(--quantic-spacing-md) var(--quantic-spacing-3)
|
|
2453
2447
|
var(--quantic-spacing-md) var(--padding-left);
|
|
@@ -2900,9 +2894,9 @@ function Kn(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=Array(t);i<t;
|
|
|
2900
2894
|
--quantic-component-dialog-bg: var(--quantic-bg-primary);
|
|
2901
2895
|
--quantic-component-dialog-border-color: var(--quantic-border-secondary);
|
|
2902
2896
|
--quantic-component-dialog-border-radius: var(--quantic-radius-lg);
|
|
2903
|
-
--quantic-
|
|
2904
|
-
--quantic-
|
|
2905
|
-
--quantic-
|
|
2897
|
+
--quantic-internal-dialog-padding-inline: var(--quantic-spacing-6);
|
|
2898
|
+
--quantic-internal-dialog-padding-block: var(--quantic-spacing-6);
|
|
2899
|
+
--quantic-internal-dialog-gap: var(--quantic-spacing-5);
|
|
2906
2900
|
--quantic-component-dialog-max-width-sm: var(--quantic-width-xs);
|
|
2907
2901
|
--quantic-component-dialog-max-width-md: var(--quantic-width-md);
|
|
2908
2902
|
--quantic-component-dialog-max-width-lg: var(--quantic-width-lg);
|
|
@@ -2937,7 +2931,7 @@ function Kn(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=Array(t);i<t;
|
|
|
2937
2931
|
.main {
|
|
2938
2932
|
position: relative;
|
|
2939
2933
|
display: flex;
|
|
2940
|
-
gap: var(--quantic-component-dialog-gap);
|
|
2934
|
+
gap: var(--quantic-component-dialog-gap, var(--quantic-internal-dialog-gap));
|
|
2941
2935
|
flex-direction: column;
|
|
2942
2936
|
container-name: box-container;
|
|
2943
2937
|
container-type: inline-size;
|
|
@@ -2948,7 +2942,7 @@ function Kn(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=Array(t);i<t;
|
|
|
2948
2942
|
border-radius: var(--quantic-component-dialog-border-radius);
|
|
2949
2943
|
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.07);
|
|
2950
2944
|
box-sizing: border-box;
|
|
2951
|
-
padding-block: var(--quantic-component-dialog-padding-block);
|
|
2945
|
+
padding-block: var(--quantic-component-dialog-padding-block, var(--quantic-internal-dialog-padding-block));
|
|
2952
2946
|
transform: scale(0.95);
|
|
2953
2947
|
transition: transform var(--quantic-transition-duration-normal, 0.2s)
|
|
2954
2948
|
var(--quantic-transition-timing-ease, ease-in-out);
|
|
@@ -2960,30 +2954,30 @@ function Kn(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=Array(t);i<t;
|
|
|
2960
2954
|
|
|
2961
2955
|
.size--sm {
|
|
2962
2956
|
max-width: var(--quantic-component-dialog-max-width-sm);
|
|
2963
|
-
--quantic-
|
|
2964
|
-
--quantic-
|
|
2965
|
-
--quantic-
|
|
2957
|
+
--quantic-internal-dialog-padding-inline: var(--quantic-spacing-4);
|
|
2958
|
+
--quantic-internal-dialog-padding-block: var(--quantic-spacing-4);
|
|
2959
|
+
--quantic-internal-dialog-gap: var(--quantic-spacing-3);
|
|
2966
2960
|
}
|
|
2967
2961
|
|
|
2968
2962
|
.size--md {
|
|
2969
2963
|
max-width: var(--quantic-component-dialog-max-width-md);
|
|
2970
|
-
--quantic-
|
|
2971
|
-
--quantic-
|
|
2972
|
-
--quantic-
|
|
2964
|
+
--quantic-internal-dialog-padding-inline: var(--quantic-spacing-6);
|
|
2965
|
+
--quantic-internal-dialog-padding-block: var(--quantic-spacing-6);
|
|
2966
|
+
--quantic-internal-dialog-gap: var(--quantic-spacing-4);
|
|
2973
2967
|
}
|
|
2974
2968
|
|
|
2975
2969
|
.size--lg {
|
|
2976
2970
|
max-width: var(--quantic-component-dialog-max-width-lg);
|
|
2977
|
-
--quantic-
|
|
2978
|
-
--quantic-
|
|
2979
|
-
--quantic-
|
|
2971
|
+
--quantic-internal-dialog-padding-inline: var(--quantic-spacing-6);
|
|
2972
|
+
--quantic-internal-dialog-padding-block: var(--quantic-spacing-6);
|
|
2973
|
+
--quantic-internal-dialog-gap: var(--quantic-spacing-5);
|
|
2980
2974
|
}
|
|
2981
2975
|
|
|
2982
2976
|
.size--xl {
|
|
2983
2977
|
max-width: var(--quantic-component-dialog-max-width-xl);
|
|
2984
|
-
--quantic-
|
|
2985
|
-
--quantic-
|
|
2986
|
-
--quantic-
|
|
2978
|
+
--quantic-internal-dialog-padding-inline: var(--quantic-spacing-8);
|
|
2979
|
+
--quantic-internal-dialog-padding-block: var(--quantic-spacing-8);
|
|
2980
|
+
--quantic-internal-dialog-gap: var(--quantic-spacing-6);
|
|
2987
2981
|
}
|
|
2988
2982
|
|
|
2989
2983
|
.close-button {
|
|
@@ -3006,7 +3000,7 @@ function Kn(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=Array(t);i<t;
|
|
|
3006
3000
|
.body,
|
|
3007
3001
|
.footer {
|
|
3008
3002
|
display: block;
|
|
3009
|
-
padding-inline: var(--quantic-component-dialog-padding-inline);
|
|
3003
|
+
padding-inline: var(--quantic-component-dialog-padding-inline, var(--quantic-internal-dialog-padding-inline));
|
|
3010
3004
|
}
|
|
3011
3005
|
|
|
3012
3006
|
.body {
|
|
@@ -3360,20 +3354,20 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3360
3354
|
width: 100%;
|
|
3361
3355
|
padding: var(
|
|
3362
3356
|
--quantic-component-dropdown-menu-item-padding-block,
|
|
3363
|
-
var(--quantic-spacing-2)
|
|
3357
|
+
var(--quantic-internal-dropdown-menu-item-padding-block, var(--quantic-spacing-2))
|
|
3364
3358
|
)
|
|
3365
3359
|
var(
|
|
3366
3360
|
--quantic-component-dropdown-menu-item-padding-inline,
|
|
3367
|
-
var(--quantic-spacing-3)
|
|
3361
|
+
var(--quantic-internal-dropdown-menu-item-padding-inline, var(--quantic-spacing-3))
|
|
3368
3362
|
);
|
|
3369
3363
|
font-family: var(--quantic-font-family-body);
|
|
3370
3364
|
font-size: var(
|
|
3371
3365
|
--quantic-component-dropdown-menu-item-font-size,
|
|
3372
|
-
var(--quantic-font-size-body-sm)
|
|
3366
|
+
var(--quantic-internal-dropdown-menu-item-font-size, var(--quantic-font-size-body-sm))
|
|
3373
3367
|
);
|
|
3374
3368
|
line-height: var(
|
|
3375
3369
|
--quantic-component-dropdown-menu-item-line-height,
|
|
3376
|
-
var(--quantic-line-height-body-sm)
|
|
3370
|
+
var(--quantic-internal-dropdown-menu-item-line-height, var(--quantic-line-height-body-sm))
|
|
3377
3371
|
);
|
|
3378
3372
|
color: var(--quantic-text-primary);
|
|
3379
3373
|
background: none;
|
|
@@ -3417,76 +3411,76 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3417
3411
|
|
|
3418
3412
|
/* Size variants */
|
|
3419
3413
|
.size--xs {
|
|
3420
|
-
--quantic-
|
|
3414
|
+
--quantic-internal-dropdown-menu-item-padding-block: var(
|
|
3421
3415
|
--quantic-spacing-1
|
|
3422
3416
|
);
|
|
3423
|
-
--quantic-
|
|
3417
|
+
--quantic-internal-dropdown-menu-item-padding-inline: var(
|
|
3424
3418
|
--quantic-spacing-1-5
|
|
3425
3419
|
);
|
|
3426
|
-
--quantic-
|
|
3420
|
+
--quantic-internal-dropdown-menu-item-font-size: var(
|
|
3427
3421
|
--quantic-font-size-body-xs
|
|
3428
3422
|
);
|
|
3429
|
-
--quantic-
|
|
3423
|
+
--quantic-internal-dropdown-menu-item-line-height: var(
|
|
3430
3424
|
--quantic-line-height-body-xs
|
|
3431
3425
|
);
|
|
3432
3426
|
}
|
|
3433
3427
|
|
|
3434
3428
|
.size--sm {
|
|
3435
|
-
--quantic-
|
|
3429
|
+
--quantic-internal-dropdown-menu-item-padding-block: var(
|
|
3436
3430
|
--quantic-spacing-1-5
|
|
3437
3431
|
);
|
|
3438
|
-
--quantic-
|
|
3432
|
+
--quantic-internal-dropdown-menu-item-padding-inline: var(
|
|
3439
3433
|
--quantic-spacing-2
|
|
3440
3434
|
);
|
|
3441
|
-
--quantic-
|
|
3435
|
+
--quantic-internal-dropdown-menu-item-font-size: var(
|
|
3442
3436
|
--quantic-font-size-body-sm
|
|
3443
3437
|
);
|
|
3444
|
-
--quantic-
|
|
3438
|
+
--quantic-internal-dropdown-menu-item-line-height: var(
|
|
3445
3439
|
--quantic-line-height-body-sm
|
|
3446
3440
|
);
|
|
3447
3441
|
}
|
|
3448
3442
|
|
|
3449
3443
|
.size--md {
|
|
3450
|
-
--quantic-
|
|
3444
|
+
--quantic-internal-dropdown-menu-item-padding-block: var(
|
|
3451
3445
|
--quantic-spacing-2
|
|
3452
3446
|
);
|
|
3453
|
-
--quantic-
|
|
3447
|
+
--quantic-internal-dropdown-menu-item-padding-inline: var(
|
|
3454
3448
|
--quantic-spacing-3
|
|
3455
3449
|
);
|
|
3456
|
-
--quantic-
|
|
3450
|
+
--quantic-internal-dropdown-menu-item-font-size: var(
|
|
3457
3451
|
--quantic-font-size-body-md
|
|
3458
3452
|
);
|
|
3459
|
-
--quantic-
|
|
3453
|
+
--quantic-internal-dropdown-menu-item-line-height: var(
|
|
3460
3454
|
--quantic-line-height-body-md
|
|
3461
3455
|
);
|
|
3462
3456
|
}
|
|
3463
3457
|
|
|
3464
3458
|
.size--lg {
|
|
3465
|
-
--quantic-
|
|
3459
|
+
--quantic-internal-dropdown-menu-item-padding-block: var(
|
|
3466
3460
|
--quantic-spacing-3
|
|
3467
3461
|
);
|
|
3468
|
-
--quantic-
|
|
3462
|
+
--quantic-internal-dropdown-menu-item-padding-inline: var(
|
|
3469
3463
|
--quantic-spacing-4
|
|
3470
3464
|
);
|
|
3471
|
-
--quantic-
|
|
3465
|
+
--quantic-internal-dropdown-menu-item-font-size: var(
|
|
3472
3466
|
--quantic-font-size-body-lg
|
|
3473
3467
|
);
|
|
3474
|
-
--quantic-
|
|
3468
|
+
--quantic-internal-dropdown-menu-item-line-height: var(
|
|
3475
3469
|
--quantic-line-height-body-lg
|
|
3476
3470
|
);
|
|
3477
3471
|
}
|
|
3478
3472
|
|
|
3479
3473
|
.size--xl {
|
|
3480
|
-
--quantic-
|
|
3474
|
+
--quantic-internal-dropdown-menu-item-padding-block: var(
|
|
3481
3475
|
--quantic-spacing-3
|
|
3482
3476
|
);
|
|
3483
|
-
--quantic-
|
|
3477
|
+
--quantic-internal-dropdown-menu-item-padding-inline: var(
|
|
3484
3478
|
--quantic-spacing-5
|
|
3485
3479
|
);
|
|
3486
|
-
--quantic-
|
|
3480
|
+
--quantic-internal-dropdown-menu-item-font-size: var(
|
|
3487
3481
|
--quantic-font-size-body-xl
|
|
3488
3482
|
);
|
|
3489
|
-
--quantic-
|
|
3483
|
+
--quantic-internal-dropdown-menu-item-line-height: var(
|
|
3490
3484
|
--quantic-line-height-body-xl
|
|
3491
3485
|
);
|
|
3492
3486
|
}
|
|
@@ -3605,25 +3599,25 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3605
3599
|
display: block;
|
|
3606
3600
|
font-family: var(--quantic-font-family-body);
|
|
3607
3601
|
|
|
3608
|
-
--quantic-
|
|
3602
|
+
--quantic-internal-field-label-font-size: var(
|
|
3609
3603
|
--quantic-font-size-body-md
|
|
3610
3604
|
);
|
|
3611
|
-
--quantic-
|
|
3605
|
+
--quantic-internal-field-label-line-height: var(
|
|
3612
3606
|
--quantic-line-height-body-md
|
|
3613
3607
|
);
|
|
3614
|
-
--quantic-
|
|
3608
|
+
--quantic-internal-field-hint-font-size: var(
|
|
3615
3609
|
--quantic-font-size-body-sm
|
|
3616
3610
|
);
|
|
3617
|
-
--quantic-
|
|
3611
|
+
--quantic-internal-field-hint-line-height: var(
|
|
3618
3612
|
--quantic-line-height-body-sm
|
|
3619
3613
|
);
|
|
3620
|
-
--quantic-
|
|
3614
|
+
--quantic-internal-field-gap: var(--quantic-spacing-2);
|
|
3621
3615
|
}
|
|
3622
3616
|
|
|
3623
3617
|
.main {
|
|
3624
3618
|
display: flex;
|
|
3625
3619
|
flex-direction: column;
|
|
3626
|
-
gap: var(--quantic-component-field-gap);
|
|
3620
|
+
gap: var(--quantic-component-field-gap, var(--quantic-internal-field-gap));
|
|
3627
3621
|
}
|
|
3628
3622
|
|
|
3629
3623
|
.required-indicator {
|
|
@@ -3632,16 +3626,16 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3632
3626
|
}
|
|
3633
3627
|
|
|
3634
3628
|
.label {
|
|
3635
|
-
font-size: var(--quantic-component-field-label-font-size);
|
|
3636
|
-
line-height: var(--quantic-component-field-label-line-height);
|
|
3629
|
+
font-size: var(--quantic-component-field-label-font-size, var(--quantic-internal-field-label-font-size));
|
|
3630
|
+
line-height: var(--quantic-component-field-label-line-height, var(--quantic-internal-field-label-line-height));
|
|
3637
3631
|
font-weight: var(--quantic-font-weight-medium);
|
|
3638
3632
|
color: var(--quantic-text-primary);
|
|
3639
3633
|
}
|
|
3640
3634
|
|
|
3641
3635
|
.hint,
|
|
3642
3636
|
.message {
|
|
3643
|
-
font-size: var(--quantic-component-field-hint-font-size);
|
|
3644
|
-
line-height: var(--quantic-component-field-hint-line-height);
|
|
3637
|
+
font-size: var(--quantic-component-field-hint-font-size, var(--quantic-internal-field-hint-font-size));
|
|
3638
|
+
line-height: var(--quantic-component-field-hint-line-height, var(--quantic-internal-field-hint-line-height));
|
|
3645
3639
|
color: var(--quantic-text-secondary);
|
|
3646
3640
|
}
|
|
3647
3641
|
|
|
@@ -3651,74 +3645,74 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3651
3645
|
}
|
|
3652
3646
|
|
|
3653
3647
|
.size--xs {
|
|
3654
|
-
--quantic-
|
|
3648
|
+
--quantic-internal-field-label-font-size: var(
|
|
3655
3649
|
--quantic-font-size-body-xs
|
|
3656
3650
|
);
|
|
3657
|
-
--quantic-
|
|
3651
|
+
--quantic-internal-field-label-line-height: var(
|
|
3658
3652
|
--quantic-line-height-body-xs
|
|
3659
3653
|
);
|
|
3660
|
-
--quantic-
|
|
3654
|
+
--quantic-internal-field-hint-font-size: var(
|
|
3661
3655
|
--quantic-font-size-body-xs
|
|
3662
3656
|
);
|
|
3663
|
-
--quantic-
|
|
3657
|
+
--quantic-internal-field-hint-line-height: var(
|
|
3664
3658
|
--quantic-line-height-body-xs
|
|
3665
3659
|
);
|
|
3666
|
-
--quantic-
|
|
3660
|
+
--quantic-internal-field-gap: var(--quantic-spacing-1-5);
|
|
3667
3661
|
}
|
|
3668
3662
|
|
|
3669
3663
|
.size--sm {
|
|
3670
|
-
--quantic-
|
|
3664
|
+
--quantic-internal-field-label-font-size: var(
|
|
3671
3665
|
--quantic-font-size-body-sm
|
|
3672
3666
|
);
|
|
3673
|
-
--quantic-
|
|
3667
|
+
--quantic-internal-field-label-line-height: var(
|
|
3674
3668
|
--quantic-line-height-body-sm
|
|
3675
3669
|
);
|
|
3676
|
-
--quantic-
|
|
3670
|
+
--quantic-internal-field-hint-font-size: var(
|
|
3677
3671
|
--quantic-font-size-body-xs
|
|
3678
3672
|
);
|
|
3679
|
-
--quantic-
|
|
3673
|
+
--quantic-internal-field-hint-line-height: var(
|
|
3680
3674
|
--quantic-line-height-body-xs
|
|
3681
3675
|
);
|
|
3682
|
-
--quantic-
|
|
3676
|
+
--quantic-internal-field-gap: var(--quantic-spacing-2);
|
|
3683
3677
|
}
|
|
3684
3678
|
|
|
3685
3679
|
.size--md {
|
|
3686
|
-
--quantic-
|
|
3680
|
+
--quantic-internal-field-label-font-size: var(
|
|
3687
3681
|
--quantic-font-size-body-md
|
|
3688
3682
|
);
|
|
3689
|
-
--quantic-
|
|
3683
|
+
--quantic-internal-field-label-line-height: var(
|
|
3690
3684
|
--quantic-line-height-body-md
|
|
3691
3685
|
);
|
|
3692
|
-
--quantic-
|
|
3686
|
+
--quantic-internal-field-hint-font-size: var(
|
|
3693
3687
|
--quantic-font-size-body-sm
|
|
3694
3688
|
);
|
|
3695
|
-
--quantic-
|
|
3689
|
+
--quantic-internal-field-hint-line-height: var(
|
|
3696
3690
|
--quantic-line-height-body-sm
|
|
3697
3691
|
);
|
|
3698
|
-
--quantic-
|
|
3692
|
+
--quantic-internal-field-gap: var(--quantic-spacing-2);
|
|
3699
3693
|
}
|
|
3700
3694
|
|
|
3701
3695
|
.size--lg {
|
|
3702
|
-
--quantic-
|
|
3696
|
+
--quantic-internal-field-label-font-size: var(
|
|
3703
3697
|
--quantic-font-size-body-lg
|
|
3704
3698
|
);
|
|
3705
|
-
--quantic-
|
|
3699
|
+
--quantic-internal-field-label-line-height: var(
|
|
3706
3700
|
--quantic-line-height-body-lg
|
|
3707
3701
|
);
|
|
3708
|
-
--quantic-
|
|
3702
|
+
--quantic-internal-field-hint-font-size: var(
|
|
3709
3703
|
--quantic-font-size-body-md
|
|
3710
3704
|
);
|
|
3711
|
-
--quantic-
|
|
3705
|
+
--quantic-internal-field-hint-line-height: var(
|
|
3712
3706
|
--quantic-line-height-body-md
|
|
3713
3707
|
);
|
|
3714
|
-
--quantic-
|
|
3708
|
+
--quantic-internal-field-gap: var(--quantic-spacing-2);
|
|
3715
3709
|
}
|
|
3716
3710
|
|
|
3717
3711
|
.control {
|
|
3718
3712
|
flex: 1;
|
|
3719
3713
|
display: flex;
|
|
3720
3714
|
flex-direction: column;
|
|
3721
|
-
gap: var(--quantic-component-field-gap);
|
|
3715
|
+
gap: var(--quantic-component-field-gap, var(--quantic-internal-field-gap));
|
|
3722
3716
|
}
|
|
3723
3717
|
|
|
3724
3718
|
.message--state-error {
|
|
@@ -3756,34 +3750,34 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3756
3750
|
display: block;
|
|
3757
3751
|
font-family: var(--quantic-font-family-body);
|
|
3758
3752
|
|
|
3759
|
-
--quantic-
|
|
3760
|
-
--quantic-
|
|
3753
|
+
--quantic-internal-field-group-gap: var(--quantic-spacing-4);
|
|
3754
|
+
--quantic-internal-field-group-grid-max-size: 300px;
|
|
3761
3755
|
}
|
|
3762
3756
|
|
|
3763
3757
|
.field-group {
|
|
3764
3758
|
display: flex;
|
|
3765
3759
|
flex-direction: column;
|
|
3766
|
-
gap: var(--quantic-component-field-group-gap);
|
|
3760
|
+
gap: var(--quantic-component-field-group-gap, var(--quantic-internal-field-group-gap));
|
|
3767
3761
|
}
|
|
3768
3762
|
|
|
3769
3763
|
.size--xs {
|
|
3770
|
-
--quantic-
|
|
3771
|
-
--quantic-
|
|
3764
|
+
--quantic-internal-field-group-gap: var(--quantic-spacing-1);
|
|
3765
|
+
--quantic-internal-field-group-grid-max-size: 180px;
|
|
3772
3766
|
}
|
|
3773
3767
|
|
|
3774
3768
|
.size--sm {
|
|
3775
|
-
--quantic-
|
|
3776
|
-
--quantic-
|
|
3769
|
+
--quantic-internal-field-group-gap: var(--quantic-spacing-2);
|
|
3770
|
+
--quantic-internal-field-group-grid-max-size: 240px;
|
|
3777
3771
|
}
|
|
3778
3772
|
|
|
3779
3773
|
.size--md {
|
|
3780
|
-
--quantic-
|
|
3781
|
-
--quantic-
|
|
3774
|
+
--quantic-internal-field-group-gap: var(--quantic-spacing-4);
|
|
3775
|
+
--quantic-internal-field-group-grid-max-size: 300px;
|
|
3782
3776
|
}
|
|
3783
3777
|
|
|
3784
3778
|
.size--lg {
|
|
3785
|
-
--quantic-
|
|
3786
|
-
--quantic-
|
|
3779
|
+
--quantic-internal-field-group-gap: var(--quantic-spacing-6);
|
|
3780
|
+
--quantic-internal-field-group-grid-max-size: 360px;
|
|
3787
3781
|
}
|
|
3788
3782
|
|
|
3789
3783
|
.layout--grid {
|
|
@@ -3791,7 +3785,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3791
3785
|
grid-template-columns: repeat(
|
|
3792
3786
|
var(--quantic-component-field-group-columns, auto-fit),
|
|
3793
3787
|
minmax(
|
|
3794
|
-
min(var(--quantic-component-field-group-grid-max-size), 100%),
|
|
3788
|
+
min(var(--quantic-component-field-group-grid-max-size, var(--quantic-internal-field-group-grid-max-size)), 100%),
|
|
3795
3789
|
1fr
|
|
3796
3790
|
)
|
|
3797
3791
|
);
|
|
@@ -3799,7 +3793,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3799
3793
|
|
|
3800
3794
|
.layout--grid.fixed-columns {
|
|
3801
3795
|
grid-template-columns: repeat(
|
|
3802
|
-
var(--quantic-component-field-group-columns),
|
|
3796
|
+
var(--quantic-component-field-group-columns, 1),
|
|
3803
3797
|
minmax(0, 1fr)
|
|
3804
3798
|
);
|
|
3805
3799
|
}
|
|
@@ -3935,8 +3929,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3935
3929
|
display: inline-block;
|
|
3936
3930
|
width: 100%;
|
|
3937
3931
|
|
|
3938
|
-
--quantic-
|
|
3939
|
-
--quantic-
|
|
3932
|
+
--quantic-internal-text-input-padding-inline: var(--quantic-spacing-3);
|
|
3933
|
+
--quantic-internal-text-input-padding-block: var(--quantic-spacing-md);
|
|
3940
3934
|
--quantic-component-text-input-bg: var(--quantic-bg-primary);
|
|
3941
3935
|
--quantic-component-text-input-color: var(--quantic-text-primary);
|
|
3942
3936
|
}
|
|
@@ -3953,8 +3947,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3953
3947
|
border-radius: var(--quantic-component-text-input-border-radius, var(--quantic-radius-sm));
|
|
3954
3948
|
color: var(--quantic-component-text-input-color);
|
|
3955
3949
|
background-color: var(--quantic-component-text-input-bg);
|
|
3956
|
-
padding: var(--quantic-component-text-input-padding-block)
|
|
3957
|
-
var(--quantic-component-text-input-padding-inline);
|
|
3950
|
+
padding: var(--quantic-component-text-input-padding-block, var(--quantic-internal-text-input-padding-block))
|
|
3951
|
+
var(--quantic-component-text-input-padding-inline, var(--quantic-internal-text-input-padding-inline));
|
|
3958
3952
|
transition:
|
|
3959
3953
|
border-color 0.2s ease-in-out,
|
|
3960
3954
|
box-shadow 0.2s ease-in-out;
|
|
@@ -3974,14 +3968,14 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3974
3968
|
|
|
3975
3969
|
.main.size--xs {
|
|
3976
3970
|
font-size: 13px;
|
|
3977
|
-
--quantic-
|
|
3978
|
-
--quantic-
|
|
3971
|
+
--quantic-internal-text-input-padding-inline: var(--quantic-spacing-2);
|
|
3972
|
+
--quantic-internal-text-input-padding-block: var(--quantic-spacing-xxs);
|
|
3979
3973
|
}
|
|
3980
3974
|
|
|
3981
3975
|
.main.size--sm {
|
|
3982
3976
|
font-size: var(--quantic-font-size-body-sm);
|
|
3983
|
-
--quantic-
|
|
3984
|
-
--quantic-
|
|
3977
|
+
--quantic-internal-text-input-padding-inline: var(--quantic-spacing-2);
|
|
3978
|
+
--quantic-internal-text-input-padding-block: var(--quantic-spacing-sm);
|
|
3985
3979
|
}
|
|
3986
3980
|
|
|
3987
3981
|
.main.size--md {
|
|
@@ -3990,8 +3984,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
3990
3984
|
|
|
3991
3985
|
.main.size--lg {
|
|
3992
3986
|
font-size: var(--quantic-font-size-body-lg);
|
|
3993
|
-
--quantic-
|
|
3994
|
-
--quantic-
|
|
3987
|
+
--quantic-internal-text-input-padding-inline: var(--quantic-spacing-4);
|
|
3988
|
+
--quantic-internal-text-input-padding-block: var(--quantic-spacing-3);
|
|
3995
3989
|
}
|
|
3996
3990
|
|
|
3997
3991
|
.input {
|
|
@@ -4135,9 +4129,9 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
4135
4129
|
border-radius: var(--quantic-component-select-border-radius, var(--quantic-radius-sm));
|
|
4136
4130
|
padding: var(
|
|
4137
4131
|
--quantic-component-select-padding-block,
|
|
4138
|
-
var(--quantic-spacing-md)
|
|
4132
|
+
var(--quantic-internal-select-padding-block, var(--quantic-spacing-md))
|
|
4139
4133
|
)
|
|
4140
|
-
var(--quantic-component-select-padding-inline, var(--quantic-spacing-3));
|
|
4134
|
+
var(--quantic-component-select-padding-inline, var(--quantic-internal-select-padding-inline, var(--quantic-spacing-3)));
|
|
4141
4135
|
font-size: var(
|
|
4142
4136
|
--quantic-component-select-font-size,
|
|
4143
4137
|
var(--quantic-font-size-body-md)
|
|
@@ -4164,14 +4158,14 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
4164
4158
|
|
|
4165
4159
|
.main.size--xs {
|
|
4166
4160
|
font-size: 13px;
|
|
4167
|
-
--quantic-
|
|
4168
|
-
--quantic-
|
|
4161
|
+
--quantic-internal-select-padding-inline: var(--quantic-spacing-2);
|
|
4162
|
+
--quantic-internal-select-padding-block: var(--quantic-spacing-xxs);
|
|
4169
4163
|
}
|
|
4170
4164
|
|
|
4171
4165
|
.main.size--sm {
|
|
4172
4166
|
font-size: var(--quantic-font-size-body-sm);
|
|
4173
|
-
--quantic-
|
|
4174
|
-
--quantic-
|
|
4167
|
+
--quantic-internal-select-padding-inline: var(--quantic-spacing-2);
|
|
4168
|
+
--quantic-internal-select-padding-block: var(--quantic-spacing-sm);
|
|
4175
4169
|
}
|
|
4176
4170
|
|
|
4177
4171
|
.main.size--md {
|
|
@@ -4180,8 +4174,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
4180
4174
|
|
|
4181
4175
|
.main.size--lg {
|
|
4182
4176
|
font-size: var(--quantic-font-size-body-lg);
|
|
4183
|
-
--quantic-
|
|
4184
|
-
--quantic-
|
|
4177
|
+
--quantic-internal-select-padding-inline: var(--quantic-spacing-4);
|
|
4178
|
+
--quantic-internal-select-padding-block: var(--quantic-spacing-3);
|
|
4185
4179
|
}
|
|
4186
4180
|
|
|
4187
4181
|
select {
|
|
@@ -4766,78 +4760,78 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
4766
4760
|
display: block;
|
|
4767
4761
|
font-family: var(--quantic-font-family-body);
|
|
4768
4762
|
|
|
4769
|
-
--quantic-
|
|
4763
|
+
--quantic-internal-fieldset-legend-font-size: var(
|
|
4770
4764
|
--quantic-font-size-body-lg
|
|
4771
4765
|
);
|
|
4772
|
-
--quantic-
|
|
4766
|
+
--quantic-internal-fieldset-legend-line-height: var(
|
|
4773
4767
|
--quantic-line-height-body-md
|
|
4774
4768
|
);
|
|
4775
|
-
--quantic-
|
|
4776
|
-
--quantic-
|
|
4769
|
+
--quantic-internal-fieldset-padding: var(--quantic-spacing-5);
|
|
4770
|
+
--quantic-internal-fieldset-border: 1px solid
|
|
4777
4771
|
var(--quantic-border-secondary);
|
|
4778
|
-
--quantic-
|
|
4772
|
+
--quantic-internal-fieldset-gap: var(--quantic-spacing-4);
|
|
4779
4773
|
--quantic-component-fieldset-border-radius: var(--quantic-radius-md);
|
|
4780
4774
|
}
|
|
4781
4775
|
|
|
4782
4776
|
.fieldset {
|
|
4783
|
-
border: var(--quantic-component-fieldset-border);
|
|
4777
|
+
border: var(--quantic-component-fieldset-border, var(--quantic-internal-fieldset-border));
|
|
4784
4778
|
border-radius: var(--quantic-component-fieldset-border-radius);
|
|
4785
|
-
padding: var(--quantic-component-fieldset-padding);
|
|
4779
|
+
padding: var(--quantic-component-fieldset-padding, var(--quantic-internal-fieldset-padding));
|
|
4786
4780
|
padding-bottom: calc(
|
|
4787
|
-
var(--quantic-component-fieldset-padding) +
|
|
4788
|
-
var(--quantic-component-fieldset-gap) / 2
|
|
4781
|
+
var(--quantic-component-fieldset-padding, var(--quantic-internal-fieldset-padding)) +
|
|
4782
|
+
var(--quantic-component-fieldset-gap, var(--quantic-internal-fieldset-gap)) / 2
|
|
4789
4783
|
);
|
|
4790
4784
|
margin: 0;
|
|
4791
4785
|
display: flex;
|
|
4792
4786
|
flex-direction: column;
|
|
4793
|
-
gap: var(--quantic-component-fieldset-gap);
|
|
4787
|
+
gap: var(--quantic-component-fieldset-gap, var(--quantic-internal-fieldset-gap));
|
|
4794
4788
|
}
|
|
4795
4789
|
|
|
4796
4790
|
.size--sm {
|
|
4797
|
-
--quantic-
|
|
4798
|
-
--quantic-
|
|
4799
|
-
--quantic-
|
|
4791
|
+
--quantic-internal-fieldset-padding: var(--quantic-spacing-3);
|
|
4792
|
+
--quantic-internal-fieldset-gap: var(--quantic-spacing-2);
|
|
4793
|
+
--quantic-internal-fieldset-legend-font-size: var(
|
|
4800
4794
|
--quantic-font-size-body-md
|
|
4801
4795
|
);
|
|
4802
|
-
--quantic-
|
|
4796
|
+
--quantic-internal-fieldset-legend-line-height: var(
|
|
4803
4797
|
--quantic-line-height-body-sm
|
|
4804
4798
|
);
|
|
4805
4799
|
}
|
|
4806
4800
|
|
|
4807
4801
|
.size--md {
|
|
4808
|
-
--quantic-
|
|
4809
|
-
--quantic-
|
|
4810
|
-
--quantic-
|
|
4802
|
+
--quantic-internal-fieldset-padding: var(--quantic-spacing-5);
|
|
4803
|
+
--quantic-internal-fieldset-gap: var(--quantic-spacing-4);
|
|
4804
|
+
--quantic-internal-fieldset-legend-font-size: var(
|
|
4811
4805
|
--quantic-font-size-body-lg
|
|
4812
4806
|
);
|
|
4813
|
-
--quantic-
|
|
4807
|
+
--quantic-internal-fieldset-legend-line-height: var(
|
|
4814
4808
|
--quantic-line-height-body-md
|
|
4815
4809
|
);
|
|
4816
4810
|
}
|
|
4817
4811
|
|
|
4818
4812
|
.size--lg {
|
|
4819
|
-
--quantic-
|
|
4820
|
-
--quantic-
|
|
4821
|
-
--quantic-
|
|
4813
|
+
--quantic-internal-fieldset-padding: var(--quantic-spacing-6);
|
|
4814
|
+
--quantic-internal-fieldset-gap: var(--quantic-spacing-5);
|
|
4815
|
+
--quantic-internal-fieldset-legend-font-size: var(
|
|
4822
4816
|
--quantic-font-size-body-lg
|
|
4823
4817
|
);
|
|
4824
|
-
--quantic-
|
|
4818
|
+
--quantic-internal-fieldset-legend-line-height: var(
|
|
4825
4819
|
--quantic-line-height-body-lg
|
|
4826
4820
|
);
|
|
4827
4821
|
}
|
|
4828
4822
|
|
|
4829
4823
|
.variant--bare {
|
|
4830
|
-
--quantic-
|
|
4831
|
-
--quantic-
|
|
4824
|
+
--quantic-internal-fieldset-padding: 0;
|
|
4825
|
+
--quantic-internal-fieldset-border: none;
|
|
4832
4826
|
}
|
|
4833
4827
|
|
|
4834
4828
|
.header {
|
|
4835
4829
|
display: flex;
|
|
4836
4830
|
flex-direction: column;
|
|
4837
4831
|
gap: var(--quantic-spacing-1);
|
|
4838
|
-
font-size: var(--quantic-component-fieldset-legend-font-size);
|
|
4839
|
-
line-height: var(--quantic-component-fieldset-legend-line-height);
|
|
4840
|
-
margin-bottom: var(--quantic-component-fieldset-gap);
|
|
4832
|
+
font-size: var(--quantic-component-fieldset-legend-font-size, var(--quantic-internal-fieldset-legend-font-size));
|
|
4833
|
+
line-height: var(--quantic-component-fieldset-legend-line-height, var(--quantic-internal-fieldset-legend-line-height));
|
|
4834
|
+
margin-bottom: var(--quantic-component-fieldset-gap, var(--quantic-internal-fieldset-gap));
|
|
4841
4835
|
}
|
|
4842
4836
|
|
|
4843
4837
|
.legend {
|
|
@@ -36830,8 +36824,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
36830
36824
|
display: inline-block;
|
|
36831
36825
|
width: 100%;
|
|
36832
36826
|
|
|
36833
|
-
--quantic-
|
|
36834
|
-
--quantic-
|
|
36827
|
+
--quantic-internal-number-input-padding-inline: var(--quantic-spacing-3);
|
|
36828
|
+
--quantic-internal-number-input-padding-block: var(--quantic-spacing-md);
|
|
36835
36829
|
--quantic-component-number-input-bg: var(--quantic-bg-primary);
|
|
36836
36830
|
--quantic-component-number-input-color: var(--quantic-text-primary);
|
|
36837
36831
|
}
|
|
@@ -36848,12 +36842,13 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
36848
36842
|
border-radius: var(--quantic-component-number-input-border-radius, var(--quantic-radius-sm));
|
|
36849
36843
|
color: var(--quantic-component-number-input-color);
|
|
36850
36844
|
background-color: var(--quantic-component-number-input-bg);
|
|
36851
|
-
padding-block: var(--quantic-component-number-input-padding-block);
|
|
36845
|
+
padding-block: var(--quantic-component-number-input-padding-block, var(--quantic-internal-number-input-padding-block));
|
|
36852
36846
|
padding-inline-start: var(
|
|
36853
|
-
--quantic-component-number-input-padding-inline
|
|
36854
|
-
)
|
|
36847
|
+
--quantic-component-number-input-padding-inline,
|
|
36848
|
+
var(--quantic-internal-number-input-padding-inline)
|
|
36849
|
+
);
|
|
36855
36850
|
padding-inline-end: calc(
|
|
36856
|
-
var(--quantic-component-number-input-padding-inline) + var(--quantic-spacing-6)
|
|
36851
|
+
var(--quantic-component-number-input-padding-inline, var(--quantic-internal-number-input-padding-inline)) + var(--quantic-spacing-6)
|
|
36857
36852
|
);
|
|
36858
36853
|
transition:
|
|
36859
36854
|
border-color 0.2s ease-in-out,
|
|
@@ -36874,30 +36869,30 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
36874
36869
|
|
|
36875
36870
|
.main.size--xs {
|
|
36876
36871
|
font-size: 13px;
|
|
36877
|
-
--quantic-
|
|
36878
|
-
--quantic-
|
|
36872
|
+
--quantic-internal-number-input-padding-inline: var(--quantic-spacing-2);
|
|
36873
|
+
--quantic-internal-number-input-padding-block: var(
|
|
36879
36874
|
--quantic-spacing-xxs
|
|
36880
36875
|
);
|
|
36881
|
-
--quantic-
|
|
36876
|
+
--quantic-internal-number-input-icon-size: var(--quantic-spacing-3);
|
|
36882
36877
|
}
|
|
36883
36878
|
|
|
36884
36879
|
.main.size--sm {
|
|
36885
36880
|
font-size: var(--quantic-font-size-body-sm);
|
|
36886
|
-
--quantic-
|
|
36887
|
-
--quantic-
|
|
36888
|
-
--quantic-
|
|
36881
|
+
--quantic-internal-number-input-padding-inline: var(--quantic-spacing-2);
|
|
36882
|
+
--quantic-internal-number-input-padding-block: var(--quantic-spacing-sm);
|
|
36883
|
+
--quantic-internal-number-input-icon-size: var(--quantic-spacing-4);
|
|
36889
36884
|
}
|
|
36890
36885
|
|
|
36891
36886
|
.main.size--md {
|
|
36892
36887
|
font-size: var(--quantic-font-size-body-md);
|
|
36893
|
-
--quantic-
|
|
36888
|
+
--quantic-internal-number-input-icon-size: var(--quantic-spacing-4);
|
|
36894
36889
|
}
|
|
36895
36890
|
|
|
36896
36891
|
.main.size--lg {
|
|
36897
36892
|
font-size: var(--quantic-font-size-body-lg);
|
|
36898
|
-
--quantic-
|
|
36899
|
-
--quantic-
|
|
36900
|
-
--quantic-
|
|
36893
|
+
--quantic-internal-number-input-padding-inline: var(--quantic-spacing-4);
|
|
36894
|
+
--quantic-internal-number-input-padding-block: var(--quantic-spacing-3);
|
|
36895
|
+
--quantic-internal-number-input-icon-size: var(--quantic-spacing-5);
|
|
36901
36896
|
}
|
|
36902
36897
|
|
|
36903
36898
|
.input {
|
|
@@ -36953,7 +36948,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
36953
36948
|
|
|
36954
36949
|
quantic-icon-lucide-chevron-up,
|
|
36955
36950
|
quantic-icon-lucide-chevron-down {
|
|
36956
|
-
--icon-size: var(--quantic-component-number-input-icon-size);
|
|
36951
|
+
--icon-size: var(--quantic-component-number-input-icon-size, var(--quantic-internal-number-input-icon-size));
|
|
36957
36952
|
}
|
|
36958
36953
|
|
|
36959
36954
|
slot[name='prefix'] {
|
|
@@ -37056,7 +37051,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
37056
37051
|
display: flex;
|
|
37057
37052
|
height: 100%;
|
|
37058
37053
|
flex-direction: column;
|
|
37059
|
-
color: var(--quantic-component-log-output-fg);
|
|
37054
|
+
color: var(--quantic-component-log-output-fg, inherit);
|
|
37060
37055
|
font-family: var(
|
|
37061
37056
|
--quantic-component-log-output-font-family,
|
|
37062
37057
|
var(--quantic-font-family-mono)
|
|
@@ -37245,6 +37240,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
37245
37240
|
font-size: var(--quantic-font-size-body-lg);
|
|
37246
37241
|
color: var(--quantic-component-navbar-menu-item-color);
|
|
37247
37242
|
background: none;
|
|
37243
|
+
background-color: var(--quantic-component-navbar-menu-item-bg);
|
|
37248
37244
|
border: none;
|
|
37249
37245
|
cursor: pointer;
|
|
37250
37246
|
border-radius: var(--quantic-radius-md);
|
|
@@ -37494,6 +37490,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
37494
37490
|
);
|
|
37495
37491
|
padding-inline: var(--quantic-component-layout-aside-padding-inline);
|
|
37496
37492
|
padding-block: var(--quantic-component-layout-aside-padding-block);
|
|
37493
|
+
background-color: var(--quantic-component-layout-aside-bg);
|
|
37497
37494
|
border-right: 1px solid var(--quantic-component-layout-aside-border);
|
|
37498
37495
|
overflow: visible;
|
|
37499
37496
|
display: none;
|
|
@@ -37763,7 +37760,6 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
37763
37760
|
--quantic-component-tooltip-font-size: var(--quantic-font-size-body-sm);
|
|
37764
37761
|
--quantic-component-tooltip-line-height: var(--quantic-line-height-body-sm);
|
|
37765
37762
|
--quantic-component-tooltip-z-index: 9999;
|
|
37766
|
-
--quantic-component-tooltip-offset: 20px;
|
|
37767
37763
|
--quantic-component-tooltip-arrow-size: var(--quantic-spacing-2);
|
|
37768
37764
|
}
|
|
37769
37765
|
|
|
@@ -37822,6 +37818,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
37822
37818
|
font-weight: var(--quantic-font-weight-medium);
|
|
37823
37819
|
color: var(--quantic-component-sidebar-menu-item-color);
|
|
37824
37820
|
background: none;
|
|
37821
|
+
background-color: var(--quantic-component-sidebar-menu-item-bg);
|
|
37825
37822
|
border: none;
|
|
37826
37823
|
text-align: left;
|
|
37827
37824
|
cursor: pointer;
|
|
@@ -38112,13 +38109,13 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38112
38109
|
font-family: var(--quantic-font-family-body);
|
|
38113
38110
|
color: var(--quantic-text-secondary);
|
|
38114
38111
|
|
|
38115
|
-
--quantic-
|
|
38116
|
-
--quantic-
|
|
38117
|
-
--quantic-
|
|
38118
|
-
--quantic-
|
|
38112
|
+
--quantic-internal-option-card-padding: var(--quantic-spacing-5);
|
|
38113
|
+
--quantic-internal-option-card-radius: var(--quantic-radius-md);
|
|
38114
|
+
--quantic-internal-option-card-spacing: var(--quantic-spacing-3);
|
|
38115
|
+
--quantic-internal-option-card-font-size: var(
|
|
38119
38116
|
--quantic-font-size-body-md
|
|
38120
38117
|
);
|
|
38121
|
-
--quantic-
|
|
38118
|
+
--quantic-internal-option-card-line-height: var(
|
|
38122
38119
|
--quantic-line-height-body-md
|
|
38123
38120
|
);
|
|
38124
38121
|
}
|
|
@@ -38127,13 +38124,13 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38127
38124
|
position: relative;
|
|
38128
38125
|
display: flex;
|
|
38129
38126
|
flex-direction: column;
|
|
38130
|
-
gap: var(--quantic-component-option-card-spacing);
|
|
38131
|
-
padding: var(--quantic-component-option-card-padding);
|
|
38132
|
-
border-radius: var(--quantic-component-option-card-radius);
|
|
38127
|
+
gap: var(--quantic-component-option-card-spacing, var(--quantic-internal-option-card-spacing));
|
|
38128
|
+
padding: var(--quantic-component-option-card-padding, var(--quantic-internal-option-card-padding));
|
|
38129
|
+
border-radius: var(--quantic-component-option-card-radius, var(--quantic-internal-option-card-radius));
|
|
38133
38130
|
border: 2px solid var(--quantic-border-secondary);
|
|
38134
38131
|
background-color: transparent;
|
|
38135
|
-
font-size: var(--quantic-component-option-card-font-size);
|
|
38136
|
-
line-height: var(--quantic-component-option-card-line-height);
|
|
38132
|
+
font-size: var(--quantic-component-option-card-font-size, var(--quantic-internal-option-card-font-size));
|
|
38133
|
+
line-height: var(--quantic-component-option-card-line-height, var(--quantic-internal-option-card-line-height));
|
|
38137
38134
|
cursor: pointer;
|
|
38138
38135
|
user-select: none;
|
|
38139
38136
|
transition:
|
|
@@ -38151,37 +38148,37 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38151
38148
|
|
|
38152
38149
|
/* Size variants */
|
|
38153
38150
|
.size--sm {
|
|
38154
|
-
--quantic-
|
|
38155
|
-
--quantic-
|
|
38156
|
-
--quantic-
|
|
38157
|
-
--quantic-
|
|
38151
|
+
--quantic-internal-option-card-padding: var(--quantic-spacing-4);
|
|
38152
|
+
--quantic-internal-option-card-spacing: var(--quantic-spacing-2);
|
|
38153
|
+
--quantic-internal-option-card-radius: var(--quantic-radius-sm);
|
|
38154
|
+
--quantic-internal-option-card-font-size: var(
|
|
38158
38155
|
--quantic-font-size-body-sm
|
|
38159
38156
|
);
|
|
38160
|
-
--quantic-
|
|
38157
|
+
--quantic-internal-option-card-line-height: var(
|
|
38161
38158
|
--quantic-line-height-body-sm
|
|
38162
38159
|
);
|
|
38163
38160
|
}
|
|
38164
38161
|
|
|
38165
38162
|
.size--md {
|
|
38166
|
-
--quantic-
|
|
38167
|
-
--quantic-
|
|
38168
|
-
--quantic-
|
|
38169
|
-
--quantic-
|
|
38163
|
+
--quantic-internal-option-card-padding: var(--quantic-spacing-5);
|
|
38164
|
+
--quantic-internal-option-card-spacing: var(--quantic-spacing-3);
|
|
38165
|
+
--quantic-internal-option-card-radius: var(--quantic-radius-md);
|
|
38166
|
+
--quantic-internal-option-card-font-size: var(
|
|
38170
38167
|
--quantic-font-size-body-md
|
|
38171
38168
|
);
|
|
38172
|
-
--quantic-
|
|
38169
|
+
--quantic-internal-option-card-line-height: var(
|
|
38173
38170
|
--quantic-line-height-body-md
|
|
38174
38171
|
);
|
|
38175
38172
|
}
|
|
38176
38173
|
|
|
38177
38174
|
.size--lg {
|
|
38178
|
-
--quantic-
|
|
38179
|
-
--quantic-
|
|
38180
|
-
--quantic-
|
|
38181
|
-
--quantic-
|
|
38175
|
+
--quantic-internal-option-card-padding: var(--quantic-spacing-6);
|
|
38176
|
+
--quantic-internal-option-card-spacing: var(--quantic-spacing-4);
|
|
38177
|
+
--quantic-internal-option-card-radius: var(--quantic-radius-lg);
|
|
38178
|
+
--quantic-internal-option-card-font-size: var(
|
|
38182
38179
|
--quantic-font-size-body-lg
|
|
38183
38180
|
);
|
|
38184
|
-
--quantic-
|
|
38181
|
+
--quantic-internal-option-card-line-height: var(
|
|
38185
38182
|
--quantic-line-height-body-lg
|
|
38186
38183
|
);
|
|
38187
38184
|
}
|
|
@@ -38231,7 +38228,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38231
38228
|
position: absolute;
|
|
38232
38229
|
inset: 0;
|
|
38233
38230
|
opacity: 0;
|
|
38234
|
-
border-radius: calc(var(--quantic-component-option-card-radius) + 4px);
|
|
38231
|
+
border-radius: calc(var(--quantic-component-option-card-radius, var(--quantic-internal-option-card-radius)) + 4px);
|
|
38235
38232
|
border: 2px solid transparent;
|
|
38236
38233
|
transition: all 0.2s ease-in-out;
|
|
38237
38234
|
pointer-events: none;
|
|
@@ -38255,7 +38252,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38255
38252
|
display: flex;
|
|
38256
38253
|
align-items: flex-start;
|
|
38257
38254
|
justify-content: space-between;
|
|
38258
|
-
gap: var(--quantic-component-option-card-spacing);
|
|
38255
|
+
gap: var(--quantic-component-option-card-spacing, var(--quantic-internal-option-card-spacing));
|
|
38259
38256
|
}
|
|
38260
38257
|
|
|
38261
38258
|
.indicator {
|
|
@@ -38452,7 +38449,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38452
38449
|
font-family: var(--quantic-font-family-body);
|
|
38453
38450
|
color: var(--quantic-text-secondary);
|
|
38454
38451
|
|
|
38455
|
-
--quantic-
|
|
38452
|
+
--quantic-internal-panel-padding: var(--quantic-spacing-6);
|
|
38456
38453
|
--quantic-component-panel-font-size: var(--quantic-font-size-body-md);
|
|
38457
38454
|
--quantic-component-panel-line-height: var(--quantic-line-height-body-md);
|
|
38458
38455
|
--quantic-component-panel-radius: var(--quantic-radius-md);
|
|
@@ -38464,7 +38461,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38464
38461
|
display: flex;
|
|
38465
38462
|
flex-direction: column;
|
|
38466
38463
|
gap: var(--quantic-component-panel-spacing);
|
|
38467
|
-
padding: var(--quantic-component-panel-padding);
|
|
38464
|
+
padding: var(--quantic-component-panel-padding, var(--quantic-internal-panel-padding));
|
|
38468
38465
|
border-radius: var(--quantic-component-panel-radius);
|
|
38469
38466
|
border: 1px solid var(--quantic-border-primary);
|
|
38470
38467
|
font-size: var(--quantic-component-panel-font-size);
|
|
@@ -38486,7 +38483,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38486
38483
|
.variant--ghost {
|
|
38487
38484
|
background-color: transparent;
|
|
38488
38485
|
border: none;
|
|
38489
|
-
--quantic-
|
|
38486
|
+
--quantic-internal-panel-padding: 0;
|
|
38490
38487
|
}
|
|
38491
38488
|
|
|
38492
38489
|
.highlighted {
|
|
@@ -38585,31 +38582,34 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38585
38582
|
.group {
|
|
38586
38583
|
display: flex;
|
|
38587
38584
|
flex-direction: column;
|
|
38588
|
-
gap: var(
|
|
38585
|
+
gap: var(
|
|
38586
|
+
--quantic-component-panel-group-gap,
|
|
38587
|
+
var(--quantic-internal-panel-group-gap, var(--quantic-spacing-6))
|
|
38588
|
+
);
|
|
38589
38589
|
}
|
|
38590
38590
|
|
|
38591
38591
|
.gap--none {
|
|
38592
|
-
--quantic-
|
|
38592
|
+
--quantic-internal-panel-group-gap: 0;
|
|
38593
38593
|
}
|
|
38594
38594
|
|
|
38595
38595
|
.gap--xs {
|
|
38596
|
-
--quantic-
|
|
38596
|
+
--quantic-internal-panel-group-gap: var(--quantic-spacing-3);
|
|
38597
38597
|
}
|
|
38598
38598
|
|
|
38599
38599
|
.gap--sm {
|
|
38600
|
-
--quantic-
|
|
38600
|
+
--quantic-internal-panel-group-gap: var(--quantic-spacing-4);
|
|
38601
38601
|
}
|
|
38602
38602
|
|
|
38603
38603
|
.gap--md {
|
|
38604
|
-
--quantic-
|
|
38604
|
+
--quantic-internal-panel-group-gap: var(--quantic-spacing-6);
|
|
38605
38605
|
}
|
|
38606
38606
|
|
|
38607
38607
|
.gap--lg {
|
|
38608
|
-
--quantic-
|
|
38608
|
+
--quantic-internal-panel-group-gap: var(--quantic-spacing-8);
|
|
38609
38609
|
}
|
|
38610
38610
|
|
|
38611
38611
|
.gap--xl {
|
|
38612
|
-
--quantic-
|
|
38612
|
+
--quantic-internal-panel-group-gap: var(--quantic-spacing-12);
|
|
38613
38613
|
}
|
|
38614
38614
|
`,t([fe({type:"PanelGroupGap",options:Object.values(e.PanelGroupGap),default:e.PanelGroupGap.Medium,description:"Spacing between stacked panels."})],e.PanelGroup.prototype,"gap",void 0),e.PanelGroup=t([Se("quantic-panel-group")],e.PanelGroup);const as={ExtraSmall:"xs",Small:"sm",Medium:"md",Large:"lg"},ls=Je;e.Progress=class extends qe{constructor(){super(...arguments),this.size=as.Small,this.label=!1,this.color=ls.Brand,this.ariaLabel=null,this.description=null}get indeterminate(){return void 0===this.value}get clamped(){if(!this.indeterminate)return st(this.value,0,100)}updated(e){super.updated(e),e.has("value")&&!this.indeterminate&&this.style.setProperty("--quantic-component-progress-value",`${this.clamped}%`)}render(){const{clamped:e,indeterminate:t}=this;return W`
|
|
38615
38615
|
<div
|
|
@@ -38644,37 +38644,37 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38644
38644
|
overflow: hidden;
|
|
38645
38645
|
border-radius: var(--quantic-radius-full);
|
|
38646
38646
|
background-color: var(--quantic-color-gray-dark-mode-700);
|
|
38647
|
-
height: var(--quantic-component-progress-height, 4px);
|
|
38647
|
+
height: var(--quantic-component-progress-height, var(--quantic-internal-progress-height, 4px));
|
|
38648
38648
|
}
|
|
38649
38649
|
|
|
38650
38650
|
.size--xs {
|
|
38651
|
-
--quantic-
|
|
38652
|
-
--quantic-
|
|
38653
|
-
--quantic-
|
|
38651
|
+
--quantic-internal-progress-height: 2px;
|
|
38652
|
+
--quantic-internal-progress-font-size: var(--quantic-font-size-body-xs);
|
|
38653
|
+
--quantic-internal-progress-line-height: var(
|
|
38654
38654
|
--quantic-line-height-body-xs
|
|
38655
38655
|
);
|
|
38656
38656
|
}
|
|
38657
38657
|
|
|
38658
38658
|
.size--sm {
|
|
38659
|
-
--quantic-
|
|
38660
|
-
--quantic-
|
|
38661
|
-
--quantic-
|
|
38659
|
+
--quantic-internal-progress-height: 4px;
|
|
38660
|
+
--quantic-internal-progress-font-size: var(--quantic-font-size-body-sm);
|
|
38661
|
+
--quantic-internal-progress-line-height: var(
|
|
38662
38662
|
--quantic-line-height-body-sm
|
|
38663
38663
|
);
|
|
38664
38664
|
}
|
|
38665
38665
|
|
|
38666
38666
|
.size--md {
|
|
38667
|
-
--quantic-
|
|
38668
|
-
--quantic-
|
|
38669
|
-
--quantic-
|
|
38667
|
+
--quantic-internal-progress-height: 6px;
|
|
38668
|
+
--quantic-internal-progress-font-size: var(--quantic-font-size-body-md);
|
|
38669
|
+
--quantic-internal-progress-line-height: var(
|
|
38670
38670
|
--quantic-line-height-body-md
|
|
38671
38671
|
);
|
|
38672
38672
|
}
|
|
38673
38673
|
|
|
38674
38674
|
.size--lg {
|
|
38675
|
-
--quantic-
|
|
38676
|
-
--quantic-
|
|
38677
|
-
--quantic-
|
|
38675
|
+
--quantic-internal-progress-height: 8px;
|
|
38676
|
+
--quantic-internal-progress-font-size: var(--quantic-font-size-body-lg);
|
|
38677
|
+
--quantic-internal-progress-line-height: var(
|
|
38678
38678
|
--quantic-line-height-body-lg
|
|
38679
38679
|
);
|
|
38680
38680
|
}
|
|
@@ -38702,11 +38702,11 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38702
38702
|
flex-shrink: 0;
|
|
38703
38703
|
font-size: var(
|
|
38704
38704
|
--quantic-component-progress-font-size,
|
|
38705
|
-
var(--quantic-font-size-body-sm)
|
|
38705
|
+
var(--quantic-internal-progress-font-size, var(--quantic-font-size-body-sm))
|
|
38706
38706
|
);
|
|
38707
38707
|
line-height: var(
|
|
38708
38708
|
--quantic-component-progress-line-height,
|
|
38709
|
-
var(--quantic-line-height-body-sm)
|
|
38709
|
+
var(--quantic-internal-progress-line-height, var(--quantic-line-height-body-sm))
|
|
38710
38710
|
);
|
|
38711
38711
|
font-family: var(--quantic-font-family-body);
|
|
38712
38712
|
color: var(--quantic-text-secondary);
|
|
@@ -38872,7 +38872,11 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38872
38872
|
width: 24px;
|
|
38873
38873
|
height: 24px;
|
|
38874
38874
|
border-radius: 50%;
|
|
38875
|
-
border: 3px solid
|
|
38875
|
+
border: 3px solid
|
|
38876
|
+
var(
|
|
38877
|
+
--quantic-component-spinner-color,
|
|
38878
|
+
var(--quantic-internal-spinner-color, currentColor)
|
|
38879
|
+
);
|
|
38876
38880
|
border-top-color: transparent;
|
|
38877
38881
|
}
|
|
38878
38882
|
|
|
@@ -38904,10 +38908,10 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
38904
38908
|
border-width: 0;
|
|
38905
38909
|
}
|
|
38906
38910
|
|
|
38907
|
-
${l(ct(e=>`--quantic-
|
|
38911
|
+
${l(ct(e=>`--quantic-internal-spinner-color: var(--quantic-utility-${e}-500);`))}
|
|
38908
38912
|
|
|
38909
38913
|
.color--brand {
|
|
38910
|
-
--quantic-
|
|
38914
|
+
--quantic-internal-spinner-color: var(--quantic-fg-brand-primary);
|
|
38911
38915
|
}
|
|
38912
38916
|
|
|
38913
38917
|
@keyframes spin {
|
|
@@ -39146,11 +39150,11 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39146
39150
|
display: block;
|
|
39147
39151
|
width: fit-content;
|
|
39148
39152
|
font-family: var(--quantic-font-family-body);
|
|
39149
|
-
font-size: var(--quantic-component-table-font-size);
|
|
39153
|
+
font-size: var(--quantic-component-table-font-size, var(--quantic-internal-table-font-size));
|
|
39150
39154
|
overflow-x: auto;
|
|
39151
39155
|
|
|
39152
|
-
--quantic-
|
|
39153
|
-
--quantic-
|
|
39156
|
+
--quantic-internal-table-padding: var(--quantic-spacing-3);
|
|
39157
|
+
--quantic-internal-table-font-size: var(--quantic-font-size-body-sm);
|
|
39154
39158
|
--quantic-component-table-color: var(--quantic-text-secondary);
|
|
39155
39159
|
--quantic-component-table-header-color: var(--quantic-text-secondary);
|
|
39156
39160
|
--quantic-component-table-border-color: var(--quantic-border-secondary);
|
|
@@ -39167,46 +39171,46 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39167
39171
|
|
|
39168
39172
|
/* Size */
|
|
39169
39173
|
:host([size='xs']) {
|
|
39170
|
-
--quantic-
|
|
39171
|
-
--quantic-
|
|
39174
|
+
--quantic-internal-table-padding: var(--quantic-spacing-3);
|
|
39175
|
+
--quantic-internal-table-font-size: var(--quantic-font-size-body-xs);
|
|
39172
39176
|
}
|
|
39173
39177
|
|
|
39174
39178
|
:host([size='sm']) {
|
|
39175
|
-
--quantic-
|
|
39176
|
-
--quantic-
|
|
39179
|
+
--quantic-internal-table-padding: var(--quantic-spacing-4);
|
|
39180
|
+
--quantic-internal-table-font-size: var(--quantic-font-size-body-sm);
|
|
39177
39181
|
}
|
|
39178
39182
|
|
|
39179
39183
|
:host([size='md']) {
|
|
39180
|
-
--quantic-
|
|
39181
|
-
--quantic-
|
|
39184
|
+
--quantic-internal-table-padding: var(--quantic-spacing-5);
|
|
39185
|
+
--quantic-internal-table-font-size: var(--quantic-font-size-body-md);
|
|
39182
39186
|
}
|
|
39183
39187
|
|
|
39184
39188
|
:host([size='lg']) {
|
|
39185
|
-
--quantic-
|
|
39186
|
-
--quantic-
|
|
39189
|
+
--quantic-internal-table-padding: var(--quantic-spacing-6);
|
|
39190
|
+
--quantic-internal-table-font-size: var(--quantic-font-size-body-md);
|
|
39187
39191
|
}
|
|
39188
39192
|
|
|
39189
39193
|
/* Dense variants - relative to size */
|
|
39190
39194
|
:host([dense][size='xs']) {
|
|
39191
|
-
--quantic-
|
|
39195
|
+
--quantic-internal-table-padding: var(--quantic-spacing-1-5);
|
|
39192
39196
|
}
|
|
39193
39197
|
|
|
39194
39198
|
:host([dense][size='sm']) {
|
|
39195
|
-
--quantic-
|
|
39199
|
+
--quantic-internal-table-padding: var(--quantic-spacing-2);
|
|
39196
39200
|
}
|
|
39197
39201
|
|
|
39198
39202
|
:host([dense][size='md']) {
|
|
39199
|
-
--quantic-
|
|
39203
|
+
--quantic-internal-table-padding: var(--quantic-spacing-2);
|
|
39200
39204
|
}
|
|
39201
39205
|
|
|
39202
39206
|
:host([dense][size='lg']) {
|
|
39203
|
-
--quantic-
|
|
39207
|
+
--quantic-internal-table-padding: var(--quantic-spacing-3);
|
|
39204
39208
|
}
|
|
39205
39209
|
|
|
39206
39210
|
.toolbar,
|
|
39207
39211
|
.controls {
|
|
39208
39212
|
display: block;
|
|
39209
|
-
padding: var(--quantic-component-table-padding);
|
|
39213
|
+
padding: var(--quantic-component-table-padding, var(--quantic-internal-table-padding));
|
|
39210
39214
|
}
|
|
39211
39215
|
|
|
39212
39216
|
.toolbar {
|
|
@@ -39269,7 +39273,7 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39269
39273
|
`:W`<slot></slot>`}},e.TableHead.meta={tag:"quantic-table-head",description:"Individual column header cell within a quantic-table-header row. Renders as a <th> equivalent and supports optional sort controls. Emits sort-change when clicked while sortable.",category:"display",slots:{"":{description:"Column header label text or content."}},relatedTo:["quantic-table-header","quantic-table"]},e.TableHead.styles=d`
|
|
39270
39274
|
:host {
|
|
39271
39275
|
display: table-cell;
|
|
39272
|
-
padding: var(--quantic-component-table-padding);
|
|
39276
|
+
padding: var(--quantic-component-table-padding, var(--quantic-internal-table-padding));
|
|
39273
39277
|
font-weight: var(--quantic-font-weight-semibold);
|
|
39274
39278
|
color: var(--quantic-component-table-header-color);
|
|
39275
39279
|
border-bottom: 1px solid var(--quantic-component-table-border-color);
|
|
@@ -39359,8 +39363,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39359
39363
|
`,t([an({context:Ms,subscribe:!0})],e.TableRow.prototype,"variant",void 0),t([fe({type:"string",default:"row",reflect:!0,description:"ARIA role for the table row."})],e.TableRow.prototype,"role",void 0),e.TableRow=t([Se("quantic-table-row")],e.TableRow),e.TableCell=class extends qe{constructor(){super(...arguments),this.variant=e.TableVariant.Outline,this.role="cell",this.align=e.CellAlign.Left}willUpdate(){this.classList&&this.style&&(Object.entries({"variant--minimal":this.variant===e.TableVariant.Minimal,"variant--outline":this.variant===e.TableVariant.Outline,"variant--striped":this.variant===e.TableVariant.Striped}).forEach(([e,t])=>{this.classList.toggle(e,t)}),this.width&&(this.style.width=this.width),this.style.setProperty("--cell-align",this.align))}render(){return W`<slot></slot>`}},e.TableCell.meta={tag:"quantic-table-cell",description:"Individual data cell within a quantic-table-row. Receives variant context from the parent quantic-table.",category:"display",slots:{"":{description:"Cell content — text, elements, or other components."}},relatedTo:["quantic-table-row","quantic-table"]},e.TableCell.styles=d`
|
|
39360
39364
|
:host {
|
|
39361
39365
|
display: table-cell;
|
|
39362
|
-
padding: var(--quantic-component-table-padding);
|
|
39363
|
-
font-size: var(--quantic-component-table-font-size);
|
|
39366
|
+
padding: var(--quantic-component-table-padding, var(--quantic-internal-table-padding));
|
|
39367
|
+
font-size: var(--quantic-component-table-font-size, var(--quantic-internal-table-font-size));
|
|
39364
39368
|
color: var(--quantic-component-table-color);
|
|
39365
39369
|
vertical-align: middle;
|
|
39366
39370
|
text-align: var(--cell-align, left);
|
|
@@ -39944,8 +39948,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39944
39948
|
display: inline-block;
|
|
39945
39949
|
width: 100%;
|
|
39946
39950
|
|
|
39947
|
-
--quantic-
|
|
39948
|
-
--quantic-
|
|
39951
|
+
--quantic-internal-textarea-padding-inline: var(--quantic-spacing-3);
|
|
39952
|
+
--quantic-internal-textarea-padding-block: var(--quantic-spacing-md);
|
|
39949
39953
|
--quantic-component-textarea-bg: var(--quantic-bg-primary);
|
|
39950
39954
|
--quantic-component-textarea-color: var(--quantic-text-primary);
|
|
39951
39955
|
}
|
|
@@ -39960,8 +39964,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39960
39964
|
border-radius: var(--quantic-component-textarea-border-radius, var(--quantic-radius-sm));
|
|
39961
39965
|
color: var(--quantic-component-textarea-color);
|
|
39962
39966
|
background-color: var(--quantic-component-textarea-bg);
|
|
39963
|
-
padding: var(--quantic-component-textarea-padding-block)
|
|
39964
|
-
var(--quantic-component-textarea-padding-inline);
|
|
39967
|
+
padding: var(--quantic-component-textarea-padding-block, var(--quantic-internal-textarea-padding-block))
|
|
39968
|
+
var(--quantic-component-textarea-padding-inline, var(--quantic-internal-textarea-padding-inline));
|
|
39965
39969
|
transition:
|
|
39966
39970
|
border-color 0.2s ease-in-out,
|
|
39967
39971
|
box-shadow 0.2s ease-in-out;
|
|
@@ -39981,14 +39985,14 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39981
39985
|
|
|
39982
39986
|
.main.size--xs {
|
|
39983
39987
|
font-size: 13px;
|
|
39984
|
-
--quantic-
|
|
39985
|
-
--quantic-
|
|
39988
|
+
--quantic-internal-textarea-padding-inline: var(--quantic-spacing-2);
|
|
39989
|
+
--quantic-internal-textarea-padding-block: var(--quantic-spacing-xxs);
|
|
39986
39990
|
}
|
|
39987
39991
|
|
|
39988
39992
|
.main.size--sm {
|
|
39989
39993
|
font-size: var(--quantic-font-size-body-sm);
|
|
39990
|
-
--quantic-
|
|
39991
|
-
--quantic-
|
|
39994
|
+
--quantic-internal-textarea-padding-inline: var(--quantic-spacing-2);
|
|
39995
|
+
--quantic-internal-textarea-padding-block: var(--quantic-spacing-sm);
|
|
39992
39996
|
}
|
|
39993
39997
|
|
|
39994
39998
|
.main.size--md {
|
|
@@ -39997,8 +40001,8 @@ const mo="important",ko=" !"+mo,yo=Ge(class extends Ze{constructor(e){if(super(e
|
|
|
39997
40001
|
|
|
39998
40002
|
.main.size--lg {
|
|
39999
40003
|
font-size: var(--quantic-font-size-body-lg);
|
|
40000
|
-
--quantic-
|
|
40001
|
-
--quantic-
|
|
40004
|
+
--quantic-internal-textarea-padding-inline: var(--quantic-spacing-4);
|
|
40005
|
+
--quantic-internal-textarea-padding-block: var(--quantic-spacing-3);
|
|
40002
40006
|
}
|
|
40003
40007
|
|
|
40004
40008
|
.input {
|