@i-cell/ids-styles 0.0.37 → 0.0.39
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/badge/badge.css +227 -0
- package/dist/badge/badge.min.css +1 -0
- package/dist/badge/badge.plugin.js +220 -0
- package/dist/components.css +246 -22
- package/dist/components.min.css +1 -1
- package/dist/components.plugin.js +229 -19
- package/dist/datepicker/datepicker.css +0 -4
- package/dist/datepicker/datepicker.min.css +1 -1
- package/dist/datepicker/datepicker.plugin.js +0 -1
- package/dist/form-elements/form-field/form-field.css +18 -18
- package/dist/form-elements/form-field/form-field.min.css +1 -1
- package/dist/form-elements/form-field/form-field.plugin.js +18 -18
- package/package.json +1 -1
package/dist/components.css
CHANGED
|
@@ -529,6 +529,234 @@
|
|
|
529
529
|
background: var(--ids-comp-avatar-color-bg-dark-default);
|
|
530
530
|
}
|
|
531
531
|
|
|
532
|
+
.ids-badge {
|
|
533
|
+
box-sizing: border-box;
|
|
534
|
+
border-width: 0;
|
|
535
|
+
border-style: none;
|
|
536
|
+
border-color: transparent;
|
|
537
|
+
line-height: 1.5;
|
|
538
|
+
}
|
|
539
|
+
.ids-badge::before, .ids-badge::after, .ids-badge *, .ids-badge ::before, .ids-badge ::after {
|
|
540
|
+
box-sizing: border-box;
|
|
541
|
+
border-width: 0;
|
|
542
|
+
border-style: none;
|
|
543
|
+
border-color: transparent;
|
|
544
|
+
}
|
|
545
|
+
|
|
546
|
+
.ids-badge {
|
|
547
|
+
display: inline-flex;
|
|
548
|
+
position: relative;
|
|
549
|
+
}
|
|
550
|
+
.ids-badge .ids-badge__container, .ids-badge .ids-badge__container-no-element {
|
|
551
|
+
white-space: nowrap;
|
|
552
|
+
position: absolute;
|
|
553
|
+
top: 0;
|
|
554
|
+
left: 100%;
|
|
555
|
+
transform: translate(0, -50%);
|
|
556
|
+
transform-origin: top left;
|
|
557
|
+
text-align: center;
|
|
558
|
+
display: flex;
|
|
559
|
+
align-items: center;
|
|
560
|
+
z-index: 1000;
|
|
561
|
+
}
|
|
562
|
+
|
|
563
|
+
.ids-badge-primary > .ids-badge__container, .ids-badge-primary .ids-badge__container-no-element {
|
|
564
|
+
background-color: var(--ids-comp-badge-filled-color-bg-primary-default);
|
|
565
|
+
border-color: var(--ids-comp-badge-filled-color-border-primary-default);
|
|
566
|
+
color: var(--ids-comp-badge-filled-color-fg-label-primary-default);
|
|
567
|
+
}
|
|
568
|
+
.ids-badge-primary > .ids-badge__container > .ids-icon, .ids-badge-primary .ids-badge__container-no-element > .ids-icon {
|
|
569
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-primary-default);
|
|
570
|
+
}
|
|
571
|
+
|
|
572
|
+
.ids-badge-secondary > .ids-badge__container, .ids-badge-secondary .ids-badge__container-no-element {
|
|
573
|
+
background-color: var(--ids-comp-badge-filled-color-bg-secondary-default);
|
|
574
|
+
border-color: var(--ids-comp-badge-filled-color-border-secondary-default);
|
|
575
|
+
color: var(--ids-comp-badge-filled-color-fg-label-secondary-default);
|
|
576
|
+
}
|
|
577
|
+
.ids-badge-secondary > .ids-badge__container > .ids-icon, .ids-badge-secondary .ids-badge__container-no-element > .ids-icon {
|
|
578
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-secondary-default);
|
|
579
|
+
}
|
|
580
|
+
|
|
581
|
+
.ids-badge-brand > .ids-badge__container, .ids-badge-brand .ids-badge__container-no-element {
|
|
582
|
+
background-color: var(--ids-comp-badge-filled-color-bg-brand-default);
|
|
583
|
+
border-color: var(--ids-comp-badge-filled-color-border-brand-default);
|
|
584
|
+
color: var(--ids-comp-badge-filled-color-fg-label-brand-default);
|
|
585
|
+
}
|
|
586
|
+
.ids-badge-brand > .ids-badge__container > .ids-icon, .ids-badge-brand .ids-badge__container-no-element > .ids-icon {
|
|
587
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-brand-default);
|
|
588
|
+
}
|
|
589
|
+
|
|
590
|
+
.ids-badge-error > .ids-badge__container, .ids-badge-error .ids-badge__container-no-element {
|
|
591
|
+
background-color: var(--ids-comp-badge-filled-color-bg-error-default);
|
|
592
|
+
border-color: var(--ids-comp-badge-filled-color-border-error-default);
|
|
593
|
+
color: var(--ids-comp-badge-filled-color-fg-label-error-default);
|
|
594
|
+
}
|
|
595
|
+
.ids-badge-error > .ids-badge__container > .ids-icon, .ids-badge-error .ids-badge__container-no-element > .ids-icon {
|
|
596
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-error-default);
|
|
597
|
+
}
|
|
598
|
+
|
|
599
|
+
.ids-badge-success > .ids-badge__container, .ids-badge-success .ids-badge__container-no-element {
|
|
600
|
+
background-color: var(--ids-comp-badge-filled-color-bg-success-default);
|
|
601
|
+
border-color: var(--ids-comp-badge-filled-color-border-success-default);
|
|
602
|
+
color: var(--ids-comp-badge-filled-color-fg-label-success-default);
|
|
603
|
+
}
|
|
604
|
+
.ids-badge-success > .ids-badge__container > .ids-icon, .ids-badge-success .ids-badge__container-no-element > .ids-icon {
|
|
605
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-success-default);
|
|
606
|
+
}
|
|
607
|
+
|
|
608
|
+
.ids-badge-warning > .ids-badge__container, .ids-badge-warning .ids-badge__container-no-element {
|
|
609
|
+
background-color: var(--ids-comp-badge-filled-color-bg-warning-default);
|
|
610
|
+
border-color: var(--ids-comp-badge-filled-color-border-warning-default);
|
|
611
|
+
color: var(--ids-comp-badge-filled-color-fg-label-warning-default);
|
|
612
|
+
}
|
|
613
|
+
.ids-badge-warning > .ids-badge__container > .ids-icon, .ids-badge-warning .ids-badge__container-no-element > .ids-icon {
|
|
614
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-warning-default);
|
|
615
|
+
}
|
|
616
|
+
|
|
617
|
+
.ids-badge-light > .ids-badge__container, .ids-badge-light .ids-badge__container-no-element {
|
|
618
|
+
background-color: var(--ids-comp-badge-filled-color-bg-light-default);
|
|
619
|
+
border-color: var(--ids-comp-badge-filled-color-border-light-default);
|
|
620
|
+
color: var(--ids-comp-badge-filled-color-fg-label-light-default);
|
|
621
|
+
}
|
|
622
|
+
.ids-badge-light > .ids-badge__container > .ids-icon, .ids-badge-light .ids-badge__container-no-element > .ids-icon {
|
|
623
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-light-default);
|
|
624
|
+
}
|
|
625
|
+
|
|
626
|
+
.ids-badge-dark > .ids-badge__container, .ids-badge-dark .ids-badge__container-no-element {
|
|
627
|
+
background-color: var(--ids-comp-badge-filled-color-bg-dark-default);
|
|
628
|
+
border-color: var(--ids-comp-badge-filled-color-border-dark-default);
|
|
629
|
+
color: var(--ids-comp-badge-filled-color-fg-label-dark-default);
|
|
630
|
+
}
|
|
631
|
+
.ids-badge-dark > .ids-badge__container > .ids-icon, .ids-badge-dark .ids-badge__container-no-element > .ids-icon {
|
|
632
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-dark-default);
|
|
633
|
+
}
|
|
634
|
+
|
|
635
|
+
.ids-badge-surface > .ids-badge__container, .ids-badge-surface .ids-badge__container-no-element {
|
|
636
|
+
background-color: var(--ids-comp-badge-filled-color-bg-surface-default);
|
|
637
|
+
border-color: var(--ids-comp-badge-filled-color-border-surface-default);
|
|
638
|
+
color: var(--ids-comp-badge-filled-color-fg-label-surface-default);
|
|
639
|
+
}
|
|
640
|
+
.ids-badge-surface > .ids-badge__container > .ids-icon, .ids-badge-surface .ids-badge__container-no-element > .ids-icon {
|
|
641
|
+
color: var(--ids-comp-badge-filled-color-fg-icon-surface-default);
|
|
642
|
+
}
|
|
643
|
+
|
|
644
|
+
.ids-badge-compact > .ids-badge__container {
|
|
645
|
+
border-radius: var(--ids-comp-badge-size-border-radius-compact);
|
|
646
|
+
border-width: var(--ids-comp-badge-size-border-width-compact);
|
|
647
|
+
padding: var(--ids-comp-badge-size-padding-y-compact) var(--ids-comp-badge-size-padding-x-compact);
|
|
648
|
+
height: var(--ids-comp-badge-size-height-compact);
|
|
649
|
+
min-width: var(--ids-comp-badge-size-min-width-compact);
|
|
650
|
+
gap: var(--ids-comp-badge-size-gap-compact);
|
|
651
|
+
}
|
|
652
|
+
.ids-badge-compact > .ids-badge__container > .ids-badge__label {
|
|
653
|
+
font-family: var(--ids-comp-badge-label-typography-font-family-compact);
|
|
654
|
+
font-size: var(--ids-comp-badge-label-typography-font-size-compact);
|
|
655
|
+
font-weight: var(--ids-comp-badge-label-typography-font-weight-compact);
|
|
656
|
+
letter-spacing: var(--ids-comp-badge-label-typography-letter-spacing-compact);
|
|
657
|
+
line-height: var(--ids-comp-badge-label-typography-line-height-compact);
|
|
658
|
+
}
|
|
659
|
+
.ids-badge-compact > .ids-badge__container > .ids-icon {
|
|
660
|
+
font-size: var(--ids-comp-badge-icon-typography-font-size-compact);
|
|
661
|
+
font-weight: var(--ids-comp-badge-icon-typography-font-weight-compact);
|
|
662
|
+
line-height: var(--ids-comp-badge-icon-typography-line-height-compact);
|
|
663
|
+
width: var(--ids-comp-badge-size-icon-compact);
|
|
664
|
+
height: var(--ids-comp-badge-size-icon-compact);
|
|
665
|
+
}
|
|
666
|
+
.ids-badge-compact > .ids-badge__container-no-element {
|
|
667
|
+
border-radius: var(--ids-comp-badge-noelement-size-border-radius-compact);
|
|
668
|
+
border-width: var(--ids-comp-badge-noelement-size-border-width-compact);
|
|
669
|
+
min-width: var(--ids-comp-badge-noelement-size-width-compact);
|
|
670
|
+
height: var(--ids-comp-badge-noelement-size-height-compact);
|
|
671
|
+
}
|
|
672
|
+
|
|
673
|
+
.ids-badge-comfortable > .ids-badge__container {
|
|
674
|
+
border-radius: var(--ids-comp-badge-size-border-radius-comfortable);
|
|
675
|
+
border-width: var(--ids-comp-badge-size-border-width-comfortable);
|
|
676
|
+
padding: var(--ids-comp-badge-size-padding-y-comfortable) var(--ids-comp-badge-size-padding-x-comfortable);
|
|
677
|
+
height: var(--ids-comp-badge-size-height-comfortable);
|
|
678
|
+
min-width: var(--ids-comp-badge-size-min-width-comfortable);
|
|
679
|
+
gap: var(--ids-comp-badge-size-gap-comfortable);
|
|
680
|
+
}
|
|
681
|
+
.ids-badge-comfortable > .ids-badge__container > .ids-badge__label {
|
|
682
|
+
font-family: var(--ids-comp-badge-label-typography-font-family-comfortable);
|
|
683
|
+
font-size: var(--ids-comp-badge-label-typography-font-size-comfortable);
|
|
684
|
+
font-weight: var(--ids-comp-badge-label-typography-font-weight-comfortable);
|
|
685
|
+
letter-spacing: var(--ids-comp-badge-label-typography-letter-spacing-comfortable);
|
|
686
|
+
line-height: var(--ids-comp-badge-label-typography-line-height-comfortable);
|
|
687
|
+
}
|
|
688
|
+
.ids-badge-comfortable > .ids-badge__container > .ids-icon {
|
|
689
|
+
font-size: var(--ids-comp-badge-icon-typography-font-size-comfortable);
|
|
690
|
+
font-weight: var(--ids-comp-badge-icon-typography-font-weight-comfortable);
|
|
691
|
+
line-height: var(--ids-comp-badge-icon-typography-line-height-comfortable);
|
|
692
|
+
width: var(--ids-comp-badge-size-icon-comfortable);
|
|
693
|
+
height: var(--ids-comp-badge-size-icon-comfortable);
|
|
694
|
+
}
|
|
695
|
+
.ids-badge-comfortable > .ids-badge__container-no-element {
|
|
696
|
+
border-radius: var(--ids-comp-badge-noelement-size-border-radius-comfortable);
|
|
697
|
+
border-width: var(--ids-comp-badge-noelement-size-border-width-comfortable);
|
|
698
|
+
min-width: var(--ids-comp-badge-noelement-size-width-comfortable);
|
|
699
|
+
height: var(--ids-comp-badge-noelement-size-height-comfortable);
|
|
700
|
+
}
|
|
701
|
+
|
|
702
|
+
.ids-badge-spacious > .ids-badge__container {
|
|
703
|
+
border-radius: var(--ids-comp-badge-size-border-radius-spacious);
|
|
704
|
+
border-width: var(--ids-comp-badge-size-border-width-spacious);
|
|
705
|
+
padding: var(--ids-comp-badge-size-padding-y-spacious) var(--ids-comp-badge-size-padding-x-spacious);
|
|
706
|
+
height: var(--ids-comp-badge-size-height-spacious);
|
|
707
|
+
min-width: var(--ids-comp-badge-size-min-width-spacious);
|
|
708
|
+
gap: var(--ids-comp-badge-size-gap-spacious);
|
|
709
|
+
}
|
|
710
|
+
.ids-badge-spacious > .ids-badge__container > .ids-badge__label {
|
|
711
|
+
font-family: var(--ids-comp-badge-label-typography-font-family-spacious);
|
|
712
|
+
font-size: var(--ids-comp-badge-label-typography-font-size-spacious);
|
|
713
|
+
font-weight: var(--ids-comp-badge-label-typography-font-weight-spacious);
|
|
714
|
+
letter-spacing: var(--ids-comp-badge-label-typography-letter-spacing-spacious);
|
|
715
|
+
line-height: var(--ids-comp-badge-label-typography-line-height-spacious);
|
|
716
|
+
}
|
|
717
|
+
.ids-badge-spacious > .ids-badge__container > .ids-icon {
|
|
718
|
+
font-size: var(--ids-comp-badge-icon-typography-font-size-spacious);
|
|
719
|
+
font-weight: var(--ids-comp-badge-icon-typography-font-weight-spacious);
|
|
720
|
+
line-height: var(--ids-comp-badge-icon-typography-line-height-spacious);
|
|
721
|
+
width: var(--ids-comp-badge-size-icon-spacious);
|
|
722
|
+
height: var(--ids-comp-badge-size-icon-spacious);
|
|
723
|
+
}
|
|
724
|
+
.ids-badge-spacious > .ids-badge__container-no-element {
|
|
725
|
+
border-radius: var(--ids-comp-badge-noelement-size-border-radius-spacious);
|
|
726
|
+
border-width: var(--ids-comp-badge-noelement-size-border-width-spacious);
|
|
727
|
+
min-width: var(--ids-comp-badge-noelement-size-width-spacious);
|
|
728
|
+
height: var(--ids-comp-badge-noelement-size-height-spacious);
|
|
729
|
+
}
|
|
730
|
+
|
|
731
|
+
.ids-badge-dense > .ids-badge__container {
|
|
732
|
+
border-radius: var(--ids-comp-badge-size-border-radius-dense);
|
|
733
|
+
border-width: var(--ids-comp-badge-size-border-width-dense);
|
|
734
|
+
padding: var(--ids-comp-badge-size-padding-y-dense) var(--ids-comp-badge-size-padding-x-dense);
|
|
735
|
+
height: var(--ids-comp-badge-size-height-dense);
|
|
736
|
+
min-width: var(--ids-comp-badge-size-min-width-dense);
|
|
737
|
+
gap: var(--ids-comp-badge-size-gap-dense);
|
|
738
|
+
}
|
|
739
|
+
.ids-badge-dense > .ids-badge__container > .ids-badge__label {
|
|
740
|
+
font-family: var(--ids-comp-badge-label-typography-font-family-dense);
|
|
741
|
+
font-size: var(--ids-comp-badge-label-typography-font-size-dense);
|
|
742
|
+
font-weight: var(--ids-comp-badge-label-typography-font-weight-dense);
|
|
743
|
+
letter-spacing: var(--ids-comp-badge-label-typography-letter-spacing-dense);
|
|
744
|
+
line-height: var(--ids-comp-badge-label-typography-line-height-dense);
|
|
745
|
+
}
|
|
746
|
+
.ids-badge-dense > .ids-badge__container > .ids-icon {
|
|
747
|
+
font-size: var(--ids-comp-badge-icon-typography-font-size-dense);
|
|
748
|
+
font-weight: var(--ids-comp-badge-icon-typography-font-weight-dense);
|
|
749
|
+
line-height: var(--ids-comp-badge-icon-typography-line-height-dense);
|
|
750
|
+
width: var(--ids-comp-badge-size-icon-dense);
|
|
751
|
+
height: var(--ids-comp-badge-size-icon-dense);
|
|
752
|
+
}
|
|
753
|
+
.ids-badge-dense > .ids-badge__container-no-element {
|
|
754
|
+
border-radius: var(--ids-comp-badge-noelement-size-border-radius-dense);
|
|
755
|
+
border-width: var(--ids-comp-badge-noelement-size-border-width-dense);
|
|
756
|
+
min-width: var(--ids-comp-badge-noelement-size-width-dense);
|
|
757
|
+
height: var(--ids-comp-badge-noelement-size-height-dense);
|
|
758
|
+
}
|
|
759
|
+
|
|
532
760
|
.ids-button-group {
|
|
533
761
|
box-sizing: border-box;
|
|
534
762
|
border-width: 0;
|
|
@@ -4576,10 +4804,6 @@ button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active > .ids-chi
|
|
|
4576
4804
|
cursor: pointer;
|
|
4577
4805
|
outline-style: none;
|
|
4578
4806
|
}
|
|
4579
|
-
.ids-calendar .ids-calendar-cell > .ids-calendar-button.ids-calendar-button-selected {
|
|
4580
|
-
cursor: default;
|
|
4581
|
-
pointer-events: none;
|
|
4582
|
-
}
|
|
4583
4807
|
.ids-calendar .ids-calendar-cell > .ids-calendar-button.ids-calendar-button-today {
|
|
4584
4808
|
border-style: solid;
|
|
4585
4809
|
}
|
|
@@ -5749,33 +5973,33 @@ button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active > .ids-chi
|
|
|
5749
5973
|
border-left-color: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-default);
|
|
5750
5974
|
background: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default);
|
|
5751
5975
|
}
|
|
5752
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5976
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) {
|
|
5753
5977
|
border-color: var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-focused);
|
|
5754
5978
|
background: var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-focused);
|
|
5755
5979
|
outline-color: var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused);
|
|
5756
5980
|
}
|
|
5757
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5981
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__leading-icon > .ids-icon {
|
|
5758
5982
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-focused);
|
|
5759
5983
|
}
|
|
5760
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5984
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__prefix {
|
|
5761
5985
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-focused);
|
|
5762
5986
|
}
|
|
5763
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5987
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__infix .ids-form-field-control {
|
|
5764
5988
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-focused);
|
|
5765
5989
|
}
|
|
5766
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5990
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__infix .ids-form-field-control .ids-icon {
|
|
5767
5991
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-icon-surface-focused);
|
|
5768
5992
|
}
|
|
5769
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5993
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__infix ::placeholder {
|
|
5770
5994
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused);
|
|
5771
5995
|
}
|
|
5772
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5996
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__suffix {
|
|
5773
5997
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-focused);
|
|
5774
5998
|
}
|
|
5775
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
5999
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__trailing-icon > .ids-icon {
|
|
5776
6000
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-focused);
|
|
5777
6001
|
}
|
|
5778
|
-
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6002
|
+
.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__action {
|
|
5779
6003
|
border-left-color: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-default);
|
|
5780
6004
|
background: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default);
|
|
5781
6005
|
}
|
|
@@ -6141,33 +6365,33 @@ button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active > .ids-chi
|
|
|
6141
6365
|
border-left-color: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-default);
|
|
6142
6366
|
background: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default);
|
|
6143
6367
|
}
|
|
6144
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6368
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) {
|
|
6145
6369
|
border-color: var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-focused);
|
|
6146
6370
|
background: var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-focused);
|
|
6147
6371
|
outline-color: var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused);
|
|
6148
6372
|
}
|
|
6149
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6373
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__leading-icon > .ids-icon {
|
|
6150
6374
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-focused);
|
|
6151
6375
|
}
|
|
6152
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6376
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__prefix {
|
|
6153
6377
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-focused);
|
|
6154
6378
|
}
|
|
6155
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6379
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__infix .ids-form-field-control {
|
|
6156
6380
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-focused);
|
|
6157
6381
|
}
|
|
6158
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6382
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__infix .ids-form-field-control .ids-icon {
|
|
6159
6383
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-icon-light-focused);
|
|
6160
6384
|
}
|
|
6161
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6385
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__infix ::placeholder {
|
|
6162
6386
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused);
|
|
6163
6387
|
}
|
|
6164
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6388
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__suffix {
|
|
6165
6389
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-focused);
|
|
6166
6390
|
}
|
|
6167
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6391
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__container > .ids-form-field__trailing-icon > .ids-icon {
|
|
6168
6392
|
color: var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-focused);
|
|
6169
6393
|
}
|
|
6170
|
-
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.
|
|
6394
|
+
.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled) > .ids-form-field__field-wrapper:has(.ids-form-field-control:focus) > .ids-form-field__field-wrapper__action {
|
|
6171
6395
|
border-left-color: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-default);
|
|
6172
6396
|
background: var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default);
|
|
6173
6397
|
}
|