@x-plat/design-system 0.5.52 → 0.5.53
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/components/ChatInput/index.css +2 -2
- package/dist/components/CheckBox/index.css +8 -2
- package/dist/components/DatePicker/index.css +1 -1
- package/dist/components/Input/index.css +1 -1
- package/dist/components/Radio/index.css +8 -2
- package/dist/components/Select/index.css +3 -2
- package/dist/components/index.css +22 -9
- package/dist/index.css +22 -9
- package/package.json +1 -1
|
@@ -109,8 +109,8 @@
|
|
|
109
109
|
max-height: 200px;
|
|
110
110
|
overflow-y: auto;
|
|
111
111
|
padding: 4px 0;
|
|
112
|
-
font-size:
|
|
113
|
-
line-height:
|
|
112
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
113
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
114
114
|
color: var(--semantic-text-strong);
|
|
115
115
|
background: transparent;
|
|
116
116
|
}
|
|
@@ -24,10 +24,16 @@
|
|
|
24
24
|
height: var(--spacing-space-6);
|
|
25
25
|
}
|
|
26
26
|
.lib-xplat-checkbox.sm > .label {
|
|
27
|
-
font-size:
|
|
27
|
+
font-size: var(--semantic-typo-label-2-m-size);
|
|
28
|
+
line-height: var(--semantic-typo-label-2-m-lh);
|
|
29
|
+
}
|
|
30
|
+
.lib-xplat-checkbox.md > .label {
|
|
31
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
32
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
28
33
|
}
|
|
29
34
|
.lib-xplat-checkbox.lg > .label {
|
|
30
|
-
font-size:
|
|
35
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
36
|
+
line-height: var(--semantic-typo-body-1-m-lh);
|
|
31
37
|
}
|
|
32
38
|
.lib-xplat-checkbox > .checkbox {
|
|
33
39
|
display: flex;
|
|
@@ -193,7 +193,7 @@
|
|
|
193
193
|
color: var(--semantic-text-error);
|
|
194
194
|
}
|
|
195
195
|
.lib-xplat-input-wrap .lib-xplat-input-validation-wrap > .lib-xplat-input-validation > .icon {
|
|
196
|
-
font-size:
|
|
196
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
197
197
|
}
|
|
198
198
|
|
|
199
199
|
/* src/components/Modal/modal.scss */
|
|
@@ -19,12 +19,17 @@
|
|
|
19
19
|
height: var(--spacing-space-2);
|
|
20
20
|
}
|
|
21
21
|
.lib-xplat-radio.sm > span {
|
|
22
|
-
font-size:
|
|
22
|
+
font-size: var(--semantic-typo-label-2-m-size);
|
|
23
|
+
line-height: var(--semantic-typo-label-2-m-lh);
|
|
23
24
|
}
|
|
24
25
|
.lib-xplat-radio.md > .circle {
|
|
25
26
|
width: var(--spacing-space-5);
|
|
26
27
|
height: var(--spacing-space-5);
|
|
27
28
|
}
|
|
29
|
+
.lib-xplat-radio.md > span {
|
|
30
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
31
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
32
|
+
}
|
|
28
33
|
.lib-xplat-radio.lg > .circle {
|
|
29
34
|
width: var(--spacing-space-6);
|
|
30
35
|
height: var(--spacing-space-6);
|
|
@@ -34,7 +39,8 @@
|
|
|
34
39
|
height: var(--spacing-space-4);
|
|
35
40
|
}
|
|
36
41
|
.lib-xplat-radio.lg > span {
|
|
37
|
-
font-size:
|
|
42
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
43
|
+
line-height: var(--semantic-typo-body-1-m-lh);
|
|
38
44
|
}
|
|
39
45
|
.lib-xplat-radio > .circle {
|
|
40
46
|
border: 2px solid var(--semantic-border-strong);
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
transform: rotate(180deg);
|
|
103
103
|
}
|
|
104
104
|
.lib-xplat-select .select-trigger .select-trigger-icon svg {
|
|
105
|
-
font-size:
|
|
105
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
106
106
|
}
|
|
107
107
|
.lib-xplat-select-content {
|
|
108
108
|
position: fixed;
|
|
@@ -141,7 +141,8 @@
|
|
|
141
141
|
}
|
|
142
142
|
.lib-xplat-select-content .select-item {
|
|
143
143
|
padding: var(--spacing-space-2) var(--spacing-space-3);
|
|
144
|
-
font-size:
|
|
144
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
145
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
145
146
|
cursor: pointer;
|
|
146
147
|
transition: background-color 0.15s ease;
|
|
147
148
|
outline: none;
|
|
@@ -2668,8 +2668,8 @@
|
|
|
2668
2668
|
max-height: 200px;
|
|
2669
2669
|
overflow-y: auto;
|
|
2670
2670
|
padding: 4px 0;
|
|
2671
|
-
font-size:
|
|
2672
|
-
line-height:
|
|
2671
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
2672
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
2673
2673
|
color: var(--semantic-text-strong);
|
|
2674
2674
|
background: transparent;
|
|
2675
2675
|
}
|
|
@@ -2707,10 +2707,16 @@
|
|
|
2707
2707
|
height: var(--spacing-space-6);
|
|
2708
2708
|
}
|
|
2709
2709
|
.lib-xplat-checkbox.sm > .label {
|
|
2710
|
-
font-size:
|
|
2710
|
+
font-size: var(--semantic-typo-label-2-m-size);
|
|
2711
|
+
line-height: var(--semantic-typo-label-2-m-lh);
|
|
2712
|
+
}
|
|
2713
|
+
.lib-xplat-checkbox.md > .label {
|
|
2714
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
2715
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
2711
2716
|
}
|
|
2712
2717
|
.lib-xplat-checkbox.lg > .label {
|
|
2713
|
-
font-size:
|
|
2718
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
2719
|
+
line-height: var(--semantic-typo-body-1-m-lh);
|
|
2714
2720
|
}
|
|
2715
2721
|
.lib-xplat-checkbox > .checkbox {
|
|
2716
2722
|
display: flex;
|
|
@@ -2929,7 +2935,7 @@
|
|
|
2929
2935
|
color: var(--semantic-text-error);
|
|
2930
2936
|
}
|
|
2931
2937
|
.lib-xplat-input-wrap .lib-xplat-input-validation-wrap > .lib-xplat-input-validation > .icon {
|
|
2932
|
-
font-size:
|
|
2938
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
2933
2939
|
}
|
|
2934
2940
|
|
|
2935
2941
|
/* src/components/Modal/modal.scss */
|
|
@@ -4096,12 +4102,17 @@
|
|
|
4096
4102
|
height: var(--spacing-space-2);
|
|
4097
4103
|
}
|
|
4098
4104
|
.lib-xplat-radio.sm > span {
|
|
4099
|
-
font-size:
|
|
4105
|
+
font-size: var(--semantic-typo-label-2-m-size);
|
|
4106
|
+
line-height: var(--semantic-typo-label-2-m-lh);
|
|
4100
4107
|
}
|
|
4101
4108
|
.lib-xplat-radio.md > .circle {
|
|
4102
4109
|
width: var(--spacing-space-5);
|
|
4103
4110
|
height: var(--spacing-space-5);
|
|
4104
4111
|
}
|
|
4112
|
+
.lib-xplat-radio.md > span {
|
|
4113
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
4114
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
4115
|
+
}
|
|
4105
4116
|
.lib-xplat-radio.lg > .circle {
|
|
4106
4117
|
width: var(--spacing-space-6);
|
|
4107
4118
|
height: var(--spacing-space-6);
|
|
@@ -4111,7 +4122,8 @@
|
|
|
4111
4122
|
height: var(--spacing-space-4);
|
|
4112
4123
|
}
|
|
4113
4124
|
.lib-xplat-radio.lg > span {
|
|
4114
|
-
font-size:
|
|
4125
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
4126
|
+
line-height: var(--semantic-typo-body-1-m-lh);
|
|
4115
4127
|
}
|
|
4116
4128
|
.lib-xplat-radio > .circle {
|
|
4117
4129
|
border: 2px solid var(--semantic-border-strong);
|
|
@@ -4276,7 +4288,7 @@
|
|
|
4276
4288
|
transform: rotate(180deg);
|
|
4277
4289
|
}
|
|
4278
4290
|
.lib-xplat-select .select-trigger .select-trigger-icon svg {
|
|
4279
|
-
font-size:
|
|
4291
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
4280
4292
|
}
|
|
4281
4293
|
.lib-xplat-select-content {
|
|
4282
4294
|
position: fixed;
|
|
@@ -4315,7 +4327,8 @@
|
|
|
4315
4327
|
}
|
|
4316
4328
|
.lib-xplat-select-content .select-item {
|
|
4317
4329
|
padding: var(--spacing-space-2) var(--spacing-space-3);
|
|
4318
|
-
font-size:
|
|
4330
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
4331
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
4319
4332
|
cursor: pointer;
|
|
4320
4333
|
transition: background-color 0.15s ease;
|
|
4321
4334
|
outline: none;
|
package/dist/index.css
CHANGED
|
@@ -2668,8 +2668,8 @@
|
|
|
2668
2668
|
max-height: 200px;
|
|
2669
2669
|
overflow-y: auto;
|
|
2670
2670
|
padding: 4px 0;
|
|
2671
|
-
font-size:
|
|
2672
|
-
line-height:
|
|
2671
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
2672
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
2673
2673
|
color: var(--semantic-text-strong);
|
|
2674
2674
|
background: transparent;
|
|
2675
2675
|
}
|
|
@@ -2707,10 +2707,16 @@
|
|
|
2707
2707
|
height: var(--spacing-space-6);
|
|
2708
2708
|
}
|
|
2709
2709
|
.lib-xplat-checkbox.sm > .label {
|
|
2710
|
-
font-size:
|
|
2710
|
+
font-size: var(--semantic-typo-label-2-m-size);
|
|
2711
|
+
line-height: var(--semantic-typo-label-2-m-lh);
|
|
2712
|
+
}
|
|
2713
|
+
.lib-xplat-checkbox.md > .label {
|
|
2714
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
2715
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
2711
2716
|
}
|
|
2712
2717
|
.lib-xplat-checkbox.lg > .label {
|
|
2713
|
-
font-size:
|
|
2718
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
2719
|
+
line-height: var(--semantic-typo-body-1-m-lh);
|
|
2714
2720
|
}
|
|
2715
2721
|
.lib-xplat-checkbox > .checkbox {
|
|
2716
2722
|
display: flex;
|
|
@@ -2929,7 +2935,7 @@
|
|
|
2929
2935
|
color: var(--semantic-text-error);
|
|
2930
2936
|
}
|
|
2931
2937
|
.lib-xplat-input-wrap .lib-xplat-input-validation-wrap > .lib-xplat-input-validation > .icon {
|
|
2932
|
-
font-size:
|
|
2938
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
2933
2939
|
}
|
|
2934
2940
|
|
|
2935
2941
|
/* src/components/Modal/modal.scss */
|
|
@@ -4096,12 +4102,17 @@
|
|
|
4096
4102
|
height: var(--spacing-space-2);
|
|
4097
4103
|
}
|
|
4098
4104
|
.lib-xplat-radio.sm > span {
|
|
4099
|
-
font-size:
|
|
4105
|
+
font-size: var(--semantic-typo-label-2-m-size);
|
|
4106
|
+
line-height: var(--semantic-typo-label-2-m-lh);
|
|
4100
4107
|
}
|
|
4101
4108
|
.lib-xplat-radio.md > .circle {
|
|
4102
4109
|
width: var(--spacing-space-5);
|
|
4103
4110
|
height: var(--spacing-space-5);
|
|
4104
4111
|
}
|
|
4112
|
+
.lib-xplat-radio.md > span {
|
|
4113
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
4114
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
4115
|
+
}
|
|
4105
4116
|
.lib-xplat-radio.lg > .circle {
|
|
4106
4117
|
width: var(--spacing-space-6);
|
|
4107
4118
|
height: var(--spacing-space-6);
|
|
@@ -4111,7 +4122,8 @@
|
|
|
4111
4122
|
height: var(--spacing-space-4);
|
|
4112
4123
|
}
|
|
4113
4124
|
.lib-xplat-radio.lg > span {
|
|
4114
|
-
font-size:
|
|
4125
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
4126
|
+
line-height: var(--semantic-typo-body-1-m-lh);
|
|
4115
4127
|
}
|
|
4116
4128
|
.lib-xplat-radio > .circle {
|
|
4117
4129
|
border: 2px solid var(--semantic-border-strong);
|
|
@@ -4276,7 +4288,7 @@
|
|
|
4276
4288
|
transform: rotate(180deg);
|
|
4277
4289
|
}
|
|
4278
4290
|
.lib-xplat-select .select-trigger .select-trigger-icon svg {
|
|
4279
|
-
font-size:
|
|
4291
|
+
font-size: var(--semantic-typo-body-1-m-size);
|
|
4280
4292
|
}
|
|
4281
4293
|
.lib-xplat-select-content {
|
|
4282
4294
|
position: fixed;
|
|
@@ -4315,7 +4327,8 @@
|
|
|
4315
4327
|
}
|
|
4316
4328
|
.lib-xplat-select-content .select-item {
|
|
4317
4329
|
padding: var(--spacing-space-2) var(--spacing-space-3);
|
|
4318
|
-
font-size:
|
|
4330
|
+
font-size: var(--semantic-typo-label-1-m-size);
|
|
4331
|
+
line-height: var(--semantic-typo-label-1-m-lh);
|
|
4319
4332
|
cursor: pointer;
|
|
4320
4333
|
transition: background-color 0.15s ease;
|
|
4321
4334
|
outline: none;
|