igniteui-theming 2.0.0 → 2.1.0-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-theming",
-  "version": "2.0.0",
+  "version": "2.1.0-beta.1",
   "description": "A set of Sass variables, mixins, and functions for generating palettes, typography, and elevations used by Ignite UI components.",
   "main": "index.js",
   "scripts": {

package/sass/themes/schemas/components/dark/_index.scss

@@ -31,6 +31,7 @@
 @use './highlight' as *;
 @use './icon' as *;
 @use './input-group' as *;
+@use './label' as *;
 @use './list' as *;
 @use './navbar' as *;
 @use './navdrawer' as *;
@@ -87,6 +88,7 @@ $dark-material-schema: (
     highlight: $dark-highlight,
     icon: $dark-icon,
     input-group: $dark-input-group,
+    label: $dark-material-label,
     list: $dark-list,
     navbar: $dark-navbar,
     nav-drawer: $dark-navdrawer,
@@ -149,6 +151,7 @@ $dark-fluent-schema: (
     highlight: $dark-fluent-highlight,
     icon: $dark-fluent-icon,
     input-group: $dark-fluent-input-group,
+    label: $dark-fluent-label,
     list: $dark-fluent-list,
     navbar: $dark-fluent-navbar,
     nav-drawer: $dark-fluent-navdrawer,
@@ -211,6 +214,7 @@ $dark-bootstrap-schema: (
     highlight: $dark-bootstrap-highlight,
     icon: $dark-bootstrap-icon,
     input-group: $dark-bootstrap-input-group,
+    label: $dark-bootstrap-label,
     list: $dark-bootstrap-list,
     navbar: $dark-bootstrap-navbar,
     nav-drawer: $dark-bootstrap-navdrawer,
@@ -273,6 +277,7 @@ $dark-indigo-schema: (
     highlight: $dark-indigo-highlight,
     icon: $dark-indigo-icon,
     input-group: $dark-indigo-input-group,
+    label: $dark-indigo-label,
     list: $dark-indigo-list,
     navbar: $dark-indigo-navbar,
     nav-drawer: $dark-indigo-navdrawer,

package/sass/themes/schemas/components/dark/_label.scss

@@ -0,0 +1,33 @@
+@use '../light/label' as *;
+
+////
+/// @package theming
+/// @group schemas
+/// @access public
+////
+
+/// Generates a dark material label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('gray', 700)] - The label color.
+$dark-material-label: $material-label;
+
+/// Generates a dark fluent label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('gray', 900)] - The label color.
+$dark-fluent-label: $fluent-label;
+
+/// Generates a dark bootstrap label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('gray', 700)] - The label color.
+$dark-bootstrap-label: $bootstrap-label;
+
+/// Generates an dark indigo label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('surface')] - The label color.
+$dark-indigo-label: (
+    color: (
+        color: (
+            'surface',
+        ),
+    ),
+);

package/sass/themes/schemas/components/light/_icon.scss

@@ -10,11 +10,9 @@
 /// Generates a light icon schema.
 /// @type {Map}
 /// @prop {Color} color ["'currentColor'"] - The icon color.
-/// @prop {String} size [rem(24px)] - The icon size.
 /// @prop {Color} disabled-color ["'currentColor'"] - The disabled icon color.
 $light-icon: (
     color: "'currentColor'",
-    size: rem(24px),
     disabled-color: "'currentColor'",
 );
 

package/sass/themes/schemas/components/light/_index.scss

@@ -32,6 +32,7 @@
 @use './icon' as *;
 @use './input-group' as *;
 @use './list' as *;
+@use './label' as *;
 @use './navbar' as *;
 @use './navdrawer' as *;
 @use './overlay' as *;
@@ -87,6 +88,7 @@ $light-material-schema: (
     highlight: $light-highlight,
     icon: $light-icon,
     input-group: $light-input-group,
+    label: $material-label,
     list: $light-list,
     navbar: $light-navbar,
     nav-drawer: $light-navdrawer,
@@ -149,6 +151,7 @@ $light-fluent-schema: (
     highlight: $fluent-highlight,
     icon: $fluent-icon,
     input-group: $fluent-input-group,
+    label: $fluent-label,
     list: $fluent-list,
     navbar: $fluent-navbar,
     nav-drawer: $fluent-navdrawer,
@@ -211,6 +214,7 @@ $light-bootstrap-schema: (
     highlight: $bootstrap-highlight,
     icon: $bootstrap-icon,
     input-group: $bootstrap-input-group,
+    label: $bootstrap-label,
     list: $bootstrap-list,
     navbar: $bootstrap-navbar,
     nav-drawer: $bootstrap-navdrawer,
@@ -273,6 +277,7 @@ $light-indigo-schema: (
     highlight: $indigo-highlight,
     icon: $indigo-icon,
     input-group: $indigo-input-group,
+    label: $indigo-label,
     list: $indigo-list,
     navbar: $indigo-navbar,
     nav-drawer: $indigo-navdrawer,

package/sass/themes/schemas/components/light/_label.scss

@@ -0,0 +1,53 @@
+////
+/// @package theming
+/// @group schemas
+/// @access public
+////
+
+/// Generates a light material label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('gray', 700)] - The label color.
+$material-label: (
+    color: (
+        color: (
+            'gray',
+            700,
+        ),
+    ),
+);
+
+/// Generates a light fluent label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('gray', 900)] - The label color.
+$fluent-label: (
+    color: (
+        color: (
+            'gray',
+            900,
+        ),
+    ),
+);
+
+/// Generates a light bootstrap label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('gray', 700)] - The label color.
+$bootstrap-label: (
+    color: (
+        color: (
+            'gray',
+            700,
+        ),
+    ),
+);
+
+/// Generates an light indigo label schema.
+/// @type {Map}
+/// @prop {Color} color [color: ('gray', 900)] - The label color.
+$indigo-label: (
+    color: (
+        color: (
+            'gray',
+            900,
+        ),
+    ),
+);