fix(fix contrast colors fo bootstrap theme):

Closes #6613

Author: MPopov

projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss

@@ -232,6 +232,7 @@
 
         igx-list {
             margin: rem(8px) -#{rem(16px)} 0;
+            border: 0;
             border-top: 1px dashed igx-color($palette, 'grays', 300);
             border-bottom: 1px dashed igx-color($palette, 'grays', 300);
         }

projects/igniteui-angular/src/lib/core/styles/components/paginator/_paginator-theme.scss

@@ -41,6 +41,11 @@
 
     $theme: apply-palette($grid-paginator-schema, $palette);
 
+
+    @if not($text-color) and $background-color {
+        $text-color: text-contrast($background-color);
+    }
+
     @return extend($theme, (
         name: $name,
         palette: $palette,

projects/igniteui-angular/src/lib/core/styles/themes/schemas/dark/_banner.scss

@@ -22,4 +22,9 @@ $_dark-fluent-banner: extend($_fluent-banner);
 /// @type {Map}
 /// @requires extend
 /// @requires $_bootstrap-banner
-$_dark-bootstrap-banner: extend($_bootstrap-banner);
+$_dark-bootstrap-banner: extend(
+    $_bootstrap-banner,
+    (
+        banner-background: #333,
+    )
+);

projects/igniteui-angular/src/lib/core/styles/themes/schemas/dark/_list.scss

@@ -46,6 +46,7 @@ $_dark-bootstrap-list: extend(
     $_bootstrap-list,
     $_base-dark-list,
     (
+        background: #222,
         item-background: #222,
         header-background: #222,
     )

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_banner.scss

@@ -48,4 +48,17 @@ $_fluent-banner: extend($_light-banner);
 /// @type {Map}
 /// @requires {function} extend
 /// @requires $_light-banner
-$_bootstrap-banner: extend($_light-banner);
+$_bootstrap-banner: extend(
+    $_light-banner,
+    (
+        banner-background: #fff,
+
+        banner-message-color: (
+            igx-color: ('grays', 800)
+        ),
+
+        banner-illustration-color: (
+            igx-color: ('grays', 800)
+        )
+    )
+);

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_calendar.scss

@@ -56,6 +56,7 @@ $_light-calendar: extend(
     $_default-shape-calendar,
     (
         variant: 'material',
+
         content-background: (
             igx-color: 'surface'
         ),
@@ -289,8 +290,6 @@ $_bootstrap-calendar: extend(
             igx-color: ('primary', 800)
         ),
 
-        picker-text-color: #000,
-
         year-current-text-color: (
             igx-color: ('primary', 500)
         ),
@@ -324,6 +323,22 @@ $_bootstrap-calendar: extend(
         date-selected-text-color: #fff,
 
         content-background: #fff,
+
+        content-text-color: (
+            igx-color: ('grays', 900)
+        ),
+
+        weekend-text-color: (
+            igx-color: ('grays', 900)
+        ),
+
+        picker-text-color: (
+            igx-color: ('grays', 900)
+        ),
+
+        inactive-text-color: (
+            igx-color: ('grays', 500)
+        ),
     )
 );
 

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_card.scss

@@ -105,6 +105,22 @@ $_bootstrap-card: extend(
         outline-color: (
             igx-color: ('grays', 300)
         ),
+
+        header-text-color: (
+            igx-color: ('grays', 900)
+        ),
+
+        subtitle-text-color: (
+            igx-color: ('grays', 800)
+        ),
+
+        content-text-color: (
+            igx-color: ('grays', 800)
+        ),
+
+        actions-text-color: (
+            igx-color: ('grays', 900)
+        ),
     )
 );
 

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_drop-down.scss

@@ -222,7 +222,11 @@ $_bootstrap-drop-down: extend(
 
         selected-focus-item-text-color: #fff,
 
-        border-width: 1px
+        border-width: 1px,
+
+        disabled-item-text-color: (
+            igx-color: ('grays', 400)
+        ),
     )
 );
 

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_list.scss

@@ -158,6 +158,18 @@ $_bootstrap-list: extend(
             igx-color: ('grays', 100),
             hexrgba: (#fff)
         ),
+
+        item-text-color: (
+            igx-color: ('grays', 900)
+        ),
+
+        item-text-color-hover: (
+            igx-color: ('grays', 900)
+        ),
+
+        item-text-color-active: (
+            igx-color: ('grays', 900)
+        ),
     )
 );
 

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_pagination.scss

@@ -8,12 +8,16 @@
 
 /// Generates a light pagination schema.
 /// @type {Map}
-/// @prop {Color} text-color [currentColor] - The text color.
+/// @prop {Map} text-color [igx-color: ('grays', 800)] - The text color.
 /// @prop {Map} background-color [igx-color: ('grays', 100), hexrgba: #fff] - The background color of the paging panel.
 /// @prop {Map} border-color [igx-color: ('grays', 400)] - The border color of the paging panel.
 /// @see $default-palette
 $_light-pagination: (
-    text-color: currentColor,
+    variant: 'material',
+
+    text-color: (
+        igx-color: ('grays', 800)
+    ),
 
     background-color: (
         igx-color: ('grays', 100),
@@ -34,6 +38,8 @@ $_light-pagination: (
 $_fluent-pagination: extend(
     $_light-pagination,
     (
+        variant: 'material',
+
         background-color: (
             igx-color: 'surface'
         ),