neo.mjs 5.18.0 → 6.0.0

package/resources/scss/theme-light/form/field/Search.scss

@@ -1,9 +1,3 @@
-$neoMap: map-merge($neoMap, (
-    'searchfield-glyph-color': #1c60a0
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-searchfield
-        --searchfield-glyph-color: #{neo(searchfield-glyph-color)};
-    }
-}
+:root .neo-theme-light { // .neo-searchfield
+    --searchfield-glyph-color: #1c60a0;
+}

package/resources/scss/theme-light/form/field/Select.scss

@@ -1,21 +1,9 @@
-$neoMap: map-merge($neoMap, (
-    'selectfield-input-hint-color'              : #333,
-    'selectfield-input-hint-opacity'            : 0.6,
-    'selectfield-list-search-background-color'  : inherit,
-    'selectfield-list-search-color'             : red,
-    'selectfield-list-search-color-selected'    : red,
-    'selectfield-picker-container-border'       : 1px solid #1c60a0,
-    'selectfield-picker-container-border-radius': 3px
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-selectfield
-        --selectfield-input-hint-color              : #{neo(selectfield-input-hint-color)};
-        --selectfield-input-hint-opacity            : #{neo(selectfield-input-hint-opacity)};
-        --selectfield-list-search-background-color  : #{neo(selectfield-list-search-background-color)};
-        --selectfield-list-search-color             : #{neo(selectfield-list-search-color)};
-        --selectfield-list-search-color-selected    : #{neo(selectfield-list-search-color-selected)};
-        --selectfield-picker-container-border       : #{neo(selectfield-picker-container-border)};
-        --selectfield-picker-container-border-radius: #{neo(selectfield-picker-container-border-radius)};
-    }
-}
+:root .neo-theme-light { // .neo-selectfield
+    --selectfield-input-hint-color              : #333;
+    --selectfield-input-hint-opacity            : 0.6;
+    --selectfield-list-search-background-color  : inherit;
+    --selectfield-list-search-color             : red;
+    --selectfield-list-search-color-selected    : red;
+    --selectfield-picker-container-border       : 1px solid #1c60a0;
+    --selectfield-picker-container-border-radius: 3px;
+}

package/resources/scss/theme-light/form/field/Switch.scss

@@ -1,17 +1,7 @@
-$neoMap: map-merge($neoMap, (
-    'switchfield-active-color'    : white,
-    'switchfield-background-color': darkgrey,
-    'switchfield-checked'         : green,
-    'switchfield-inactive-color'  : grey,
-    'switchfield-thumb-color'     : white
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-switchfield
-        --switchfield-active-color    : #{neo(switchfield-active-color)};
-        --switchfield-background-color: #{neo(switchfield-background-color)};
-        --switchfield-checked         : #{neo(switchfield-checked)};
-        --switchfield-inactive-color  : #{neo(switchfield-inactive-color)};
-        --switchfield-thumb-color     : #{neo(switchfield-thumb-color)};
-    }
+:root .neo-theme-light { // .neo-switchfield
+    --switchfield-active-color    : white;
+    --switchfield-background-color: darkgrey;
+    --switchfield-checked         : green;
+    --switchfield-inactive-color  : grey;
+    --switchfield-thumb-color     : white;
 }

package/resources/scss/theme-light/form/field/Text.scss

@@ -1,67 +1,32 @@
-$neoMap: map-merge($neoMap, (
-    'textfield-border-color'                   : #ddd,
-    'textfield-border-color-active'            : #1c60a0,
-    'textfield-border-color-disabled'          : #ddd,
-    'textfield-border-color-hovered'           : #ddd,
-    'textfield-border-color-invalid'           : brown,
-    'textfield-border-color-readonly'          : #ddd,
-    'textfield-border-radius'                  : 3px,
-    'textfield-border-width'                   : 1px,
-    'textfield-input-background-color'         : #fff,
-    'textfield-input-background-color-disabled': #fff,
-    'textfield-input-background-color-readonly': #fbfbfb,
-    'textfield-input-color'                    : #000,
-    'textfield-input-color-disabled'           : #000,
-    'textfield-input-color-readonly'           : #000,
-    'textfield-input-font'                     : 400 13px/17px Arial,
-    'textfield-input-height'                   : 25px,
-    'textfield-input-padding'                  : 3px 6px 2px,
-    'textfield-input-placeholder-color'        : #333,
-    'textfield-input-placeholder-opacity'      : 0.6,
-    'textfield-label-color'                    : #666,
-    'textfield-label-color-disabled'           : #666,
-    'textfield-label-color-readonly'           : #666,
-    'textfield-label-top-margin'               : 0 0 3px,
-    'textfield-opacity-disabled'               : #{neo(neo-disabled-opacity)},
-    'textfield-opacity-readonly'               : 1,
-    'textfield-outline-active'                 : none,
-    'textfield-outline-hovered'                : none,
-    'textfield-sublabel-color'                 : #666,
-    'textfield-sublabel-font-size'             : 12px,
-    'textfield-sublabel-margin'                : 0 0 5px
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-textfield
-        --textfield-border-color                   : #{neo(textfield-border-color)};
-        --textfield-border-color-active            : #{neo(textfield-border-color-active)};
-        --textfield-border-color-disabled          : #{neo(textfield-border-color-disabled)};
-        --textfield-border-color-hovered           : #{neo(textfield-border-color-hovered)};
-        --textfield-border-color-invalid           : #{neo(textfield-border-color-invalid)};
-        --textfield-border-color-readonly          : #{neo(textfield-border-color-readonly)};
-        --textfield-border-radius                  : #{neo(textfield-border-radius)};
-        --textfield-border-width                   : #{neo(textfield-border-width)};
-        --textfield-input-background-color         : #{neo(textfield-input-background-color)};
-        --textfield-input-background-color-disabled: #{neo(textfield-input-background-color-disabled)};
-        --textfield-input-background-color-readonly: #{neo(textfield-input-background-color-readonly)};
-        --textfield-input-color                    : #{neo(textfield-input-color)};
-        --textfield-input-color-disabled           : #{neo(textfield-input-color-disabled)};
-        --textfield-input-color-readonly           : #{neo(textfield-input-color-readonly)};
-        --textfield-input-font                     : #{neo(textfield-input-font)};
-        --textfield-input-height                   : #{neo(textfield-input-height)};
-        --textfield-input-padding                  : #{neo(textfield-input-padding)};
-        --textfield-input-placeholder-color        : #{neo(textfield-input-placeholder-color)};
-        --textfield-input-placeholder-opacity      : #{neo(textfield-input-placeholder-opacity)};
-        --textfield-label-color                    : #{neo(textfield-label-color)};
-        --textfield-label-color-disabled           : #{neo(textfield-label-color-disabled)};
-        --textfield-label-color-readonly           : #{neo(textfield-label-color-readonly)};
-        --textfield-label-top-margin               : #{neo(textfield-label-top-margin)};
-        --textfield-opacity-disabled               : #{neo(textfield-opacity-disabled)};
-        --textfield-opacity-readonly               : #{neo(textfield-opacity-readonly)};
-        --textfield-outline-active                 : #{neo(textfield-outline-active)};
-        --textfield-outline-hovered                : #{neo(textfield-outline-hovered)};
-        --textfield-sublabel-color                 : #{neo(textfield-sublabel-color)};
-        --textfield-sublabel-font-size             : #{neo(textfield-sublabel-font-size)};
-        --textfield-sublabel-margin                : #{neo(textfield-sublabel-margin)};
-    }
+:root .neo-theme-light { // .neo-textfield
+    --textfield-border-color                   : #ddd;
+    --textfield-border-color-active            : #1c60a0;
+    --textfield-border-color-disabled          : #ddd;
+    --textfield-border-color-hovered           : #ddd;
+    --textfield-border-color-invalid           : brown;
+    --textfield-border-color-readonly          : #ddd;
+    --textfield-border-radius                  : 3px;
+    --textfield-border-width                   : 1px;
+    --textfield-input-background-color         : #fff;
+    --textfield-input-background-color-disabled: #fff;
+    --textfield-input-background-color-readonly: #fbfbfb;
+    --textfield-input-color                    : #000;
+    --textfield-input-color-disabled           : #000;
+    --textfield-input-color-readonly           : #000;
+    --textfield-input-font                     : 400 13px/17px Arial;
+    --textfield-input-height                   : 25px;
+    --textfield-input-padding                  : 3px 6px 2px;
+    --textfield-input-placeholder-color        : #333;
+    --textfield-input-placeholder-opacity      : 0.6;
+    --textfield-label-color                    : #666;
+    --textfield-label-color-disabled           : #666;
+    --textfield-label-color-readonly           : #666;
+    --textfield-label-top-margin               : 0 0 3px;
+    --textfield-opacity-disabled               : var(--neo-disabled-opacity);
+    --textfield-opacity-readonly               : 1;
+    --textfield-outline-active                 : none;
+    --textfield-outline-hovered                : none;
+    --textfield-sublabel-color                 : #666;
+    --textfield-sublabel-font-size             : 12px;
+    --textfield-sublabel-margin                : 0 0 5px;
 }

package/resources/scss/theme-light/form/field/trigger/Base.scss

@@ -1,15 +1,6 @@
-$neoMap: map-merge($neoMap, (
-    'trigger-background-color-hover': #fff,
-    'trigger-border-width'          : 1px,
-    'trigger-color'                 : #bbb,
-    'trigger-color-hover'           : #1c60a0
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light {
-        --trigger-background-color-hover: #{neo(trigger-background-color-hover)};
-        --trigger-border-width          : #{neo(trigger-border-width)};
-        --trigger-color                 : #{neo(trigger-color)};
-        --trigger-color-hover           : #{neo(trigger-color-hover)};
-    }
+:root .neo-theme-light {
+    --trigger-background-color-hover: #fff;
+    --trigger-border-width          : 1px;
+    --trigger-color                 : #bbb;
+    --trigger-color-hover           : #1c60a0;
 }

package/resources/scss/theme-light/form/field/trigger/Time.scss

@@ -1,11 +1,4 @@
-$neoMap: map-merge($neoMap, (
-    'trigger-time-background-color-hover': #1c60a0,
-    'trigger-time-pointer-color'         : #fff
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light {
-        --trigger-time-background-color-hover: #{neo(trigger-time-background-color-hover)};
-        --trigger-time-pointer-color         : #{neo(trigger-time-pointer-color)};
-    }
+:root .neo-theme-light {
+    --trigger-time-background-color-hover: #1c60a0;
+    --trigger-time-pointer-color         : #fff;
 }

package/resources/scss/theme-light/grid/Container.scss

@@ -1,17 +1,7 @@
-$neoMap: map-merge($neoMap, (
-    'grid-container-border-color'              : #ddd,
-    'grid-container-cell-background-color'     : #fff,
-    'grid-container-cell-background-color-even': #f2f2f2,
-    'grid-container-color'                     : #666,
-    'grid-container-header-cell-border-bottom' : 1px solid #ddd
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-grid-container
-        --grid-container-border-color              : #{neo(grid-container-border-color)};
-        --grid-container-cell-background-color     : #{neo(grid-container-cell-background-color)};
-        --grid-container-cell-background-color-even: #{neo(grid-container-cell-background-color-even)};
-        --grid-container-color                     : #{neo(grid-container-color)};
-        --grid-container-header-cell-border-bottom : #{neo(grid-container-header-cell-border-bottom)};
-    }
+:root .neo-theme-light { // .neo-grid-container
+    --grid-container-border-color              : #ddd;
+    --grid-container-cell-background-color     : #fff;
+    --grid-container-cell-background-color-even: #f2f2f2;
+    --grid-container-color                     : #666;
+    --grid-container-header-cell-border-bottom : 1px solid #ddd;
 }

package/resources/scss/theme-light/grid/View.scss

@@ -1,29 +1,13 @@
-$neoMap: map-merge($neoMap, (
-        'grid-cell-background-color-hover'                    : lighten(#33343d, 70%),
-        'grid-cellmodel-selected-cell-background-color'       : lighten(#64B5F6, 22%),
-        'grid-cellmodel-selected-cell-color'                  : #2b2b2b,
-        'grid-cellmodel-selected-column-cell-background-color': lighten(#4f558a, 52%),
-        'grid-cellmodel-selected-column-cell-color'           : #2b2b2b,
-        'grid-cellrowmodel-selected-cell-background-color'    : lighten(#64B5F6, 22%),
-        'grid-cellrowmodel-selected-cell-color'               : #2b2b2b,
-        'grid-cellrowmodel-selected-row-cell-background-color': lighten(#4f558a, 52%),
-        'grid-cellrowmodel-selected-row-cell-color'           : #2b2b2b,
-        'grid-rowmodel-selected-cell-background-color'        : lighten(#64B5F6, 22%),
-        'grid-rowmodel-selected-cell-color'                   : #2b2b2b
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-grid-view
-        --grid-cell-background-color-hover                    : #{neo(grid-cell-background-color-hover)};
-        --grid-cellmodel-selected-cell-background-color       : #{neo(grid-cellmodel-selected-cell-background-color)};
-        --grid-cellmodel-selected-cell-color                  : #{neo(grid-cellmodel-selected-cell-color)};
-        --grid-cellmodel-selected-column-cell-background-color: #{neo(grid-cellmodel-selected-column-cell-background-color)};
-        --grid-cellmodel-selected-column-cell-color           : #{neo(grid-cellmodel-selected-column-cell-color)};
-        --grid-cellrowmodel-selected-cell-background-color    : #{neo(grid-cellrowmodel-selected-cell-background-color)};
-        --grid-cellrowmodel-selected-cell-color               : #{neo(grid-cellrowmodel-selected-cell-color)};
-        --grid-cellrowmodel-selected-row-cell-background-color: #{neo(grid-cellrowmodel-selected-row-cell-background-color)};
-        --grid-cellrowmodel-selected-row-cell-color           : #{neo(grid-cellrowmodel-selected-row-cell-color)};
-        --grid-rowmodel-selected-cell-background-color        : #{neo(grid-rowmodel-selected-cell-background-color)};
-        --grid-rowmodel-selected-cell-color                   : #{neo(grid-rowmodel-selected-cell-color)};
-    }
+:root .neo-theme-light { // .neo-grid-view
+    --grid-cell-background-color-hover                    : #{lighten(#33343d, 70%)};
+    --grid-cellmodel-selected-cell-background-color       : #{lighten(#64B5F6, 22%)};
+    --grid-cellmodel-selected-cell-color                  : #2b2b2b;
+    --grid-cellmodel-selected-column-cell-background-color: #{lighten(#4f558a, 52%)};
+    --grid-cellmodel-selected-column-cell-color           : #2b2b2b;
+    --grid-cellrowmodel-selected-cell-background-color    : #{lighten(#64B5F6, 22%)};
+    --grid-cellrowmodel-selected-cell-color               : #2b2b2b;
+    --grid-cellrowmodel-selected-row-cell-background-color: #{lighten(#4f558a, 52%)};
+    --grid-cellrowmodel-selected-row-cell-color           : #2b2b2b;
+    --grid-rowmodel-selected-cell-background-color        : #{lighten(#64B5F6, 22%)};
+    --grid-rowmodel-selected-cell-color                   : #2b2b2b;
 }

package/resources/scss/theme-light/grid/header/Button.scss

@@ -1,15 +1,6 @@
-$neoMap: map-merge($neoMap, (
-    'grid-header-button-background-color': #5d83a7,
-    'grid-header-button-background-image': none,
-    'grid-header-button-color'           : #fff,
-    'grid-header-button-glyph-color'     : #fff
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-grid-header-button
-        --grid-header-button-background-color: #{neo(grid-header-button-background-color)};
-        --grid-header-button-background-image: #{neo(grid-header-button-background-image)};
-        --grid-header-button-color           : #{neo(grid-header-button-color)};
-        --grid-header-button-glyph-color     : #{neo(grid-header-button-glyph-color)};
-    }
+:root .neo-theme-light { // .neo-grid-header-button
+    --grid-header-button-background-color: #5d83a7;
+    --grid-header-button-background-image: none;
+    --grid-header-button-color           : #fff;
+    --grid-header-button-glyph-color     : #fff;
 }

package/resources/scss/theme-light/list/Base.scss

@@ -1,27 +1,12 @@
-$neoMap: map-merge($neoMap, (
-    'list-container-background-color'    : #fff,
-    'list-container-border'              : 0,
-    'list-container-list-color'          : lighten(#33343d, 20%),
-    'list-item-background-color'         : #fff,
-    'list-item-background-color-hover'   : lighten(#33343d, 70%),
-    'list-item-background-color-selected': lighten(#64B5F6, 22%),
-    'list-item-color-selected'           : #2b2b2b,
-    'list-item-glyph-color'              : lighten(#33343d, 20%),
-    'list-item-highlight-search-color'   : red,
-    'list-item-padding'                  : 5px
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-list-container
-        --list-container-background-color    : #{neo(list-container-background-color)};
-        --list-container-border              : #{neo(list-container-border)};
-        --list-container-list-color          : #{neo(list-container-list-color)};
-        --list-item-background-color         : #{neo(list-item-background-color)};
-        --list-item-background-color-hover   : #{neo(list-item-background-color-hover)};
-        --list-item-background-color-selected: #{neo(list-item-background-color-selected)};
-        --list-item-color-selected           : #{neo(list-item-color-selected)};
-        --list-item-glyph-color              : #{neo(list-item-glyph-color)};
-        --list-item-highlight-search-color   : #{neo(list-item-highlight-search-color)};
-        --list-item-padding                  : #{neo(list-item-padding)};
-    }
-}
+:root .neo-theme-light { // .neo-list-container
+    --list-container-background-color    : #fff;
+    --list-container-border              : 0;
+    --list-container-list-color          : #{lighten(#33343d, 20%)};
+    --list-item-background-color         : #fff;
+    --list-item-background-color-hover   : #{lighten(#33343d, 70%)};
+    --list-item-background-color-selected: #{lighten(#64B5F6, 22%)};
+    --list-item-color-selected           : #2b2b2b;
+    --list-item-glyph-color              : #{lighten(#33343d, 20%)};
+    --list-item-highlight-search-color   : red;
+    --list-item-padding                  : 5px;
+}

package/resources/scss/theme-light/menu/List.scss

@@ -1,45 +1,21 @@
-$neoMap: map-merge($neoMap, (
-    'menu-list-border-color'                  : #1c60a0,
-    'menu-list-box-shadow'                    : 0 5px 10px rgba(0,0,0,.4),
-    'menu-list-item-background-color'         : inherit,
-    'menu-list-item-background-color-disabled': inherit,
-    'menu-list-item-background-color-hover'   : inherit,
-    'menu-list-item-background-color-selected': inherit,
-    'menu-list-item-color'                    : inherit,
-    'menu-list-item-font-family'              : inherit,
-    'menu-list-item-font-weight'              : inherit,
-    'menu-list-item-icon-color'               : #1c60a0,
-    'menu-list-item-icon-color-disabled'      : #1c60a0,
-    'menu-list-item-icon-color-selected'      : #1c60a0,
-    'menu-list-item-icon-gap'                 : .4em,
-    'menu-list-item-height'                   : inherit,
-    'menu-list-item-line-height'              : inherit,
-    'menu-list-item-opacity-disabled'         : inherit,
-    'menu-list-item-outline-focus'            : none,
-    'menu-list-item-padding'                  : 5px,
-    'menu-list-item-text-transform'           : inherit
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-menu-list
-        --menu-list-border-color                  : #{neo(menu-list-border-color)};
-        --menu-list-box-shadow                    : #{neo(menu-list-box-shadow)};
-        --menu-list-item-background-color         : #{neo(menu-list-item-background-color)};
-        --menu-list-item-background-color-disabled: #{neo(menu-list-item-background-color-disabled)};
-        --menu-list-item-background-color-hover   : #{neo(menu-list-item-background-color-hover)};
-        --menu-list-item-background-color-selected: #{neo(menu-list-item-background-color-selected)};
-        --menu-list-item-color                    : #{neo(menu-list-item-color)};
-        --menu-list-item-font-family              : #{neo(menu-list-item-font-family)};
-        --menu-list-item-font-weight              : #{neo(menu-list-item-font-weight)};
-        --menu-list-item-icon-color               : #{neo(menu-list-item-icon-color)};
-        --menu-list-item-icon-color-disabled      : #{neo(menu-list-item-icon-color-disabled)};
-        --menu-list-item-icon-color-selected      : #{neo(menu-list-item-icon-color-selected)};
-        --menu-list-item-icon-gap                 : #{neo(menu-list-item-icon-gap)};
-        --menu-list-item-height                   : #{neo(menu-list-item-height)};
-        --menu-list-item-line-height              : #{neo(menu-list-item-line-height)};
-        --menu-list-item-opacity-disabled         : #{neo(menu-list-item-opacity-disabled)};
-        --menu-list-item-outline-focus            : #{neo(menu-list-item-outline-focus)};
-        --menu-list-item-padding                  : #{neo(menu-list-item-padding)};
-        --menu-list-item-text-transform           : #{neo(menu-list-item-text-transform)};
-    }
+:root .neo-theme-light { // .neo-menu-list
+    --menu-list-border-color                  : #1c60a0;
+    --menu-list-box-shadow                    : 0 5px 10px rgba(0,0,0,.4);
+    --menu-list-item-background-color         : inherit;
+    --menu-list-item-background-color-disabled: inherit;
+    --menu-list-item-background-color-hover   : inherit;
+    --menu-list-item-background-color-selected: inherit;
+    --menu-list-item-color                    : inherit;
+    --menu-list-item-font-family              : inherit;
+    --menu-list-item-font-weight              : inherit;
+    --menu-list-item-icon-color               : #1c60a0;
+    --menu-list-item-icon-color-disabled      : #1c60a0;
+    --menu-list-item-icon-color-selected      : #1c60a0;
+    --menu-list-item-icon-gap                 : .4em;
+    --menu-list-item-height                   : inherit;
+    --menu-list-item-line-height              : inherit;
+    --menu-list-item-opacity-disabled         : inherit;
+    --menu-list-item-outline-focus            : none;
+    --menu-list-item-padding                  : 5px;
+    --menu-list-item-text-transform           : inherit;
 }

package/resources/scss/theme-light/menu/Panel.scss

@@ -1,9 +1,3 @@
-$neoMap: map-merge($neoMap, (
-    'menu-border-color': #1c60a0
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-menu
-        --menu-border-color: #{neo(menu-border-color)};
-    }
+:root .neo-theme-light { // .neo-menu
+    --menu-border-color: #1c60a0;
 }

package/resources/scss/theme-light/tab/Container.scss

@@ -1,9 +1,3 @@
-$neoMap: map-merge($neoMap, (
-    'tab-container-content-border': 1px solid #ddd
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-tab-container
-        --tab-container-content-border: #{neo(tab-container-content-border)};
-    }
-}
+:root .neo-theme-light { // .neo-tab-container
+    --tab-container-content-border: 1px solid #ddd;
+}

package/resources/scss/theme-light/tab/Strip.scss

@@ -1,13 +1,5 @@
-$neoMap: map-merge($neoMap, (
-    'tab-indicator-background-color-active': #5d83a7,
-    'tab-strip-background-color'           : #ddd,
-    'tab-strip-height'                     : 3px
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-tab-strip
-        --tab-indicator-background-color-active: #{neo(tab-indicator-background-color-active)};
-        --tab-strip-background-color           : #{neo(tab-strip-background-color)};
-        --tab-strip-height                     : #{neo(tab-strip-height)};
-    }
-}
+:root .neo-theme-light { // .neo-tab-strip
+    --tab-indicator-background-color-active: #5d83a7;
+    --tab-strip-background-color           : #ddd;
+    --tab-strip-height                     : 3px;
+}

package/resources/scss/theme-light/tab/header/Button.scss

@@ -1,63 +1,30 @@
-$neoMap: map-merge($neoMap, (
-    'tab-button-background-color'               : #fff,
-    'tab-button-background-color-active'        : #ddd,
-    'tab-button-background-color-disabled'      : #fff,
-    'tab-button-background-color-hover'         : #fff,
-    'tab-button-background-image'               : none,
-    'tab-button-background-image-bottom'        : none,
-    'tab-button-background-image-left'          : none,
-    'tab-button-background-image-pressed'       : none,
-    'tab-button-background-image-pressed-bottom': none,
-    'tab-button-background-image-pressed-left'  : none,
-    'tab-button-background-image-pressed-right' : none,
-    'tab-button-background-image-right'         : none,
-    'tab-button-border'                         : none,
-    'tab-button-border-bottom'                  : none,
-    'tab-button-border-bottom-pressed'          : none,
-    'tab-button-border-pressed'                 : none,
-    'tab-button-border-radius'                  : 0,
-    'tab-button-gap'                            : 0,
-    'tab-button-glyph-color'                    : #bbb,
-    'tab-button-glyph-color-active'             : #1c60a0,
-    'tab-button-glyph-color-hover'              : #1c60a0,
-    'tab-button-glyph-color-pressed'            : #1c60a0,
-    'tab-button-height'                         : 25px,
-    'tab-button-height-pressed'                 : 25px,
-    'tab-button-margin-bottom'                  : 0,
-    'tab-button-padding'                        : 7px 12px 6px 12px,
-    'tab-button-text-color'                     : #2b2b2b,
-    'tab-button-text-transform'                 : uppercase
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-tab-header-button
-        --tab-button-background-color               : #{neo(tab-button-background-color)};
-        --tab-button-background-color-active        : #{neo(tab-button-background-color-active)};
-        --tab-button-background-color-disabled      : #{neo(tab-button-background-color-disabled)};
-        --tab-button-background-color-hover         : #{neo(tab-button-background-color-hover)};
-        --tab-button-background-image               : #{neo(tab-button-background-image)};
-        --tab-button-background-image-bottom        : #{neo(tab-button-background-image-bottom)};
-        --tab-button-background-image-left          : #{neo(tab-button-background-image-left)};
-        --tab-button-background-image-pressed       : #{neo(tab-button-background-image-pressed)};
-        --tab-button-background-image-pressed-bottom: #{neo(tab-button-background-image-pressed-bottom)};
-        --tab-button-background-image-pressed-left  : #{neo(tab-button-background-image-pressed-left)};
-        --tab-button-background-image-pressed-right : #{neo(tab-button-background-image-pressed-right)};
-        --tab-button-background-image-right         : #{neo(tab-button-background-image-right)};
-        --tab-button-border                         : #{neo(tab-button-border)};
-        --tab-button-border-bottom                  : #{neo(tab-button-border-bottom)};
-        --tab-button-border-bottom-pressed          : #{neo(tab-button-border-bottom-pressed)};
-        --tab-button-border-pressed                 : #{neo(tab-button-border-pressed)};
-        --tab-button-border-radius                  : #{neo(tab-button-border-radius)};
-        --tab-button-gap                            : #{neo(tab-button-gap)};
-        --tab-button-glyph-color                    : #{neo(tab-button-glyph-color)};
-        --tab-button-glyph-color-active             : #{neo(tab-button-glyph-color-active)};
-        --tab-button-glyph-color-hover              : #{neo(tab-button-glyph-color-hover)};
-        --tab-button-glyph-color-pressed            : #{neo(tab-button-glyph-color-pressed)};
-        --tab-button-height                         : #{neo(tab-button-height)};
-        --tab-button-height-pressed                 : #{neo(tab-button-height-pressed)};
-        --tab-button-margin-bottom                  : #{neo(tab-button-margin-bottom)};
-        --tab-button-padding                        : #{neo(tab-button-padding)};
-        --tab-button-text-color                     : #{neo(tab-button-text-color)};
-        --tab-button-text-transform                 : #{neo(tab-button-text-transform)};
-    }
+:root .neo-theme-light { // .neo-tab-header-button
+    --tab-button-background-color               : #fff;
+    --tab-button-background-color-active        : #ddd;
+    --tab-button-background-color-disabled      : #fff;
+    --tab-button-background-color-hover         : #fff;
+    --tab-button-background-image               : none;
+    --tab-button-background-image-bottom        : none;
+    --tab-button-background-image-left          : none;
+    --tab-button-background-image-pressed       : none;
+    --tab-button-background-image-pressed-bottom: none;
+    --tab-button-background-image-pressed-left  : none;
+    --tab-button-background-image-pressed-right : none;
+    --tab-button-background-image-right         : none;
+    --tab-button-border                         : none;
+    --tab-button-border-bottom                  : none;
+    --tab-button-border-bottom-pressed          : none;
+    --tab-button-border-pressed                 : none;
+    --tab-button-border-radius                  : 0;
+    --tab-button-gap                            : 0;
+    --tab-button-glyph-color                    : #bbb;
+    --tab-button-glyph-color-active             : #1c60a0;
+    --tab-button-glyph-color-hover              : #1c60a0;
+    --tab-button-glyph-color-pressed            : #1c60a0;
+    --tab-button-height                         : 25px;
+    --tab-button-height-pressed                 : 25px;
+    --tab-button-margin-bottom                  : 0;
+    --tab-button-padding                        : 7px 12px 6px 12px;
+    --tab-button-text-color                     : #2b2b2b;
+    --tab-button-text-transform                 : uppercase;
 }

package/resources/scss/theme-light/table/Container.scss

@@ -1,23 +1,10 @@
-$neoMap: map-merge($neoMap, (
-    'table-container-border-color'              : #ddd,
-    'table-container-cell-background-color'     : #fff,
-    'table-container-cell-background-color-even': #f2f2f2,
-    'table-container-cell-border-bottom'        : 1px solid #ddd,
-    'table-container-cell-height'               : 32px,
-    'table-container-cell-padding'              : 2px 10px 2px,
-    'table-container-color'                     : #666,
-    'table-container-header-cell-border-bottom' : 1px solid #ddd
-));
-
-@if $useCssVars == true {
-    :root .neo-theme-light { // .neo-table-container
-        --table-container-border-color              : #{neo(table-container-border-color)};
-        --table-container-cell-background-color     : #{neo(table-container-cell-background-color)};
-        --table-container-cell-background-color-even: #{neo(table-container-cell-background-color-even)};
-        --table-container-cell-border-bottom        : #{neo(table-container-cell-border-bottom)};
-        --table-container-cell-height               : #{neo(table-container-cell-height)};
-        --table-container-cell-padding              : #{neo(table-container-cell-padding)};
-        --table-container-color                     : #{neo(table-container-color)};
-        --table-container-header-cell-border-bottom : #{neo(table-container-header-cell-border-bottom)};
-    }
+:root .neo-theme-light { // .neo-table-container
+    --table-container-border-color              : #ddd;
+    --table-container-cell-background-color     : #fff;
+    --table-container-cell-background-color-even: #f2f2f2;
+    --table-container-cell-border-bottom        : 1px solid #ddd;
+    --table-container-cell-height               : 32px;
+    --table-container-cell-padding              : 2px 10px 2px;
+    --table-container-color                     : #666;
+    --table-container-header-cell-border-bottom : 1px solid #ddd;
 }