fix(themes): do not set the global text color in igx-core

BREAKING CHANGE: Remove $base-color from igx-typography

Author: MPopov

projects/igniteui-angular/migrations/migration-collection.json

@@ -65,6 +65,11 @@
             "version": "9.0.0",
             "description": "Updates Ignite UI for Angular from v8.2.x to v9.0.0",
             "factory": "./update-9_0_0"
+        },
+        "migration-14": {
+            "version": "9.0.1",
+            "description": "Updates Ignite UI for Angular from v9.0.0 to v9.0.1",
+            "factory": "./update-9_0_1"
         }
     }
 }

projects/igniteui-angular/migrations/update-9_0_1/changes/theme-props.json

@@ -0,0 +1,10 @@
+{
+    "$schema": "../../common/schema/theme-props.schema.json",
+    "changes": [
+        {
+            "name": "$base-color",
+            "remove": true,
+            "owner": "igx-typography"
+        }
+    ]
+}

projects/igniteui-angular/migrations/update-9_0_1/index.spec.ts

@@ -0,0 +1,30 @@
+import * as path from 'path';
+
+// tslint:disable:no-implicit-dependencies
+import { virtualFs } from '@angular-devkit/core';
+import { EmptyTree } from '@angular-devkit/schematics';
+// tslint:disable-next-line:no-submodule-imports
+import { SchematicTestRunner, UnitTestTree } from '@angular-devkit/schematics/testing';
+
+describe('Update 9.0.1', () => {
+    let appTree: UnitTestTree;
+    const schematicRunner = new SchematicTestRunner('ig-migrate', path.join(__dirname, '../migration-collection.json'));
+    const configJson = {
+        defaultProject: 'testProj',
+        projects: {
+            testProj: {
+                sourceRoot: '/testSrc'
+            }
+        },
+        schematics: {
+            '@schematics/angular:component': {
+                prefix: 'appPrefix'
+            }
+        }
+      };
+
+    beforeEach(() => {
+        appTree = new UnitTestTree(new EmptyTree());
+        appTree.create('/angular.json', JSON.stringify(configJson));
+    });
+});

projects/igniteui-angular/migrations/update-9_0_1/index.ts

@@ -0,0 +1,17 @@
+import {
+    Rule,
+    SchematicContext,
+    Tree
+} from '@angular-devkit/schematics';
+import { UpdateChanges } from '../common/UpdateChanges';
+
+const version = '9.0.1';
+
+export default function(): Rule {
+    return (host: Tree, context: SchematicContext) => {
+        context.logger.info(`Applying migration for Ignite UI for Angular to version ${version}`);
+
+        const update = new UpdateChanges(__dirname, host, context);
+        update.applyChanges();
+    };
+}

projects/igniteui-angular/src/lib/core/styles/base/utilities/_functions.scss

@@ -315,10 +315,6 @@
     $saturations: (50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 'A100', 'A200', 'A400', 'A700');
     $shades: (50: .02, 100: .04, 200: .08, 300: .12, 400: .26, 500: .38, 600: .54, 700: .62, 800: .74, 900: .87);
 
-    @if global-variable-exists('igx-foreground-color') and type-of($igx-foreground-color) == 'color' {
-        $grays: $igx-foreground-color;
-    }
-
     $primary-palette: generate-palette($primary, $saturations);
     $secondary-palette: generate-palette($secondary, $saturations);
     $grayscale-palette: grayscale-palette($grays, $shades);

projects/igniteui-angular/src/lib/core/styles/themes/_core.scss

@@ -80,17 +80,14 @@
 @mixin igx-core(
     $print-layout: true,
     $direction: ltr,
-    $foreground-color: rgba(0, 0, 0, .87)
 ) {
     @if $direction != ltr and $direction != rtl {
         $direction: ltr !global;
     } @else {
         $direction: $direction !global;
     }
 
-    $igx-foreground-color: $foreground-color !global;
-
-    @include igx-typography($base-color: $foreground-color);
+    @include igx-typography();
     @include igx-vhelper();
 
     @if $print-layout == true {

projects/igniteui-angular/src/lib/core/styles/typography/_typography.scss

@@ -40,7 +40,6 @@
 @mixin igx-typography(
     $font-family: "'Titillium Web', sans-serif",
     $type-scale: $default-type-scale,
-    $base-color: $igx-foreground-color
 ) {
     // Maps type scale typographic categories
     // to native elements.
@@ -64,7 +63,6 @@
         font-family: unquote($font-family);
         font-size: $browser-context;
         line-height: $browser-line-height;
-        color: $base-color;
         font-size-adjust: 100%;
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;