diff --git a/projects/igniteui-angular/src/lib/core/styles/components/drop-down/_drop-down-theme.scss b/projects/igniteui-angular/src/lib/core/styles/components/drop-down/_drop-down-theme.scss index bb89c037374..684dc2dd965 100644 --- a/projects/igniteui-angular/src/lib/core/styles/components/drop-down/_drop-down-theme.scss +++ b/projects/igniteui-angular/src/lib/core/styles/components/drop-down/_drop-down-theme.scss @@ -327,16 +327,16 @@ } } -/// Adds typography styles for the igx-list component. -/// Uses the 'caption' and 'subtitle-2' +/// Adds typography styles for the igx-drop-down component. +/// Uses the 'overline', 'body-2', 'subtitle-1' /// categories from the typographic scale. /// @group typography -/// @param {Map} $categories [(header: 'overline', item: 'body-2', select-item: 'subtitle-1')] - The categories from the typographic scale used for type styles. +/// @param {Map} $categories [(header: 'overline', item: 'body-2', select-item: 'body-2')] - The categories from the typographic scale used for type styles. @mixin drop-down-typography( $categories: ( header: 'overline', item: 'body-2', - select-item: 'subtitle-1' + select-item: 'body-2' ) ) { $header: map.get($categories, 'header'); @@ -355,4 +355,10 @@ margin: 0; } } + + %igx-drop-down__item--selected { + @include type-style($select-item) { + margin: 0; + } + } } diff --git a/projects/igniteui-angular/src/lib/core/styles/typography/_bootstrap.scss b/projects/igniteui-angular/src/lib/core/styles/typography/_bootstrap.scss index e9cc4ac77ba..4807d35e342 100644 --- a/projects/igniteui-angular/src/lib/core/styles/typography/_bootstrap.scss +++ b/projects/igniteui-angular/src/lib/core/styles/typography/_bootstrap.scss @@ -63,9 +63,9 @@ )); @include dock-manager-typography(); @include drop-down-typography($categories: ( - header: 'body-1', - item: 'body-1', - select-item: 'body-1' + header: 'overline', + item: 'body-2', + select-item: 'body-2' )); @include expansion-panel-typography($categories: ( title: 'h5', diff --git a/projects/igniteui-angular/src/lib/core/styles/typography/_fluent.scss b/projects/igniteui-angular/src/lib/core/styles/typography/_fluent.scss index 8644761b67a..d79bd919815 100644 --- a/projects/igniteui-angular/src/lib/core/styles/typography/_fluent.scss +++ b/projects/igniteui-angular/src/lib/core/styles/typography/_fluent.scss @@ -62,7 +62,11 @@ @include date-range-typography(); @include dialog-typography(); @include dock-manager-typography(); - @include drop-down-typography(); + @include drop-down-typography($categories: ( + header: 'subtitle-2', + item: 'body-2', + select-item: 'body-2' + )); @include expansion-panel-typography($categories: ( title: 'subtitle-1', description: 'body-2',