Merge branch 'simeonoff/indigo-theme' of https://github.com/IgniteUI/igniteui-angular into mpopov/watermark-docs

� Conflicts:
�	projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_watermark.scss

Author: MPopov

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

@@ -314,62 +314,71 @@ $bem--sep-mod-val: if(variable-exists(bem--sep-mod-val), $bem--sep-mod-val, '-')
 }
 
 /// @alias bem-selector
+/// @see bem-selector
 @mixin bem($block, $e: null, $elem: null, $m: null, $mod: null, $mods: null) {
     #{bem-selector($block, $e: $e, $elem: $elem, $m: $m, $mod: $mod, $mods: $mods)} {
         @content;
     }
 }
 
 /// @alias bem-block
+/// @see bem-block
 @mixin block($block) {
     @include bem-block($block) {
         @content;
     }
 }
 
 /// @alias bem-elem
+/// @see bem-elem
 @mixin elem($elem, $m: null, $mod: null, $mods: null) {
     @include bem-elem($elem, $m: $m, $mod: $mod, $mods: $mods) {
         @content;
     }
 }
 
 /// @alias bem-mod
+/// @see bem-mod
 @mixin mod($mod) {
     @include bem-mod($mod) {
         @content;
     }
 }
 
 /// @alias bem-mods
+/// @see bem-mods
 @mixin mods($mods...) {
     @include bem-mods($mods...) {
         @content;
     }
 }
 
 /// @alias bem-block
+/// @see bem-block
 @mixin b($block) {
     @include bem-block($block) {
         @content;
     }
 }
 
 /// @alias bem-elem
+/// @see bem-elem
 @mixin e($elem, $m: null, $mod: null, $mods: null) {
     @include bem-elem($elem, $m: $m, $mod: $mod, $mods: $mods) {
         @content;
     }
 }
 
 /// @alias bem-mod
+/// @see bem-mod
 @mixin m($mod) {
     @include bem-mod($mod) {
         @content;
     }
 }
 
 /// @alias bem-mods
+/// @see bem-mods
 @mixin mx($mods...) {
     @include bem-mods($mods...) {
         @content;

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

@@ -143,7 +143,12 @@
     @return $rgba;
 }
 
+/// Converts a rgba color to a hexidecimal color.
+///
+/// An alias of hexrgba.
+/// @access public
 /// @alias hexrgba
+/// @see hexrgba
 @function to-opaque($rgba, $background: #fff) {
     @return hexrgba($rgba, $background);
 }
@@ -272,7 +277,7 @@
 }
 
 /// Extends a Map object with the properties of another Map object.
-/// @access private
+/// @access public
 /// @param {Map...} $maps - The source map to get extended.
 /// @returns {Map} - Returns the merged maps.
 @function extend($maps...) {

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

@@ -72,6 +72,7 @@ $default-dark-palette: igx-palette(
 /// @access public
 /// @group palettes
 /// @alias default-palette
+/// @see $default-palette
 $light-palette: $default-palette;
 
 /// Same as $light-palette but with modified grays and surface colors.

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

@@ -2,13 +2,15 @@
 
 ////
 /// @group schemas
-/// @access private
+/// @access public
 /// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
 ////
 
 /// Generates a dark action-strip schema.
 /// @type {Map}
 /// @property {Map} actions-background [igx-color: ('grays', 200), hexrgba: #000, rgba: .8]- actions container background.
+/// @requires {function} extend
+/// @requires $_light-action-strip
 /// @see $default-palette
 $_dark-action-strip: extend(
     $_light-action-strip,

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

@@ -1,7 +1,7 @@
 @import '../light/avatar';
 ////
 /// @group schemas
-/// @access private
+/// @access public
 /// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
 ////
 

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

@@ -2,31 +2,31 @@
 
 ////
 /// @group schemas
-/// @access private
+/// @access public
 /// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
 ////
 
 /// Generates a dark badge schema.
 /// @type {Map}
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_light-badge
 /// @see $default-palette
 $_dark-badge: extend($_light-badge);
 
 /// Generates a dark fluent badge schema.
 /// @type {Map}
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_fluent-badge
 $_dark-fluent-badge: extend($_fluent-badge);
 
 /// Generates a dark bootstrap badge schema.
 /// @type {Map}
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_bootstrap-badge
 $_dark-bootstrap-badge: extend($_bootstrap-badge);
 
 /// Generates a dark indigo badge schema.
 /// @type {Map}
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_indigo-badge
 $_dark-indigo-badge: extend($_indigo-badge);

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

@@ -1,26 +1,27 @@
 @import '../light/banner';
 ////
 /// @group schemas
-/// @access private
+/// @access public
 /// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
 ////
 
 /// Generates a dark banner schema.
 /// @type {Map}
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_light-banner
 /// @see $default-palette
 $_dark-banner: extend($_light-banner);
 
 /// Generates a dark fluent banner schema.
 /// @type {Map}
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_fluent-banner
 $_dark-fluent-banner: extend($_fluent-banner);
 
 /// Generates a dark bootstrap banner schema.
 /// @type {Map}
-/// @requires extend
+/// @property {Map} banner-background [#333]- The background color used banner background.
+/// @requires {function} extend
 /// @requires $_bootstrap-banner
 $_dark-bootstrap-banner: extend(
     $_bootstrap-banner,
@@ -31,6 +32,6 @@ $_dark-bootstrap-banner: extend(
 
 /// Generates a dark indigo banner schema.
 /// @type {Map}
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_indigo-banner
 $_dark-indigo-banner: extend($_indigo-banner);

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

@@ -1,7 +1,7 @@
 @import '../light/bottom-nav';
 ////
 /// @group schemas
-/// @access private
+/// @access public
 /// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
 ////
 
@@ -37,8 +37,8 @@ $_dark-bootstrap-bottom-nav: extend($_bootstrap-bottom-nav, $_base-dark-bottom-n
 /// Generates a dark indigo bottom-nav schema based on a mix of $_indigo-bottom-nav and $_base-dark-bottom-nav
 /// @type {Map}
 /// @prop {Map} background [igx-color: 'surface'] - The background color used for the bottom-nav.
-/// @prop {Color} active-item-color [#fff] - The text-color used for the active color.
-/// @prop {Map} idle-item-color [igx-color: #fff, rgba: .6] - The text-color used for the idle color.
+/// @prop {Color} active-item-color [igx-contrast-color: 'surface'] - The text-color used for the active color.
+/// @prop {Map} idle-item-color [igx-contrast-color: 'surface', rgba: .6] - The text-color used for the idle color.
 /// @requires {function} extend
 /// @requires $_indigo-bottom-nav
 /// @requires $_base-dark-bottom-nav

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

@@ -1,17 +1,17 @@
 @import '../light/button-group';
 ////
 /// @group schemas
-/// @access private
+/// @access public
 /// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
 ////
 
 
 /// Generates the base dark button-group schema.
 /// @type {Map}
 /// @prop {Color} item-background [#222] - The background color for button group items.
-/// @prop {map} item-border-color [igx-color: ('grays', 400), hexrgba: #222] - The border color for button group items.
-/// @prop {map} item-selected-border-color [igx-color: ('grays', 500), hexrgba: #222] - The border color for button group selected items.
-/// @prop {map} item-disabled-border: [igx-color: ('grays', 400), hexrgba: #222] - The border color for button group disabled items.
+/// @prop {Map} item-border-color [igx-color: ('grays', 400), hexrgba: #222] - The border color for button group items.
+/// @prop {Map} item-selected-border-color [igx-color: ('grays', 500), hexrgba: #222] - The border color for button group selected items.
+/// @prop {Map} item-disabled-border: [igx-color: ('grays', 400), hexrgba: #222] - The border color for button group disabled items.
 $_base-dark-button-group: (
     item-background: #222,
 
@@ -42,15 +42,15 @@ $_dark-button-group: extend($_light-button-group, $_base-dark-button-group);
 /// Generates a dark fluent button-group schema based on a mix of $_fluent-button-group and $_base-dark-button-group
 /// @type {Map}
 ///
-/// @prop {map} item-border-color [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group items.
-/// @prop {map} item-selected-border-color [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group selected items.
-/// @prop {map} item-disabled-border: [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group disabled items.
-/// @prop {map} item-text-color [igx-color: ('grays', 900)] - The text color for button group items.
-/// @prop {map} item-hover-text-color [igx-color: ('primary', 200)] - The text color for button group items on hover.
+/// @prop {Map} item-border-color [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group items.
+/// @prop {Map} item-selected-border-color [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group selected items.
+/// @prop {Map} item-disabled-border: [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group disabled items.
+/// @prop {Map} item-text-color [igx-color: ('grays', 900)] - The text color for button group items.
+/// @prop {Map} item-hover-text-color [igx-color: ('primary', 200)] - The text color for button group items on hover.
 /// @prop {Color} item-hover-background [#222] - The background color for button group items on hover.
-/// @prop {map} item-selected-background [igx-color: ('grays', 100)] - The background color for button group selected items.
-/// @prop {map} item-selected-hover-background [igx-color: ('grays', 100)] - The background color for button group selected items on hover.
-/// @prop {map} item-selected-text-color [igx-color: ('primary', 200)] - The text color for button group selected items.
+/// @prop {Map} item-selected-background [igx-color: ('grays', 100)] - The background color for button group selected items.
+/// @prop {Map} item-selected-hover-background [igx-color: ('grays', 100)] - The background color for button group selected items on hover.
+/// @prop {Map} item-selected-text-color [igx-color: ('primary', 200)] - The text color for button group selected items.
 /// @prop {Color} disabled-background-color [#222] - The background color for button group disabled items.
 ///
 /// @requires {function} extend

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

@@ -1,7 +1,7 @@
 @import '../light/button';
 ////
 /// @group schemas
-/// @access private
+/// @access public
 /// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
 ////
 
@@ -12,7 +12,7 @@
 /// @prop {Map} flat-focus-background [igx-color: ('secondary', 400), rgba: .24] - The focus background color of a flat button.
 /// @prop {Map} icon-hover-background [igx-color: ('grays', 300)] - The hover background color of an icon button.
 /// @prop {Map} disabled-background [igx-color: ('grays', 200)] - The disabled background color of raised, fab, or icon buttons.
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_light-button
 /// @see $default-palette
 $_dark-button: extend(
@@ -44,7 +44,7 @@ $_dark-button: extend(
 /// @prop {Map} flat-hover-icon-color [igx-color: ('primary', 200)] - The icon color of a flat button on hover.
 /// @prop {Map} flat-focus-icon-color [igx-color: ('primary', 200)] - The icon color of a flat button on focus.
 /// @prop {Map} flat-hover-text-color [igx-color: ('primary', 200)] - The text color of a flat button on hover.
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_fluent-button
 $_dark-fluent-button: extend(
     $_fluent-button,
@@ -69,7 +69,10 @@ $_dark-fluent-button: extend(
 
 /// Generates a dark bootstrap button schema.
 /// @type {Map}
-/// @requires extend
+/// @prop {Map} disabled-color [igx-color: ('primary', 900)] - The disabled text/icon color of a button.
+/// @prop {Map} disabled-background [igx-color: ('primary', 900), darken: 5%] - The disabled background color of raised, fab, or icon buttons.
+/// @prop {Map} outlined-disabled-outline-color [igx-color: ('primary', 900), darken: 5%] - The border color of an outlined button.
+/// @requires {function} extend
 /// @requires $_bootstrap-button
 $_dark-bootstrap-button: extend(
     $_bootstrap-button,
@@ -93,12 +96,12 @@ $_dark-bootstrap-button: extend(
 /// Generates a dark indigo button schema.
 /// @type {Map}
 ///
-/// @prop {map} outlined-hover-background [#fff] - The hover background color of an outlined button.
+/// @prop {Map} outlined-hover-background [#fff] - The hover background color of an outlined button.
 /// @prop {Color} outlined-hover-text-color [(igx-color: 'surface')] - The hover text color of an outlined button.
-/// @prop {map} outlined-focus-background [#fff] - The focus background color of an outlined button.
+/// @prop {Map} outlined-focus-background [#fff] - The focus background color of an outlined button.
 /// @prop {Color} outlined-focus-text-color [(igx-color: 'surface')] - The focus text color of an outlined button.
 ///
-/// @requires extend
+/// @requires {function} extend
 /// @requires $_indigo-button
 $_dark-indigo-button: extend(
     $_indigo-button,