vanilla-jui 1.7.34 → 1.7.35
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/index.js +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/style.css +1 -1
- package/package.json +5 -10
- package/src/components/accordion.ts +1 -1
- package/src/css/animation.css +1 -7
- package/src/css/card.css +4 -4
- package/src/css/font.css +6 -3
- package/src/css/gradient.css +128 -63
- package/src/css/icon.css +1 -5
- package/src/css/layout.css +15 -12
- package/src/css/status.css +5 -8
- package/src/css/themes/default/accordion.css +9 -6
- package/src/css/themes/default/avatar.css +3 -4
- package/src/css/themes/default/badge.css +2 -2
- package/src/css/themes/default/breadcrumb.css +11 -12
- package/src/css/themes/default/button.css +6 -14
- package/src/css/themes/default/captcha.css +69 -71
- package/src/css/themes/default/drop.css +1 -1
- package/src/css/themes/default/editor.css +15 -15
- package/src/css/themes/default/flow.css +6 -11
- package/src/css/themes/default/form.css +46 -44
- package/src/css/themes/default/index.css +1 -1
- package/src/css/themes/default/loading.css +62 -47
- package/src/css/themes/default/menu.css +102 -48
- package/src/css/themes/default/modal.css +6 -10
- package/src/css/themes/default/offcanvas.css +12 -13
- package/src/css/themes/default/swiper.css +19 -18
- package/src/css/themes/default/tabs.css +3 -3
- package/src/css/themes/default/theme-palette.css +2 -2
- package/src/css/themes/default/tip.css +6 -8
- package/src/css/themes/default/toast.css +2 -2
- package/src/css/themes/default/toolbar.css +4 -6
- package/src/css/themes/default/tooltip.css +4 -8
- package/src/css/tokens.css +18 -57
- package/src/css/tokens_/345/211/257/346/234/254.css +1 -1
|
@@ -1,24 +1,16 @@
|
|
|
1
1
|
@layer components {
|
|
2
2
|
.j-btn {
|
|
3
3
|
--btn-font-size: var(--font-size-md);
|
|
4
|
-
--btn-fg: inherit;
|
|
5
|
-
--btn-padding: 0 12px;
|
|
6
|
-
--btn-border-color: transparent;
|
|
7
|
-
--btn-radius: var(--radius-md);
|
|
8
|
-
--btn-box-shadow: var(--shadow-xs);
|
|
9
|
-
|
|
10
4
|
gap: 4px;
|
|
11
5
|
font-size: var(--btn-font-size);
|
|
12
6
|
height: var(--btn-height, var(--el-height));
|
|
13
7
|
line-height: 1;
|
|
14
|
-
color: var(--btn-fg);
|
|
8
|
+
color: var(--btn-fg, inherit);
|
|
15
9
|
background-color: var(--btn-bg);
|
|
16
|
-
padding: var(--btn-padding);
|
|
17
|
-
border
|
|
18
|
-
border-
|
|
19
|
-
|
|
20
|
-
border-radius: var(--btn-radius);
|
|
21
|
-
box-shadow: var(--btn-box-shadow);
|
|
10
|
+
padding: var(--btn-padding, 0 12px);
|
|
11
|
+
border: 1px solid var(--btn-border-color, transparent);
|
|
12
|
+
border-radius: var(--btn-radius, var(--radius-md));
|
|
13
|
+
box-shadow: var(--btn-box-shadow, var(--shadow-xs));
|
|
22
14
|
outline: none;
|
|
23
15
|
backdrop-filter: blur(4px);
|
|
24
16
|
|
|
@@ -274,4 +266,4 @@
|
|
|
274
266
|
.j-btns.is-vertical .j-btn:last-child {
|
|
275
267
|
border-bottom-left-radius: var(--btn-radius);
|
|
276
268
|
}
|
|
277
|
-
}
|
|
269
|
+
}
|
|
@@ -1,125 +1,123 @@
|
|
|
1
1
|
/* cap captcha */
|
|
2
2
|
.j-cap-field {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
position: relative;
|
|
4
|
+
width: 100%;
|
|
5
|
+
min-width: 0;
|
|
6
|
+
height: 56px;
|
|
7
7
|
}
|
|
8
8
|
|
|
9
9
|
.j-cap-field .cap-control {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
background-color 150ms,
|
|
28
|
-
border-color 150ms;
|
|
10
|
+
display: flex;
|
|
11
|
+
box-sizing: border-box;
|
|
12
|
+
align-items: center;
|
|
13
|
+
gap: 8px;
|
|
14
|
+
width: 100%;
|
|
15
|
+
height: 100%;
|
|
16
|
+
padding: 8px 12px;
|
|
17
|
+
border: var(--border);
|
|
18
|
+
border-radius: 6px;
|
|
19
|
+
background: var(--ui-bg);
|
|
20
|
+
color: var(--ui-fg);
|
|
21
|
+
font: inherit;
|
|
22
|
+
font-size: var(--font-size-md);
|
|
23
|
+
line-height: 18px;
|
|
24
|
+
text-align: start;
|
|
25
|
+
cursor: pointer;
|
|
26
|
+
transition: all 0.15s ease-in-out;
|
|
29
27
|
}
|
|
30
28
|
|
|
31
29
|
.j-cap-field .cap-control[data-state='idle']:hover {
|
|
32
|
-
|
|
33
|
-
|
|
30
|
+
border-color: var(--tone-border-strong);
|
|
31
|
+
background: var(--tone-soft);
|
|
34
32
|
}
|
|
35
33
|
|
|
36
34
|
.j-cap-field .cap-control:focus-visible {
|
|
37
|
-
|
|
38
|
-
|
|
35
|
+
outline: 2px solid var(--tone-solid);
|
|
36
|
+
outline-offset: 2px;
|
|
39
37
|
}
|
|
40
38
|
|
|
41
39
|
.j-cap-field .cap-control[data-state='loading'],
|
|
42
40
|
.j-cap-field .cap-control[data-state='verifying'] {
|
|
43
|
-
|
|
41
|
+
cursor: wait;
|
|
44
42
|
}
|
|
45
43
|
|
|
46
44
|
.j-cap-field .cap-control[data-state='verified'] {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
45
|
+
border-color: var(--state-success-border);
|
|
46
|
+
background: var(--state-success-subtle);
|
|
47
|
+
color: var(--state-success-text);
|
|
48
|
+
cursor: default;
|
|
51
49
|
}
|
|
52
50
|
|
|
53
51
|
.j-cap-field .cap-control[data-state='error'],
|
|
54
52
|
.j-cap-field .cap-control[data-state='rate-limited'] {
|
|
55
|
-
|
|
56
|
-
|
|
53
|
+
border-color: var(--state-error-border);
|
|
54
|
+
color: var(--state-error-text);
|
|
57
55
|
}
|
|
58
56
|
|
|
59
57
|
.j-cap-field .cap-control-icon,
|
|
60
|
-
.j-cap-field .cap-control-icon>svg,
|
|
58
|
+
.j-cap-field .cap-control-icon > svg,
|
|
61
59
|
.j-cap-field .cap-control-box {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
60
|
+
display: block;
|
|
61
|
+
width: 20px;
|
|
62
|
+
height: 20px;
|
|
65
63
|
}
|
|
66
64
|
|
|
67
65
|
.j-cap-field .cap-control-icon {
|
|
68
|
-
|
|
69
|
-
|
|
66
|
+
flex: 0 0 20px;
|
|
67
|
+
color: var(--tone-text);
|
|
70
68
|
}
|
|
71
69
|
|
|
72
70
|
.j-cap-field .cap-control[data-state='verified'] .cap-control-icon,
|
|
73
71
|
.j-cap-field .cap-control[data-state='error'] .cap-control-icon,
|
|
74
72
|
.j-cap-field .cap-control[data-state='rate-limited'] .cap-control-icon {
|
|
75
|
-
|
|
73
|
+
color: inherit;
|
|
76
74
|
}
|
|
77
75
|
|
|
78
76
|
.j-cap-field .cap-control-box {
|
|
79
|
-
|
|
80
|
-
|
|
77
|
+
border: 1.5px solid var(--ui-border);
|
|
78
|
+
border-radius: 4px;
|
|
81
79
|
}
|
|
82
80
|
|
|
83
81
|
.j-cap-field .cap-control-label {
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
82
|
+
flex: 1 1 0;
|
|
83
|
+
min-width: 0;
|
|
84
|
+
overflow-wrap: anywhere;
|
|
87
85
|
}
|
|
88
86
|
|
|
89
87
|
.j-cap-field .cap-control-percent {
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
88
|
+
flex: 0 0 4ch;
|
|
89
|
+
white-space: nowrap;
|
|
90
|
+
color: var(--tone-caption);
|
|
91
|
+
font-size: 12px;
|
|
92
|
+
font-variant-numeric: tabular-nums;
|
|
93
|
+
text-align: end;
|
|
96
94
|
}
|
|
97
95
|
|
|
98
96
|
.j-cap-field .cap-progress {
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
97
|
+
position: absolute;
|
|
98
|
+
inset: auto 1px 1px;
|
|
99
|
+
height: 2px;
|
|
100
|
+
overflow: hidden;
|
|
101
|
+
border-radius: 0 0 5px 5px;
|
|
102
|
+
pointer-events: none;
|
|
105
103
|
}
|
|
106
104
|
|
|
107
|
-
.j-cap-field .cap-progress>span {
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
105
|
+
.j-cap-field .cap-progress > span {
|
|
106
|
+
display: block;
|
|
107
|
+
height: 100%;
|
|
108
|
+
background: var(--tone-solid);
|
|
111
109
|
}
|
|
112
110
|
|
|
113
111
|
.j-cap-field .cap-spinner {
|
|
114
|
-
|
|
112
|
+
animation: animate-spin 800ms linear infinite;
|
|
115
113
|
}
|
|
116
114
|
|
|
117
115
|
@media (prefers-reduced-motion: reduce) {
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
}
|
|
116
|
+
.j-cap-field .cap-control {
|
|
117
|
+
transition: none;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.j-cap-field .cap-spinner {
|
|
121
|
+
animation: none;
|
|
122
|
+
}
|
|
123
|
+
}
|
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
margin: var(--editor-p-space) 0;
|
|
143
143
|
}
|
|
144
144
|
|
|
145
|
-
.j-editor>div {
|
|
145
|
+
.j-editor > div {
|
|
146
146
|
margin: var(--editor-block-space) 0;
|
|
147
147
|
}
|
|
148
148
|
|
|
@@ -342,7 +342,7 @@
|
|
|
342
342
|
display: flex;
|
|
343
343
|
}
|
|
344
344
|
|
|
345
|
-
.j-editor ul[data-type='taskList'] li>label {
|
|
345
|
+
.j-editor ul[data-type='taskList'] li > label {
|
|
346
346
|
flex: none;
|
|
347
347
|
user-select: none;
|
|
348
348
|
}
|
|
@@ -356,7 +356,7 @@
|
|
|
356
356
|
}
|
|
357
357
|
|
|
358
358
|
.j-editor input[type='checkbox'] {
|
|
359
|
-
border:
|
|
359
|
+
border: var(--border);
|
|
360
360
|
border-radius: var(--checkbox-radius, var(--radius-sm));
|
|
361
361
|
background: var(--ui-bg);
|
|
362
362
|
clear: none;
|
|
@@ -394,11 +394,11 @@
|
|
|
394
394
|
color: var(--tone-subtitle);
|
|
395
395
|
}
|
|
396
396
|
|
|
397
|
-
.j-editor blockquote
|
|
397
|
+
.j-editor blockquote > * {
|
|
398
398
|
margin: 0;
|
|
399
399
|
}
|
|
400
400
|
|
|
401
|
-
.j-editor blockquote
|
|
401
|
+
.j-editor blockquote > * + * {
|
|
402
402
|
margin-top: 4px;
|
|
403
403
|
}
|
|
404
404
|
|
|
@@ -427,8 +427,8 @@
|
|
|
427
427
|
border: 1px solid var(--editor-border-subtle);
|
|
428
428
|
border-radius: var(--radius-sm);
|
|
429
429
|
word-break: break-word;
|
|
430
|
-
background: var(--
|
|
431
|
-
color: var(--
|
|
430
|
+
background: var(--ui-code-bg);
|
|
431
|
+
color: var(--ui-code-fg);
|
|
432
432
|
}
|
|
433
433
|
|
|
434
434
|
.j-editor code:not([class*='language-']) {
|
|
@@ -506,7 +506,7 @@
|
|
|
506
506
|
scrollbar-color: var(--ui-border) transparent;
|
|
507
507
|
}
|
|
508
508
|
|
|
509
|
-
pre .code-header+code[class*='language-'] {
|
|
509
|
+
pre .code-header + code[class*='language-'] {
|
|
510
510
|
padding: 0.5rem 1rem 0.75rem;
|
|
511
511
|
}
|
|
512
512
|
|
|
@@ -722,22 +722,22 @@
|
|
|
722
722
|
transition: transform 0.2s ease;
|
|
723
723
|
}
|
|
724
724
|
|
|
725
|
-
.j-editor details[open]>summary::before {
|
|
725
|
+
.j-editor details[open] > summary::before {
|
|
726
726
|
transform: rotate(90deg);
|
|
727
727
|
}
|
|
728
728
|
|
|
729
729
|
.j-editor details[open] p,
|
|
730
730
|
.j-editor details[open] ul,
|
|
731
731
|
.j-editor details[open] ol,
|
|
732
|
-
.j-editor details[open]
|
|
732
|
+
.j-editor details[open] > * {
|
|
733
733
|
margin-bottom: 1em;
|
|
734
734
|
}
|
|
735
735
|
|
|
736
|
-
.j-editor details[open]>summary
|
|
736
|
+
.j-editor details[open] > summary + * {
|
|
737
737
|
margin-top: 0;
|
|
738
738
|
}
|
|
739
739
|
|
|
740
|
-
.j-editor details[open]
|
|
740
|
+
.j-editor details[open] > *:last-child {
|
|
741
741
|
margin-bottom: 0;
|
|
742
742
|
}
|
|
743
743
|
|
|
@@ -791,11 +791,11 @@
|
|
|
791
791
|
/* ============================================
|
|
792
792
|
Block Item - 通用块级元素
|
|
793
793
|
============================================ */
|
|
794
|
-
.j-editor
|
|
794
|
+
.j-editor > *:first-child {
|
|
795
795
|
margin-top: 0;
|
|
796
796
|
}
|
|
797
797
|
|
|
798
|
-
.j-editor
|
|
798
|
+
.j-editor > *:last-child {
|
|
799
799
|
margin-bottom: 0;
|
|
800
800
|
}
|
|
801
801
|
|
|
@@ -854,4 +854,4 @@
|
|
|
854
854
|
.mobile .j-editor p {
|
|
855
855
|
--editor-block-space: 1.5rem;
|
|
856
856
|
}
|
|
857
|
-
}
|
|
857
|
+
}
|
|
@@ -1,18 +1,13 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.j-flow {
|
|
3
|
-
--flow-gap: 8px;
|
|
4
|
-
--flow-step-size: 28px;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
2
|
.j-flow,
|
|
8
3
|
.j-flow .flow-header {
|
|
9
4
|
display: grid;
|
|
10
|
-
gap:
|
|
5
|
+
gap: 8px;
|
|
11
6
|
}
|
|
12
7
|
|
|
13
8
|
.j-flow .flow-steps {
|
|
14
9
|
display: flex;
|
|
15
|
-
gap:
|
|
10
|
+
gap: 8px;
|
|
16
11
|
list-style: none;
|
|
17
12
|
margin: 0;
|
|
18
13
|
padding: 0;
|
|
@@ -44,8 +39,8 @@
|
|
|
44
39
|
border-radius: 999px;
|
|
45
40
|
display: inline-flex;
|
|
46
41
|
justify-content: center;
|
|
47
|
-
height:
|
|
48
|
-
min-width:
|
|
42
|
+
height: 28px;
|
|
43
|
+
min-width: 28px;
|
|
49
44
|
}
|
|
50
45
|
|
|
51
46
|
.j-flow .flow-step.is-active .flow-step-button {
|
|
@@ -67,7 +62,7 @@
|
|
|
67
62
|
display: flex;
|
|
68
63
|
gap: 4px;
|
|
69
64
|
justify-content: flex-end;
|
|
70
|
-
padding-top:
|
|
65
|
+
padding-top: 8px;
|
|
71
66
|
position: relative;
|
|
72
67
|
}
|
|
73
|
-
}
|
|
68
|
+
}
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
.j-input:not([type='checkbox']) {
|
|
54
|
-
border:
|
|
54
|
+
border: var(--border);
|
|
55
55
|
border-radius: var(--radius-md);
|
|
56
56
|
padding: var(--input-padding, 0 8px);
|
|
57
57
|
height: var(--input-height, var(--el-height));
|
|
@@ -148,7 +148,7 @@
|
|
|
148
148
|
width: 1rem;
|
|
149
149
|
height: 1rem;
|
|
150
150
|
border-radius: 50%;
|
|
151
|
-
border:
|
|
151
|
+
border: var(--border);
|
|
152
152
|
background-color: var(--ui-bg);
|
|
153
153
|
margin: 0;
|
|
154
154
|
cursor: pointer;
|
|
@@ -201,14 +201,16 @@
|
|
|
201
201
|
align-items: center;
|
|
202
202
|
text-align: center;
|
|
203
203
|
user-select: none;
|
|
204
|
-
transition:
|
|
204
|
+
transition-property: box-shadow, color, background-color;
|
|
205
|
+
transition-duration: 0.2s;
|
|
206
|
+
transition-timing-function: ease-in-out;
|
|
205
207
|
}
|
|
206
208
|
|
|
207
209
|
.j-radio.is-group label:not(:first-child) span.radio-text {
|
|
208
210
|
margin-left: 1px;
|
|
209
211
|
}
|
|
210
212
|
|
|
211
|
-
.j-radio.is-group input[type='radio']:checked+span.radio-text {
|
|
213
|
+
.j-radio.is-group input[type='radio']:checked + span.radio-text {
|
|
212
214
|
box-shadow: 0 0 0 1px var(--tone-solid);
|
|
213
215
|
color: var(--tone-solid);
|
|
214
216
|
background-color: var(--tone-soft);
|
|
@@ -275,7 +277,7 @@
|
|
|
275
277
|
width: 1rem;
|
|
276
278
|
height: 1rem;
|
|
277
279
|
aspect-ratio: 1/1;
|
|
278
|
-
border:
|
|
280
|
+
border: var(--border);
|
|
279
281
|
border-radius: var(--checkbox-radius, var(--radius-sm));
|
|
280
282
|
cursor: pointer;
|
|
281
283
|
position: relative;
|
|
@@ -354,27 +356,33 @@
|
|
|
354
356
|
height: 1.5rem;
|
|
355
357
|
}
|
|
356
358
|
|
|
357
|
-
.j-switch input[type='checkbox']:checked
|
|
359
|
+
.j-switch input[type='checkbox']:checked + .switch-slider {
|
|
358
360
|
background-color: var(--tone-solid);
|
|
359
361
|
}
|
|
360
362
|
|
|
361
|
-
.j-switch.is-sm input[type='checkbox']:checked
|
|
363
|
+
.j-switch.is-sm input[type='checkbox']:checked + .switch-slider:after {
|
|
362
364
|
transform: translateX(0.75rem);
|
|
363
365
|
}
|
|
364
366
|
|
|
365
|
-
.j-switch.is-md input[type='checkbox']:checked
|
|
367
|
+
.j-switch.is-md input[type='checkbox']:checked + .switch-slider:after {
|
|
366
368
|
transform: translateX(1.125rem);
|
|
367
369
|
}
|
|
368
370
|
|
|
369
|
-
.j-switch.is-lg input[type='checkbox']:checked
|
|
371
|
+
.j-switch.is-lg input[type='checkbox']:checked + .switch-slider:after {
|
|
370
372
|
transform: translateX(1.5rem);
|
|
371
373
|
}
|
|
372
374
|
|
|
373
|
-
.j-theme-gray
|
|
375
|
+
.j-theme-gray
|
|
376
|
+
.j-switch
|
|
377
|
+
input[type='checkbox']:checked
|
|
378
|
+
+ .switch-slider:after {
|
|
374
379
|
background-color: var(--ui-bg);
|
|
375
380
|
}
|
|
376
381
|
|
|
377
|
-
.j-theme-olive
|
|
382
|
+
.j-theme-olive
|
|
383
|
+
.j-switch
|
|
384
|
+
input[type='checkbox']:checked
|
|
385
|
+
+ .switch-slider:after {
|
|
378
386
|
background-color: var(--ui-bg);
|
|
379
387
|
}
|
|
380
388
|
|
|
@@ -385,7 +393,7 @@
|
|
|
385
393
|
/* select */
|
|
386
394
|
select.j-select {
|
|
387
395
|
padding: var(--input-padding, 0 6px);
|
|
388
|
-
border:
|
|
396
|
+
border: var(--border);
|
|
389
397
|
border-radius: var(--radius-md);
|
|
390
398
|
height: var(--el-height);
|
|
391
399
|
line-height: var(--line-height);
|
|
@@ -402,7 +410,7 @@
|
|
|
402
410
|
/* textarea */
|
|
403
411
|
textarea.j-textarea {
|
|
404
412
|
min-height: 72px;
|
|
405
|
-
border:
|
|
413
|
+
border: var(--border);
|
|
406
414
|
border-radius: var(--radius-md);
|
|
407
415
|
color: var(--tone-body);
|
|
408
416
|
background-color: var(--ui-bg);
|
|
@@ -446,9 +454,9 @@
|
|
|
446
454
|
--btn-box-shadow: none;
|
|
447
455
|
}
|
|
448
456
|
|
|
449
|
-
.input-group .el-addon
|
|
457
|
+
.input-group .el-addon > .el-text {
|
|
450
458
|
background-color: var(--ui-bg-muted);
|
|
451
|
-
border:
|
|
459
|
+
border: var(--border);
|
|
452
460
|
border-radius: var(--radius-md);
|
|
453
461
|
}
|
|
454
462
|
|
|
@@ -457,28 +465,31 @@
|
|
|
457
465
|
width: var(--input-height);
|
|
458
466
|
}
|
|
459
467
|
|
|
460
|
-
.input-group
|
|
468
|
+
.input-group > *:not(:first-child) {
|
|
461
469
|
margin-left: -1px;
|
|
462
470
|
}
|
|
463
471
|
|
|
464
|
-
.input-group>input.j-input:not(:first-child),
|
|
465
|
-
.input-group>select.j-select:not(:first-child),
|
|
466
|
-
.input-group
|
|
472
|
+
.input-group > input.j-input:not(:first-child),
|
|
473
|
+
.input-group > select.j-select:not(:first-child),
|
|
474
|
+
.input-group
|
|
475
|
+
> :not(select.j-select)
|
|
476
|
+
+ .el-addon:not(:first-child)
|
|
477
|
+
> .el-text {
|
|
467
478
|
border-left-color: transparent;
|
|
468
479
|
}
|
|
469
480
|
|
|
470
|
-
.input-group>input.j-input:not(:first-child),
|
|
471
|
-
.input-group>select.j-select:not(:first-child),
|
|
472
|
-
.input-group
|
|
473
|
-
.input-group
|
|
481
|
+
.input-group > input.j-input:not(:first-child),
|
|
482
|
+
.input-group > select.j-select:not(:first-child),
|
|
483
|
+
.input-group > *:not(:first-child) > *,
|
|
484
|
+
.input-group > *:not(:first-child) > .el-text {
|
|
474
485
|
border-top-left-radius: 0;
|
|
475
486
|
border-bottom-left-radius: 0;
|
|
476
487
|
}
|
|
477
488
|
|
|
478
|
-
.input-group>input.j-input:not(:last-child),
|
|
479
|
-
.input-group>select.j-select:not(:last-child),
|
|
480
|
-
.input-group
|
|
481
|
-
.input-group
|
|
489
|
+
.input-group > input.j-input:not(:last-child),
|
|
490
|
+
.input-group > select.j-select:not(:last-child),
|
|
491
|
+
.input-group > *:not(:last-child) > *,
|
|
492
|
+
.input-group > *:not(:last-child) > .el-text {
|
|
482
493
|
border-top-right-radius: 0;
|
|
483
494
|
border-bottom-right-radius: 0;
|
|
484
495
|
}
|
|
@@ -493,7 +504,7 @@
|
|
|
493
504
|
}
|
|
494
505
|
|
|
495
506
|
.input-inner-group {
|
|
496
|
-
border:
|
|
507
|
+
border: var(--border);
|
|
497
508
|
border-radius: var(--radius-md);
|
|
498
509
|
}
|
|
499
510
|
|
|
@@ -507,13 +518,13 @@
|
|
|
507
518
|
--btn-box-shadow: none;
|
|
508
519
|
}
|
|
509
520
|
|
|
510
|
-
.input-inner-group .el-addon
|
|
521
|
+
.input-inner-group .el-addon + .j-input {
|
|
511
522
|
padding-left: 0;
|
|
512
523
|
padding-right: 4px;
|
|
513
524
|
}
|
|
514
525
|
|
|
515
|
-
.input-inner-group .el-addon
|
|
516
|
-
padding
|
|
526
|
+
.input-inner-group .el-addon + .j-select {
|
|
527
|
+
padding: 0;
|
|
517
528
|
}
|
|
518
529
|
|
|
519
530
|
.input-inner-group .el-addon {
|
|
@@ -524,15 +535,6 @@
|
|
|
524
535
|
justify-content: center;
|
|
525
536
|
}
|
|
526
537
|
|
|
527
|
-
.input-inner-group .el-addon .j-btn:not(.is-icon) {
|
|
528
|
-
--btn-height: var(--el-height-sm);
|
|
529
|
-
}
|
|
530
|
-
|
|
531
|
-
.input-inner-group .el-addon .j-btn.is-xs:not(.is-icon),
|
|
532
|
-
.input-inner-group .el-addon .j-btn.is-sm:not(.is-icon) {
|
|
533
|
-
height: inherit;
|
|
534
|
-
}
|
|
535
|
-
|
|
536
538
|
/* .input-group .j-btn:active, */
|
|
537
539
|
.input-inner-group:has(input:focus),
|
|
538
540
|
.input-inner-group:has(select:focus) {
|
|
@@ -545,8 +547,8 @@
|
|
|
545
547
|
height: var(--font-size-xl);
|
|
546
548
|
}
|
|
547
549
|
|
|
548
|
-
.input-group .el-addon
|
|
549
|
-
.input-inner-group .el-addon
|
|
550
|
+
.input-group .el-addon > .el-text,
|
|
551
|
+
.input-inner-group .el-addon > .el-text {
|
|
550
552
|
display: flex;
|
|
551
553
|
align-items: center;
|
|
552
554
|
user-select: none;
|
|
@@ -649,7 +651,7 @@
|
|
|
649
651
|
background-color: var(--ui-bg-disabled);
|
|
650
652
|
}
|
|
651
653
|
|
|
652
|
-
.j-radio.is-group label input[type='radio']:disabled
|
|
654
|
+
.j-radio.is-group label input[type='radio']:disabled + .radio-text {
|
|
653
655
|
cursor: not-allowed;
|
|
654
656
|
background-color: var(--ui-bg-disabled);
|
|
655
657
|
color: var(--ui-fg-disabled);
|
|
@@ -691,4 +693,4 @@
|
|
|
691
693
|
.mobile .j-textarea {
|
|
692
694
|
width: 100%;
|
|
693
695
|
}
|
|
694
|
-
}
|
|
696
|
+
}
|