neo.mjs 6.9.7 → 6.9.8

package/resources/scss/theme-neo-light/button/Base.scss

@@ -0,0 +1,117 @@
+$background-color: #fff;
+$border-color    : #ddd;
+$border-style    : solid;
+$border-width    : 1px;
+$text-color      : #1c60a0;
+
+:root .neo-theme-neo-light { // .neo-button
+    --button-background-color                   : #29F5AA;
+    --button-background-color-active            : #0AE192;
+    --button-background-color-disabled          : #{$background-color};
+    --button-background-color-hover             : #11F4A1;
+    --button-background-image                   : none;
+    --button-background-gradient-end            : #323536;
+    --button-background-gradient-start          : #434749;
+    --button-badge-background-color             : #{$text-color};
+    --button-badge-color                        : #{$background-color};
+    --button-badge-margin-left                  : -10px;
+    --button-badge-margin-top                   : -10px;
+    --button-border                             : none;
+    --button-border-active                      : none;
+    --button-border-disabled                    : none;
+    --button-border-hover                       : none;
+    --button-border-pressed                     : #{$border-width} #{$border-style} #{$text-color};
+    --button-border-radius                      : 8px;
+    --button-glyph-color                        : #{$text-color};
+    --button-glyph-color-active                 : #{$text-color};
+    --button-glyph-color-disabled               : #{$text-color};
+    --button-glyph-color-hover                  : #{$text-color};
+    --button-height                             : 48px;
+    --button-margin                             : 2px;
+    --button-opacity-disabled                   : var(--neo-disabled-opacity);
+    --button-outline-active                     : none;
+    --button-padding                            : 5px 16px 5px 16px;
+    --button-ripple-background-color            : #{lighten($text-color, 50%)};
+    --button-text-color                         : black;
+    --button-text-color-active                  : black;
+    --button-text-color-disabled                : black;
+    --button-text-color-hover                   : black;
+    --button-text-font-family                   : Source Sans Pro, sans-serif;
+    --button-text-font-size                     : 14px;
+    --button-text-font-weight                   : 600;
+    --button-text-line-height                   : 11px;
+    --button-text-transform                     : none;
+    --button-use-gradients                      : false;
+
+    // {module: Button; ui: --ghost}
+    --button-ghost-background-color             : var(--button-text-color);
+    --button-ghost-background-color-active      : #{$border-color};
+    --button-ghost-background-color-disabled    : inherit;
+    --button-ghost-background-color-hover       : var(--button-text-color);
+    --button-ghost-background-image             : none;
+    --button-ghost-badge-background-color       : var(--button-badge-color);
+    --button-ghost-badge-color                  : var(--button-badge-background-color);
+    --button-ghost-border                       : #{$border-width} #{$border-style} var(--button-background-color);
+    --button-ghost-border-active                : #{$border-width} #{$border-style} #{$border-color};
+    --button-ghost-border-disabled              : inherit;
+    --button-ghost-border-hover                 : #{$border-width} #{$border-style} #{$text-color};
+    --button-ghost-border-pressed               : #{$border-width} #{$border-style} #{$text-color};
+    --button-ghost-glyph-color                  : var(--button-background-color);
+    --button-ghost-glyph-color-active           : var(--button-background-color);
+    --button-ghost-glyph-color-disabled         : inherit;
+    --button-ghost-glyph-color-hover            : var(--button-background-color);
+    --button-ghost-opacity-disabled             : var(--neo-disabled-opacity);
+    --button-ghost-ripple-background-color      : inherit;
+    --button-ghost-text-color                   : var(--button-background-color);
+    --button-ghost-text-color-active            : var(--button-background-color);
+    --button-ghost-text-color-disabled          : inherit;
+    --button-ghost-text-color-hover             : var(--button-background-color);
+
+    // {module: Button; ui: --secondary}
+    --button-secondary-background-color         : transparent;
+    --button-secondary-background-color-active  : #E6E7E6;
+    --button-secondary-background-color-disabled: inherit;
+    --button-secondary-background-color-hover   : #F3F3F3;
+    --button-secondary-background-image         : none;
+    --button-secondary-badge-background-color   : var(--button-badge-color);
+    --button-secondary-badge-color              : var(--button-badge-background-color);
+    --button-secondary-border                   : 1px solid #D3D7D2;
+    --button-secondary-border-active            : 1px solid #D3D7D2;
+    --button-secondary-border-disabled          : inherit;
+    --button-secondary-border-hover             : 1px solid #D3D7D2;
+    --button-secondary-border-pressed           : 1px solid #D3D7D2;
+    --button-secondary-glyph-color              : var(--button-background-color);
+    --button-secondary-glyph-color-active       : var(--button-background-color);
+    --button-secondary-glyph-color-disabled     : inherit;
+    --button-secondary-glyph-color-hover        : var(--button-background-color);
+    --button-secondary-opacity-disabled         : var(--neo-disabled-opacity);
+    --button-secondary-ripple-background-color  : inherit;
+    --button-secondary-text-color               : black;
+    --button-secondary-text-color-active        : black;
+    --button-secondary-text-color-disabled      : inherit;
+    --button-secondary-text-color-hover         : black;
+
+    // {module: Button; ui: --tertiary}
+    --button-tertiary-background-color          : transparent;
+    --button-tertiary-background-color-active   : #{$border-color};
+    --button-tertiary-background-color-disabled : inherit;
+    --button-tertiary-background-color-hover    : var(--button-background-color-hover);
+    --button-tertiary-background-image          : none;
+    --button-tertiary-badge-background-color    : var(--button-badge-background-color);
+    --button-tertiary-badge-color               : var(--button-badge-color);
+    --button-tertiary-border                    : #{$border-width} #{$border-style} transparent;
+    --button-tertiary-border-active             : #{$border-width} #{$border-style} #{$border-color};
+    --button-tertiary-border-disabled           : inherit;
+    --button-tertiary-border-hover              : #{$border-width} #{$border-style} #{$text-color};
+    --button-tertiary-border-pressed            : #{$border-width} #{$border-style} #{$text-color};
+    --button-tertiary-glyph-color               : var(--button-glyph-color);
+    --button-tertiary-glyph-color-active        : var(--button-glyph-color);
+    --button-tertiary-glyph-color-disabled      : inherit;
+    --button-tertiary-glyph-color-hover         : var(--button-glyph-color);
+    --button-tertiary-opacity-disabled          : var(--neo-disabled-opacity);
+    --button-tertiary-ripple-background-color   : inherit;
+    --button-tertiary-text-color                : var(--button-text-color);
+    --button-tertiary-text-color-active         : var(--button-text-color);
+    --button-tertiary-text-color-disabled       : inherit;
+    --button-tertiary-text-color-hover          : var(--button-text-color);
+}

package/resources/scss/theme-neo-light/calendar/view/EditEventContainer.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-calendar-edit-event-container
+    --calendar-edit-event-background-color: #fff;
+    --calendar-edit-event-border-color    : #1c60a0;
+    --calendar-edit-event-box-shadow      : 0 5px 10px rgba(0,0,0,.4);
+}

package/resources/scss/theme-neo-light/calendar/view/MainContainer.scss

@@ -0,0 +1,23 @@
+:root .neo-theme-neo-light { // .neo-calendar-maincontainer
+    --calendar-border-color              : #ddd;
+    --event-blue-background-color        : rgba(  0,  80, 181, 0.1);
+    --event-blue-background-color-focus  : rgba(  0,  80, 181, 0.6);
+    --event-blue-color                   : rgb(   0,  80, 181);
+    --event-green-background-color       : rgba(  0, 128,   0, 0.1);
+    --event-green-background-color-focus : rgba(  0, 128,   0, 0.6);
+    --event-green-color                  : rgb(   0, 128,   0);
+    --event-orange-background-color      : rgba(255, 100,   0, 0.1);
+    --event-orange-background-color-focus: rgba(255, 100,   0, 0.6);
+    --event-orange-color                 : rgb( 255, 100,   0);
+    --event-pink-background-color        : rgba(255,  20, 147, 0.1);
+    --event-pink-background-color-focus  : rgba(255,  20, 147, 0.6);
+    --event-pink-color                   : rgb( 255,  20, 147);
+    --event-red-background-color         : rgba(255,   0,   0, 0.1);
+    --event-red-background-color-focus   : rgba(255,   0,   0, 0.6);
+    --event-red-color                    : rgb( 255,   0,   0);
+    --event-yellow-background-color      : rgba(255, 204,   0, 0.1);
+    --event-yellow-background-color-focus: rgba(255, 204,   0, 0.6);
+    --event-yellow-border-color          : rgb( 255, 204,   0);
+    --event-yellow-color                 : rgb( 170, 170,   0);
+    --event-yellow-color-focus           : rgb( 170, 170,   0);
+}

package/resources/scss/theme-neo-light/calendar/view/SettingsContainer.scss

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light { // .neo-calendar-settingscontainer
+    --calendar-settings-header-background-color: #f2f2f2;
+}

package/resources/scss/theme-neo-light/calendar/view/YearComponent.scss

@@ -0,0 +1,10 @@
+:root .neo-theme-neo-light { // .neo-calendar-yearcomponent
+    --c-y-cell-border-color     : #ddd;
+    --c-y-cell-color            : #555;
+    --c-y-month-color           : #555;
+    --c-y-today-background-color: red;
+    --c-y-today-color           : #fff;
+    --c-y-week-background-color : #f2f2f2;
+    --c-y-week-color            : #555;
+    --c-y-year-color            : #1c60a0;
+}

package/resources/scss/theme-neo-light/calendar/view/calendars/EditContainer.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-calendar-edit-container
+    --calendar-edit-calendar-background-color: #fff;
+    --calendar-edit-calendar-border-color    : #1c60a0;
+    --calendar-edit-calendar-box-shadow      : 0 5px 10px rgba(0,0,0,.4);
+}

package/resources/scss/theme-neo-light/calendar/view/calendars/List.scss

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light { // .neo-calendars-list
+    --calendars-list-edit-icon-color: #1c60a0;
+}

package/resources/scss/theme-neo-light/calendar/view/month/Component.scss

@@ -0,0 +1,10 @@
+:root .neo-theme-neo-light { // .neo-calendar-monthcomponent
+    --c-m-background-color        : #fff;
+    --c-m-border-color            : #ddd;
+    --c-m-day-name-color          : #666;
+    --c-m-day-number-color        : #666;
+    --c-m-month-name-color        : #444;
+    --c-m-scroll-box-shadow       : 0 0 1.56em 0.78em #fff, 0 0 3.9em 1.95em #1c60a0;
+    --c-m-weekend-background-color: rgba(240, 240, 240, .35);
+    --c-m-year-color              : #1c60a0;
+}

package/resources/scss/theme-neo-light/calendar/view/week/Component.scss

@@ -0,0 +1,13 @@
+:root .neo-theme-neo-light { // .neo-calendar-weekcomponent
+    --c-w-background-color                  : #fff;
+    --c-w-border-color                      : #ddd;
+    --c-w-event-resizable-color             : #1c60a0;
+    --c-w-header-background-color           : #fff;
+    --c-w-header-date-background-color-hover: #eee;
+    --c-w-header-date-color                 : #666;
+    --c-w-header-date-color-hover           : #666;
+    --c-w-header-day-color                  : #666;
+    --c-w-header-today-background-color     : red;
+    --c-w-header-today-color                : #fff;
+    --c-w-weekend-background-color          : rgba(240, 240, 240, .35);
+}

package/resources/scss/theme-neo-light/component/Base.scss

@@ -0,0 +1,6 @@
+:root .neo-theme-neo-light {
+    --aligned-bottom-box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);
+    --aligned-left-box-shadow  : -2px 0px 10px rgba(0, 0, 0, 0.3);
+    --aligned-right-box-shadow : 2px 0px 10px rgba(0, 0, 0, 0.3);
+    --aligned-top-box-shadow   : 0px -2px 10px rgba(0, 0, 0, 0.3);
+}

package/resources/scss/theme-neo-light/component/BoxLabel.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-box-label
+    --boxlabel-background-color: #fff;
+    --boxlabel-border          : 1px solid #ddd;
+    --boxlabel-color           : #000;
+}

package/resources/scss/theme-neo-light/component/Chip.scss

@@ -0,0 +1,14 @@
+:root .neo-theme-neo-light { // .neo-chip
+    --chip-align-items             : center;
+    --chip-border                  : 1px solid #ddd;
+    --chip-border-color-focus      : #1c60a0;
+    --chip-border-radius           : 15px;
+    --chip-close-button-color      : #ddd;
+    --chip-close-button-color-hover: #1c60a0;
+    --chip-glyph-color             : #1c60a0;
+    --chip-height                  : 30px;
+    --chip-justify-content         : center;
+    --chip-text-align              : left;
+    --chip-text-color              : #000;
+    --chip-text-font-size          : 12px;
+}

package/resources/scss/theme-neo-light/component/DateSelector.scss

@@ -0,0 +1,24 @@
+:root .neo-theme-neo-light { // .neo-dateselector
+    --dateselector-background-color              : #323232;
+    --dateselector-border-color                  : #ddd;
+    --dateselector-cell-background-color         : #fff;
+    --dateselector-cell-background-color-disabled: #fff;
+    --dateselector-cell-color                    : #000;
+    --dateselector-cell-color-disabled           : #999;
+    --dateselector-cell-color-selected           : #fff;
+    --dateselector-cell-opacity-disabled         : 1;
+    --dateselector-cell-today-border-color       : #5d83a7;
+    --dateselector-color                         : #000;
+    --dateselector-content-border-top            : none;
+    --dateselector-header-background-color       : #fff;
+    --dateselector-header-border-bottom          : none;
+    --dateselector-header-cell-background-color  : #5d83a7;
+    --dateselector-header-cell-border-bottom     : none;
+    --dateselector-header-cell-color             : #fff;
+    --dateselector-header-month-text-color       : #000;
+    --dateselector-header-year-text-color        : #1c60a0;
+    --dateselector-nav-button-background-color   : #fff;
+    --dateselector-nav-button-color              : #bbb;
+    --dateselector-nav-button-color-hover        : #1c60a0;
+    --dateselector-nav-button-inner-border       : none;
+}

package/resources/scss/theme-neo-light/component/Process.scss

@@ -0,0 +1,9 @@
+:root .neo-theme-neo-light {
+    --process-arrow-color     : #6d5f28;
+    --process-background-color: #fff;
+    --process-icon-color      : #a3996f;
+    --process-icon-size       : 2rem;
+    --process-shadow-color    : rgba(0, 0, 0, .5);
+    --process-text-color      : #444444;
+    --process-title-color     : #363636;
+}

package/resources/scss/theme-neo-light/component/Progress.scss

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light {
+    --progress-label-color: #000;
+}

package/resources/scss/theme-neo-light/component/Splitter.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-splitter
+    --splitter-background-color: #f2f2f2;
+    --splitter-border          : 1px solid #ddd;
+    --splitter-hover-color     : #5d83a7
+}

package/resources/scss/theme-neo-light/component/StatusBadge.scss

@@ -0,0 +1,19 @@
+:root .neo-theme-neo-light {
+    --status-badge-align-items                      : center;
+    --status-badge-font-size                        : 11px;
+    --status-badge-font-family                      : var(--neo-font-family);
+    --status-badge-font-weight                      : 600;
+    --status-badge-line-height                      : 11px;
+    --status-badge-padding                          : 0px 5px 0px 5px;
+    --status-badge-state-alert-background-color     : orange;
+    --status-badge-state-alert-text-color           : black;
+    --status-badge-state-error-background-color     : red;
+    --status-badge-state-error-text-color           : white;
+    --status-badge-state-info-background-color      : lightblue;
+    --status-badge-state-info-text-color            : black;
+    --status-badge-state-neutral-background-color   : white;
+    --status-badge-state-neutral-text-color         : black;
+    --status-badge-state-success-background-color   : green;
+    --status-badge-state-success-text-color         : white;
+    --status-badge-transform                        : none;
+}

package/resources/scss/theme-neo-light/component/Timer.scss

@@ -0,0 +1,6 @@
+:root .neo-theme-neo-light { // .neo-timer
+    --timer-button-color: #cde8e7;
+    --timer-color-end   : #940a3d;
+    --timer-color-start : #8a9b0f;
+    --timer-dimension   : --6rem;
+}

package/resources/scss/theme-neo-light/component/Toast.scss

@@ -0,0 +1,9 @@
+:root .neo-theme-neo-light { // .neo-toast
+    --toast-background-color        : lightblue;
+    --toast-color                   : #083741;
+    --toast-danger-background-color : #e6adad;
+    --toast-danger-color            : #410808;
+    --toast-shadow-color            : rgba(0, 0, 0, 0.15);
+    --toast-success-background-color: #b7e6ad;
+    --toast-success-color           : #124108;
+}

package/resources/scss/theme-neo-light/component/Video.scss

@@ -0,0 +1,4 @@
+:root .neo-theme-neo-light { // .neo-video
+    --video-ghost-color: rgba(50, 50, 50, 0.3);
+    --video-ghost-size : 30px;
+}

package/resources/scss/theme-neo-light/container/Accordion.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-accordion
+    --accordion-item-radius   : 5px;
+    --accordion-title-bg-color: #292929;
+    --accordion-title-color   : #fff;
+}

package/resources/scss/theme-neo-light/container/AccordionItem.scss

@@ -0,0 +1,10 @@
+:root .neo-theme-neo-light { // .neo-accordion-item
+  --accordion-item-arrow-bg-color  : #dedede;
+  --accordion-item-arrow-shadow    : 0 4px 16px rgba(0 0 0 / .1);
+  --accordion-item-bg-color        : #f9f9f9;
+  --accordion-item-border-color    : #ddd;
+  --accordion-item-content-bg-color: #ffffff;
+  --accordion-item-header-height   : 50px;
+  --accordion-item-radius          : 5px;
+  --accordion-item-shadow          : 0 4px 16px rgba(0 0 0 / .1);
+}

package/resources/scss/theme-neo-light/container/Base.scss

@@ -0,0 +1,4 @@
+:root .neo-theme-neo-light { // .neo-container
+    --container-background-color: #fff;
+    --container-color           : #000;
+}

package/resources/scss/theme-neo-light/container/Panel.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-panel
+    --panel-border-color       : #ddd;
+    --panel-header-border-color: #ddd;
+    --panel-header-text-color  : #666;
+}

package/resources/scss/theme-neo-light/container/Viewport.scss

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light { // .neo-viewport
+    --viewport-background-color: #fff;
+}

package/resources/scss/theme-neo-light/design-tokens/Components.scss

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light {
+    --cmp-button-bg                       : blue;
+}

package/resources/scss/theme-neo-light/dialog/Base.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-dialog
+    --dialog-border-color: #ddd;
+    --dialog-header-color: #1c60a0;
+    --dialog-icon-color  : #1c60a0;
+}

package/resources/scss/theme-neo-light/examples/ConfigurationPanel.scss

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light {
+    --examples-tab-component-background-color: #fff;
+}

package/resources/scss/theme-neo-light/examples/calendar/basic/MainContainer.scss

@@ -0,0 +1,4 @@
+:root .neo-theme-neo-light { // .neo-examples-calendar-maincontainer
+    --examples-calendar-basic-header-background-color: #f2f2f2;
+    --examples-calendar-basic-header-color           : #1c60a0;
+}

package/resources/scss/theme-neo-light/form/Fieldset.scss

@@ -0,0 +1,6 @@
+:root .neo-theme-neo-light { // .neo-fieldset
+    --fieldset-background-color : #f9f9f9;
+    --fieldset-border           : 1px solid #ddd;
+    --fieldset-legend-color     : #1c60a0;
+    --fieldset-legend-icon-color: #1c60a0;
+}

package/resources/scss/theme-neo-light/form/field/CheckBox.scss

@@ -0,0 +1,8 @@
+:root .neo-theme-neo-light { // .neo-checkboxfield
+    --checkboxfield-color           : #aaa;
+    --checkboxfield-color-checked   : #1c60a0;
+    --checkboxfield-icon-font-family: var(--fa-style-family-classic);
+    --checkboxfield-icon-font-size  : 14px;
+    --checkboxfield-icon-margin     : 0;
+    --checkboxfield-label-top-margin: 0 0 3px;
+}

package/resources/scss/theme-neo-light/form/field/FileUpload.scss

@@ -0,0 +1,12 @@
+:root .neo-theme-neo-light { // .neo-fileuploadfield
+    --fileuploadfield-background-color        : #fff;
+    --fileuploadfield-border-color            : #d5d5d5;
+    --fileuploadfield-color                   : #000;
+    --fileuploadfield-downloadable-state-color: #d9d9d9;
+    --fileuploadfield-error-color             : #f00;
+    --fileuploadfield-focus-color             : #80d3f4;
+    --fileuploadfield-hover-color             : #f0f0f0;
+    --fileuploadfield-pressed-color           : #e0e0e0;
+    --fileuploadfield-progress-color          : #5d94f3;
+    --fileuploadfield-success-color           : rgb(112, 169, 112);
+}

package/resources/scss/theme-neo-light/form/field/Picker.scss

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-pickerfield
+    --pickerfield-container-background-color: #fff;
+    --pickerfield-container-border          : none;
+    --pickerfield-container-box-shadow      : 0 5px 10px rgba(0,0,0,.4);
+}

package/resources/scss/theme-neo-light/form/field/Range.scss

@@ -0,0 +1,4 @@
+:root .neo-theme-neo-light { // .neo-rangefield
+    --rangefield-thumb-background: #1c60a0;
+    --rangefield-track-background: #ddd;
+}

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

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light { // .neo-searchfield
+    --searchfield-glyph-color: #1c60a0;
+}

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

@@ -0,0 +1,9 @@
+:root .neo-theme-neo-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-neo-light/form/field/Switch.scss

@@ -0,0 +1,17 @@
+:root .neo-theme-neo-light { // .neo-switchfield
+    --switchfield-bordercolor-focused: #57B2EF;
+    --switchfield-borderwidth-focused: 4px;
+    --switchfield-color-knob         : #fff;
+    --switchfield-color-icon-on      : #fff;
+    --switchfield-color-icon-off     : #767676;
+    --switchfield-color-off          : #BDBDBD;
+    --switchfield-color-off-disabled : #BDBDBD;
+    --switchfield-color-off-hovered  : #9E9E9E;
+    --switchfield-color-on           : #005A96;
+    --switchfield-color-on-disabled  : #005A96;
+    --switchfield-color-on-hovered   : #004C7E;
+    --switchfield-height             : 24px;
+    --switchfield-knobsize           : 20px;
+    --switchfield-opacity-disabled   : .5;
+    --switchfield-width              : 40px;
+}

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

@@ -0,0 +1,32 @@
+:root .neo-theme-neo-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-neo-light/form/field/trigger/Base.scss

@@ -0,0 +1,6 @@
+:root .neo-theme-neo-light {
+    --trigger-background-color-hover: #fff;
+    --trigger-border-width          : 1px;
+    --trigger-color                 : #bbb;
+    --trigger-color-hover           : #1c60a0;
+}

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

@@ -0,0 +1,4 @@
+:root .neo-theme-neo-light {
+    --trigger-time-background-color-hover: #1c60a0;
+    --trigger-time-pointer-color         : #fff;
+}

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

@@ -0,0 +1,7 @@
+:root .neo-theme-neo-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-neo-light/grid/View.scss

@@ -0,0 +1,13 @@
+:root .neo-theme-neo-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-neo-light/grid/header/Button.scss

@@ -0,0 +1,6 @@
+:root .neo-theme-neo-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-neo-light/list/Base.scss

@@ -0,0 +1,12 @@
+:root .neo-theme-neo-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-neo-light/menu/List.scss

@@ -0,0 +1,21 @@
+:root .neo-theme-neo-light { // .neo-menu-list
+    --menu-list-background-color              : #fff;
+    --menu-list-border-color                  : #1c60a0;
+    --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-neo-light/menu/Panel.scss

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light { // .neo-menu
+    --menu-border-color: #1c60a0;
+}

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

@@ -0,0 +1,3 @@
+:root .neo-theme-neo-light { // .neo-tab-container
+    --tab-container-content-border: 1px solid #ddd;
+}

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

@@ -0,0 +1,5 @@
+:root .neo-theme-neo-light { // .neo-tab-strip
+    --tab-indicator-background-color-active: #5d83a7;
+    --tab-strip-background-color           : #ddd;
+    --tab-strip-height                     : 3px;
+}

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

@@ -0,0 +1,30 @@
+:root .neo-theme-neo-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;
+}