@acorex/styles 4.2.65 → 4.2.70
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/package.json +1 -1
- package/scss/forms.scss +65 -40
package/package.json
CHANGED
package/scss/forms.scss
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
&.form-control {
|
|
5
5
|
&.disabled {
|
|
6
6
|
background: var(--ax-gray-light-color) !important;
|
|
7
|
-
.chips-container{
|
|
7
|
+
.chips-container {
|
|
8
8
|
background-color: var(--ax-gray-light-color-color);
|
|
9
9
|
}
|
|
10
10
|
}
|
|
@@ -26,18 +26,18 @@
|
|
|
26
26
|
position: relative;
|
|
27
27
|
width: calc(var(--ax-base-size) * var(--ax-base-ratio));
|
|
28
28
|
height: 100%;
|
|
29
|
-
ax-button{
|
|
30
|
-
button{
|
|
29
|
+
ax-button {
|
|
30
|
+
button {
|
|
31
31
|
height: 50% !important;
|
|
32
32
|
position: absolute;
|
|
33
33
|
}
|
|
34
|
-
&:first-child{
|
|
35
|
-
button{
|
|
34
|
+
&:first-child {
|
|
35
|
+
button {
|
|
36
36
|
top: 0;
|
|
37
37
|
}
|
|
38
38
|
}
|
|
39
|
-
&:last-child{
|
|
40
|
-
button{
|
|
39
|
+
&:last-child {
|
|
40
|
+
button {
|
|
41
41
|
bottom: 0;
|
|
42
42
|
}
|
|
43
43
|
}
|
|
@@ -97,7 +97,6 @@
|
|
|
97
97
|
@include ax-border-radius(var(--ax-size-border-radius));
|
|
98
98
|
-webkit-transition: opacity 0.3s ease;
|
|
99
99
|
transition: opacity 0.3s ease;
|
|
100
|
-
|
|
101
100
|
}
|
|
102
101
|
}
|
|
103
102
|
&.disabled {
|
|
@@ -131,7 +130,7 @@
|
|
|
131
130
|
&::placeholder {
|
|
132
131
|
color: var(--ax-gray-dark-color) !important;
|
|
133
132
|
}
|
|
134
|
-
|
|
133
|
+
|
|
135
134
|
// &.clear {
|
|
136
135
|
// margin-inline-end: 3em !important;
|
|
137
136
|
// }
|
|
@@ -240,10 +239,8 @@
|
|
|
240
239
|
}
|
|
241
240
|
}
|
|
242
241
|
}
|
|
243
|
-
|
|
244
|
-
|
|
242
|
+
|
|
245
243
|
&.required-state {
|
|
246
|
-
|
|
247
244
|
border-inline-start-width: 2px;
|
|
248
245
|
border-inline-start-style: solid;
|
|
249
246
|
border-inline-start-color: var(--ax-warning-color) !important;
|
|
@@ -256,7 +253,6 @@
|
|
|
256
253
|
}
|
|
257
254
|
}
|
|
258
255
|
}
|
|
259
|
-
|
|
260
256
|
}
|
|
261
257
|
&.success-state {
|
|
262
258
|
border-inline-start-width: 2px;
|
|
@@ -299,14 +295,14 @@
|
|
|
299
295
|
}
|
|
300
296
|
.readonly {
|
|
301
297
|
opacity: 0.8;
|
|
302
|
-
|
|
298
|
+
|
|
303
299
|
input {
|
|
304
300
|
cursor: no-drop;
|
|
305
301
|
}
|
|
306
|
-
.button{
|
|
302
|
+
.button {
|
|
307
303
|
&.disabled {
|
|
308
|
-
|
|
309
|
-
|
|
304
|
+
background: transparent !important;
|
|
305
|
+
}
|
|
310
306
|
}
|
|
311
307
|
}
|
|
312
308
|
|
|
@@ -315,7 +311,6 @@
|
|
|
315
311
|
border: none;
|
|
316
312
|
box-shadow: none;
|
|
317
313
|
}
|
|
318
|
-
|
|
319
314
|
}
|
|
320
315
|
.content {
|
|
321
316
|
border: none;
|
|
@@ -426,20 +421,19 @@
|
|
|
426
421
|
width: 30%;
|
|
427
422
|
}
|
|
428
423
|
.chips {
|
|
429
|
-
|
|
424
|
+
display: inline-flex;
|
|
425
|
+
overflow: hidden;
|
|
430
426
|
background: rgba(0, 0, 0, 0.04);
|
|
427
|
+
padding: 0.2rem 0.5rem;
|
|
428
|
+
margin: 0 0.2rem;
|
|
429
|
+
border-radius: var(--ax-size-border-radius);
|
|
431
430
|
color: var(--ax-gray-fore-color);
|
|
432
431
|
border: 1px solid var(--ax-border-color);
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
display: inline-block;
|
|
437
|
-
cursor: pointer;
|
|
438
|
-
flex: unset;
|
|
432
|
+
flex: none;
|
|
433
|
+
min-width: fit-content;
|
|
434
|
+
max-width: 7rem;
|
|
439
435
|
white-space: nowrap;
|
|
440
|
-
|
|
441
|
-
// text-overflow: ellipsis;
|
|
442
|
-
.chips-text {
|
|
436
|
+
.chips-text {
|
|
443
437
|
display: inline-block;
|
|
444
438
|
vertical-align: middle;
|
|
445
439
|
overflow: hidden;
|
|
@@ -447,22 +441,53 @@
|
|
|
447
441
|
vertical-align: middle;
|
|
448
442
|
text-overflow: ellipsis;
|
|
449
443
|
font-size: 0.875rem;
|
|
450
|
-
min-width: fit-content;
|
|
451
|
-
max-width: 110px;
|
|
452
444
|
direction: inherit;
|
|
453
445
|
text-align: inherit;
|
|
454
446
|
}
|
|
455
447
|
.close-icon {
|
|
456
448
|
vertical-align: middle;
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
449
|
+
display: flex;
|
|
450
|
+
align-items: center;
|
|
451
|
+
margin-inline-start: 0.25rem;
|
|
452
|
+
cursor: pointer;
|
|
453
|
+
}
|
|
454
|
+
// font-size: inherit;
|
|
455
|
+
// background: rgba(0, 0, 0, 0.04);
|
|
456
|
+
// color: var(--ax-gray-fore-color);
|
|
457
|
+
// border: 1px solid var(--ax-border-color);
|
|
458
|
+
// padding: 0.2em 0.4em;
|
|
459
|
+
// @include ax-border-radius(var(--ax-size-border-radius));
|
|
460
|
+
// margin: 0 0.5em;
|
|
461
|
+
// display: inline-block;
|
|
462
|
+
// cursor: pointer;
|
|
463
|
+
// flex: unset;
|
|
464
|
+
// white-space: nowrap;
|
|
465
|
+
// // overflow: hidden;
|
|
466
|
+
// // text-overflow: ellipsis;
|
|
467
|
+
// .chips-text {
|
|
468
|
+
// display: inline-block;
|
|
469
|
+
// vertical-align: middle;
|
|
470
|
+
// overflow: hidden;
|
|
471
|
+
// white-space: nowrap;
|
|
472
|
+
// vertical-align: middle;
|
|
473
|
+
// text-overflow: ellipsis;
|
|
474
|
+
// font-size: 0.875rem;
|
|
475
|
+
// min-width: fit-content;
|
|
476
|
+
// max-width: 110px;
|
|
477
|
+
// direction: inherit;
|
|
478
|
+
// text-align: inherit;
|
|
479
|
+
// }
|
|
480
|
+
// .close-icon {
|
|
481
|
+
// vertical-align: middle;
|
|
482
|
+
// }
|
|
483
|
+
// i {
|
|
484
|
+
// color: var(--ax-gray-dark-color);
|
|
485
|
+
// margin-inline-start: 0.3em;
|
|
486
|
+
// @include ax-transition-all();
|
|
487
|
+
// &:hover {
|
|
488
|
+
// color: var(--ax-danger-color);
|
|
489
|
+
// }
|
|
490
|
+
// }
|
|
466
491
|
&:hover {
|
|
467
492
|
background-color: var(--ax-primary-trans-light-color);
|
|
468
493
|
color: var(--ax-primary-color);
|
|
@@ -487,4 +512,4 @@
|
|
|
487
512
|
flex: 1 1 auto;
|
|
488
513
|
}
|
|
489
514
|
}
|
|
490
|
-
}
|
|
515
|
+
}
|