diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html index 0241ee22740..75f7e10f0e6 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html @@ -18,7 +18,7 @@   {{ displayValue | translate }}  {{ 'SEARCH.FILTER.ANY' | translate }} - {{ chipIcon }} + {{ chipIcon }} remove diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.scss b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.scss index fe421ccb654..ba248dbbde6 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.scss +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.scss @@ -5,6 +5,10 @@ adf-search-facet-chip-tabbed { } } + .adf-search-filter-chip-icon { + padding-top: 2px; + } + .adf-search-widget-extra-width { max-width: 500px; } diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.scss b/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.scss index 44bdc060854..56c5d156f01 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.scss +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.scss @@ -1,9 +1,11 @@ @use '@angular/material' as mat; +@import 'styles/mat-selectors'; .adf-search-filter-chip, .adf-search-filter-chip-tabbed { border: 2px solid transparent; transition: border 500ms ease-in-out; + height: 32px; max-width: 320px; text-overflow: ellipsis; overflow: hidden; @@ -37,7 +39,6 @@ } .adf-search-filter-chip-icon { - padding-top: 5px; padding-left: 5px; } @@ -48,3 +49,12 @@ @include mat.elevation(2); } } + +.adf-search-filter-chip#{$mat-evolution-chip}#{$mat-standard-chip} { + margin-top: 0; + margin-bottom: 0; +} + +#{$mat-standard-chip} { + -webkit-font-smoothing: unset; +} diff --git a/lib/content-services/src/lib/search/components/search-form/search-form.component.html b/lib/content-services/src/lib/search/components/search-form/search-form.component.html index 7e2976fe9ec..f2af1ddd60e 100644 --- a/lib/content-services/src/lib/search/components/search-form/search-form.component.html +++ b/lib/content-services/src/lib/search/components/search-form/search-form.component.html @@ -21,7 +21,7 @@ [matMenuTriggerRestoreFocus]="true"> {{ getSelected(forms) | translate }} - expand_more + expand_more diff --git a/lib/content-services/src/lib/search/components/search-form/search-form.component.scss b/lib/content-services/src/lib/search/components/search-form/search-form.component.scss index b908b35bec7..56d6262e4a4 100644 --- a/lib/content-services/src/lib/search/components/search-form/search-form.component.scss +++ b/lib/content-services/src/lib/search/components/search-form/search-form.component.scss @@ -1,7 +1,11 @@ @use '@angular/material' as mat; +@import 'styles/mat-selectors'; .adf-search-form { &.adf-search-form-button { + justify-content: space-between; + display: flex; + padding: 0 14px 0 16px; height: 35px; max-width: 190px; min-width: 190px; @@ -17,7 +21,6 @@ &-title { max-width: 120px; min-width: 120px; - font-weight: bold; font-size: var(--theme-body-1-font-size); line-height: 24px; padding-right: 12px; @@ -26,7 +29,10 @@ text-align: left; } - &-icon { + .adf-search-form-icon#{$mat-icon} { + font-size: 24px; + height: 24px; + width: 24px; border: 2px solid transparent; border-radius: 6px; transition: border 500ms ease-out; diff --git a/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.component.scss b/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.component.scss index c612354e9f7..a1675eca57d 100644 --- a/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.component.scss +++ b/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.component.scss @@ -1,3 +1,5 @@ +@import 'styles/mat-selectors'; + .adf-dynamic-chip-list-container { display: flex; flex-direction: row; @@ -70,6 +72,26 @@ .adf-dynamic-chip-list-chip { height: auto; word-break: break-word; + margin-top: 0; + margin-bottom: 0; padding: 6px 11px; + + #{$mat-evolution-chip-action} { + padding: 2px 12px; + + #{$mat-evolution-chip-text-label} { + color: var(--adf-theme-foreground-text-color-054); + } + } + } + + .adf-dynamic-chip-list-delete-icon { + font-size: var(--theme-title-font-size); + background-repeat: no-repeat; + display: inline-block; + fill: currentcolor; + height: 20px; + width: 20px; + color: var(--theme-primary-color-default-contrast); } } diff --git a/lib/core/src/lib/styles/_mat-selectors.scss b/lib/core/src/lib/styles/_mat-selectors.scss index 3792818d04d..2c7c01cd5d6 100644 --- a/lib/core/src/lib/styles/_mat-selectors.scss +++ b/lib/core/src/lib/styles/_mat-selectors.scss @@ -108,3 +108,7 @@ $mdc-dialog: '.mdc-dialog'; $mat-text-filed-input: '.mdc-text-field__input'; $mat-floating-label-float-above: '.mdc-floating-label--float-above'; $mat-floating-label--required: '.mdc-floating-label--required'; +$mat-evolution-chip: '.mdc-evolution-chip'; +$mat-standard-chip: '.mat-mdc-standard-chip'; +$mat-evolution-chip-action: '.mdc-evolution-chip__action'; +$mat-evolution-chip-text-label: '.mdc-evolution-chip__text-label'