@kizmann/nano-ui 0.9.10 → 1.0.1

package/themes/light/input-number/src/input-number/input-number.scss

@@ -1,46 +0,0 @@
-@import "../../../root/vars";
-
-.n-input-number {
-    border: 1px solid $color-gray-15;
-}
-
-.n-input-number.n-disabled input  {
-    background: rgba($color-gray-15, 0.3);
-}
-
-.n-input-number .n-button {
-    color: $color-gray-60;
-    background: rgba($color-gray-15, 0.5);
-}
-
-.n-input-number__clear {
-    color: $color-gray-60;
-}
-
-.n-input-number__clear i {
-    background: rgba($color-gray-15, 0.6);
-}
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-    /**
-     * Button primary
-     */
-
-    .n-input-number--#{$color}:not(.n-disabled):hover {
-        border-color: $-color-base;
-    }
-
-    .n-input-number--#{$color}:not(.n-disabled).n-focus {
-        border-color: $-color-light;
-    }
-
-    .n-input-number--#{$color}:not(.n-disabled) .n-button:hover {
-        color: $-color-base;
-    }
-
-}

package/themes/light/loader/index.scss

@@ -1 +0,0 @@
-@import "./src/loader/loader";

package/themes/light/loader/src/loader/loader.scss

@@ -1,21 +0,0 @@
-@import "../../../root/vars";
-
-.n-load:before {
-    border: 2px solid $color-primary;
-}
-
-.n-load:after {
-    background: rgba($color-white, 0.7);
-}
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-    .n-loader--#{$color}.n-load:before {
-        border-color: $-color-base;
-    }
-
-}

package/themes/light/map/index.scss

@@ -1 +0,0 @@
-@import "./src/map/map";

package/themes/light/map/src/map/map.scss

@@ -1 +0,0 @@
-@import "../../../root/vars";

package/themes/light/modal/index.scss

@@ -1 +0,0 @@
-@import "./src/modal/modal";

package/themes/light/modal/src/modal/modal.scss

@@ -1,51 +0,0 @@
-@import "../../../root/vars";
-
-$modal: (
-    'default': (
-        'color': $color-black,
-        'border': $color-gray-10,
-        'header': $color-white,
-        'body': $color-white,
-        'footer': $color-white,
-    ),
-    'preview': (
-        'color': $color-white,
-        'border': $color-gray-95,
-        'header': $color-black,
-        'body': $color-black,
-        'footer': $color-black,
-    )
-) !default;
-
-.n-modal__backdrop {
-    background: rgba($color-black, 0.6);
-}
-
-.n-modal__frame {
-    box-shadow: 0 1px 5px 1px rgba($color-shadow, 0.20);
-}
-
-@each $suffix, $values in $modal {
-
-    $-modal-color: map-get($values, 'color');
-    $-modal-border: map-get($values, 'border');
-    $-modal-header: map-get($values, 'header');
-    $-modal-body: map-get($values, 'body');
-    $-modal-footer: map-get($values, 'footer');
-
-    .n-modal--#{$suffix} .n-modal__frame {
-        color: $-modal-color;
-        background: $-modal-body;
-    }
-
-    .n-modal--#{$suffix} .n-modal__header {
-        border-bottom: 1px solid $-modal-border;
-        background: $-modal-header;
-    }
-
-    .n-modal--#{$suffix} .n-modal__footer {
-        border-top: 1px solid $-modal-border;
-        background: $-modal-footer;
-    }
-
-}

package/themes/light/notification/index.scss

@@ -1 +0,0 @@
-@import "./src/notification/notification";

package/themes/light/notification/src/notification/notification.scss

@@ -1,24 +0,0 @@
-@import "../../../root/vars";
-
-.n-notification {
-    background: $color-white;
-    box-shadow: 0 1px 5px 1px rgba($color-shadow, 0.20);
-}
-
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-    .n-notification--#{$color} {
-        background: $-color-base;
-    }
-
-    .n-notification--#{$color} .n-notification__icon,
-    .n-notification--#{$color} .n-notification__text {
-        color: $color-white;
-    }
-
-}

package/themes/light/paginator/index.scss

@@ -1 +0,0 @@
-@import "./src/paginator/paginator";

package/themes/light/paginator/src/paginator/paginator.scss

@@ -1,5 +0,0 @@
-@import "../../../root/vars";
-
-.n-paginator {
-    color: $color-gray-60;
-}

package/themes/light/popover/index.scss

@@ -1 +0,0 @@
-@import "./src/popover/popover";

package/themes/light/popover/src/popover/popover.scss

@@ -1,100 +0,0 @@
-@import "../../../root/vars";
-
-$popover: (
-        'default': (
-                'color': $color-black,
-                'border': $color-gray-10,
-                'header': $color-white,
-                'body': $color-white,
-                'footer': $color-white,
-        ),
-        'negative': (
-                'color': $color-white,
-                'border': $color-gray-95,
-                'header': $color-black,
-                'body': $color-black,
-                'footer': $color-black,
-        )
-) !default;
-
-.n-popover__frame {
-    box-shadow: 0 1px 3px 1px rgba($color-shadow, 0.15);
-}
-
-.n-popover-group,
-.n-popover-option {
-    color: $color-black;
-}
-
-.n-popover-group {
-    color: $color-black;
-}
-
-.n-popover-option:not(.n-disabled).n-hover,
-.n-popover-option:not(.n-disabled):hover {
-    background: rgba($color-gray-50, 0.07);
-}
-
-.n-popover-option:not(.n-disabled).n-focus,
-.n-popover-option:not(.n-disabled).n-focus:hover {
-    background: rgba($color-gray-50, 0.14);
-}
-
-.n-popover-option .n-image {
-    color: $color-gray-60;
-}
-
-.n-popover-option .n-icon {
-    color: $color-gray-60;
-}
-
-@each $suffix, $values in $popover {
-
-    $-popover-color: map-get($values, 'color');
-    $-popover-border: map-get($values, 'border');
-    $-popover-header: map-get($values, 'header');
-    $-popover-body: map-get($values, 'body');
-    $-popover-footer: map-get($values, 'footer');
-
-    .n-popover--#{$suffix} .n-popover__frame {
-        color: $-popover-color;
-        background: $-popover-body;
-    }
-
-    .n-popover--#{$suffix} .n-popover__header {
-        border-bottom: 1px solid $-popover-border;
-        background: $-popover-header;
-    }
-
-    .n-popover--#{$suffix} .n-popover__footer {
-        border-top: 1px solid $-popover-border;
-        background: $-popover-footer;
-    }
-
-    .n-popover--#{$suffix} .n-popover-option {
-        color: $-popover-color;
-    }
-
-}
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-    .n-popover-option--#{$color}.n-active,
-    .n-popover-option--#{$color} .n-icon {
-        color: $-color-base;
-    }
-
-}
-
-.n-popover--tooltip .n-popover__frame {
-    color: $color-white;
-    background: rgba($color-black, 0.9);
-}
-
-.n-popover--tooltip .n-popover__body {
-    padding: 3px 8px;
-}

package/themes/light/radio/index.scss

@@ -1,2 +0,0 @@
-@import "./src/radio/radio";
-@import "./src/radio-group/radio-group";

package/themes/light/radio/src/radio/radio.scss

@@ -1,44 +0,0 @@
-@import "../../../root/vars";
-
-.n-radio__radio {
-    color: $color-black;
-    border: 1px solid $color-gray-15;
-}
-
-.n-radio.n-disabled .n-radio__radio  {
-    background: rgba($color-gray-15, 0.3);
-}
-
-.n-radio__radio span {
-    background: $color-black;
-}
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-    .n-radio--#{$color}:not(.n-disabled):hover .n-radio__radio {
-        border-color: $-color-base;
-    }
-
-    .n-radio--#{$color}.n-checked:not(.n-disabled) .n-radio__radio {
-        background: $-color-base;
-        border-color: $-color-base;
-    }
-
-    .n-radio--#{$color}.n-checked:not(.n-disabled) .n-radio__radio span {
-        background: $color-white;
-    }
-
-    .n-radio--#{$color}.n-checked:not(.n-disabled) .n-radio__radio:not(.n-disabled):hover {
-        background: $-color-light;
-        border-color: $-color-light;
-    }
-
-    .n-radio--#{$color}.n-checked:not(.n-disabled) .n-radio__label {
-        color: $-color-base;
-    }
-
-}

package/themes/light/radio/src/radio-group/radio-group.scss

@@ -1 +0,0 @@
-@import "../../../root/vars";

package/themes/light/rating/index.scss

@@ -1 +0,0 @@
-@import "./src/rating/rating";

package/themes/light/rating/src/rating/rating.scss

@@ -1,18 +0,0 @@
-@import "../../../root/vars";
-
-.n-rating__stars span:before,
-.n-rating__stars span:after {
-    background-image: svg-load('star-default.svg', fill=$color-gray-10);
-}
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-    .n-rating--#{$color} .n-rating__stars span:before {
-        background-image: svg-load('star-default.svg', fill=$-color-base);
-    }
-
-}

package/themes/light/resizer/index.scss

@@ -1 +0,0 @@
-@import "./src/resizer/resizer";

package/themes/light/resizer/src/resizer/resizer.scss

@@ -1,5 +0,0 @@
-@import "../../../root/vars";
-
-.n-resizer__handle:before {
-    background: rgba($color-primary, 0.9);
-}

package/themes/light/root/vars.scss

@@ -1,183 +0,0 @@
-$color-white:           #ffffff !default;
-$color-black:           #090b10 !default;
-
-$color-gray-05:         mix($color-black, $color-white, 0.05 * 100%) !default;
-$color-gray-10:         mix($color-black, $color-white, 0.10 * 100%) !default;
-$color-gray-15:         mix($color-black, $color-white, 0.15 * 100%) !default;
-$color-gray-20:         mix($color-black, $color-white, 0.20 * 100%) !default;
-$color-gray-25:         mix($color-black, $color-white, 0.25 * 100%) !default;
-$color-gray-30:         mix($color-black, $color-white, 0.30 * 100%) !default;
-$color-gray-35:         mix($color-black, $color-white, 0.35 * 100%) !default;
-$color-gray-40:         mix($color-black, $color-white, 0.40 * 100%) !default;
-$color-gray-45:         mix($color-black, $color-white, 0.45 * 100%) !default;
-$color-gray-50:         mix($color-black, $color-white, 0.50 * 100%) !default;
-$color-gray-55:         mix($color-black, $color-white, 0.55 * 100%) !default;
-$color-gray-60:         mix($color-black, $color-white, 0.60 * 100%) !default;
-$color-gray-65:         mix($color-black, $color-white, 0.65 * 100%) !default;
-$color-gray-70:         mix($color-black, $color-white, 0.70 * 100%) !default;
-$color-gray-75:         mix($color-black, $color-white, 0.75 * 100%) !default;
-$color-gray-80:         mix($color-black, $color-white, 0.80 * 100%) !default;
-$color-gray-85:         mix($color-black, $color-white, 0.85 * 100%) !default;
-$color-gray-90:         mix($color-black, $color-white, 0.90 * 100%) !default;
-$color-gray-95:         mix($color-black, $color-white, 0.95 * 100%) !default;
-
-$color-secondary:       #ca62f0 !default;
-$color-primary:         #6875ee !default;
-
-$color-success:         #06C493 !default;
-$color-warning:         #FFBF3F !default;
-$color-danger:          #F9536E !default;
-$color-info:            #4BD6F9 !default;
-
-$color-background:      #FAFAFB !default;
-
-$color-shadow:              mix($color-black, $color-primary, 80%) !default;
-
-
-$color-white-light:         $color-white !default;
-$color-white-lighter:       $color-white !default;
-
-$color-white-dark:          mix($color-gray-50, $color-white, 5%) !default;
-$color-white-darker:        mix($color-gray-50, $color-white, 10%) !default;
-
-$color-black-light:         mix($color-gray-50, $color-black, 5%) !default;
-$color-black-lighter:       mix($color-gray-50, $color-black, 10%) !default;
-
-$color-black-dark:          $color-black !default;
-$color-black-darker:        $color-black !default;
-
-
-$color-primary-light:       lighten(mix($color-white, $color-primary, 10%), 5%) !default;
-$color-primary-lighter:     lighten(mix($color-white, $color-primary, 20%), 5%) !default;
-
-$color-primary-dark:        darken(mix($color-black, $color-primary, 10%), 5%) !default;
-$color-primary-darker:      darken(mix($color-black, $color-primary, 20%), 5%) !default;
-
-
-$color-secondary-light:     lighten(mix($color-white, $color-secondary, 10%), 5%) !default;
-$color-secondary-lighter:   lighten(mix($color-white, $color-secondary, 20%), 5%) !default;
-
-$color-secondary-dark:      darken(mix($color-black, $color-secondary, 10%), 5%) !default;
-$color-secondary-darker:    darken(mix($color-black, $color-secondary, 20%), 5%) !default;
-
-
-$color-success-light:       lighten(mix($color-white, $color-success, 10%), 5%) !default;
-$color-success-lighter:     lighten(mix($color-white, $color-success, 20%), 5%) !default;
-
-$color-success-dark:        darken(mix($color-black, $color-success, 10%), 5%) !default;
-$color-success-darker:      darken(mix($color-black, $color-success, 20%), 5%) !default;
-
-
-$color-warning-light:       lighten(mix($color-white, $color-warning, 10%), 5%) !default;
-$color-warning-lighter:     lighten(mix($color-white, $color-warning, 20%), 5%) !default;
-
-$color-warning-dark:        darken(mix($color-black, $color-warning, 10%), 5%) !default;
-$color-warning-darker:      darken(mix($color-black, $color-warning, 20%), 5%) !default;
-
-
-$color-danger-light:        lighten(mix($color-white, $color-danger, 10%), 5%) !default;
-$color-danger-lighter:      lighten(mix($color-white, $color-danger, 20%), 5%) !default;
-
-$color-danger-dark:         darken(mix($color-black, $color-danger, 10%), 5%) !default;
-$color-danger-darker:       darken(mix($color-black, $color-danger, 20%), 5%) !default;
-
-$color-info-light:          lighten(mix($color-white, $color-info, 10%), 5%) !default;
-$color-info-lighter:        lighten(mix($color-white, $color-info, 20%), 5%) !default;
-
-$color-info-dark:           darken(mix($color-black, $color-info, 10%), 5%) !default;
-$color-info-darker:         darken(mix($color-black, $color-info, 20%), 5%) !default;
-
-$color-background-light:    lighten(mix($color-white, $color-background, 10%), 5%) !default;
-$color-background-lighter:  lighten(mix($color-white, $color-background, 20%), 5%) !default;
-
-$color-background-dark:     darken(mix($color-black, $color-background, 10%), 5%) !default;
-$color-background-darker:   darken(mix($color-black, $color-background, 20%), 5%) !default;
-
-$xs-radius:                 2px !default;
-$sm-radius:                 2px !default;
-$md-radius:                 4px !default;
-$lg-radius:                 6px !default;
-$xl-radius:                 10px !default;
-
-$form: (
-        'xs': (
-                'size': 26px,
-                'font': 11px,
-                'radius': $xs-radius,
-                'ratio': 0.40,
-        ),
-        'sm': (
-                'size': 28px,
-                'font': 13px,
-                'radius': $sm-radius,
-                'ratio': 0.40,
-        ),
-        'md': (
-                'size': 32px,
-                'font': 15px,
-                'radius': $md-radius,
-                'ratio': 0.40,
-        ),
-        'lg': (
-                'size': 36px,
-                'font': 16px,
-                'radius': $lg-radius,
-                'ratio': 0.40,
-        ),
-) !default;
-
-$colors: (
-        'primary': (
-                'base': $color-primary,
-                'light': $color-primary-light,
-                'dark': $color-primary-dark
-        ),
-        'secondary': (
-                'base': $color-secondary,
-                'light': $color-secondary-light,
-                'dark': $color-secondary-dark
-        ),
-        'info': (
-                'base': $color-info,
-                'light': $color-info-light,
-                'dark': $color-info-dark
-        ),
-        'success': (
-                'base': $color-success,
-                'light': $color-success-light,
-                'dark': $color-success-dark
-        ),
-        'warning': (
-                'base': $color-warning,
-                'light': $color-warning-light,
-                'dark': $color-warning-dark
-        ),
-        'danger': (
-                'base': $color-danger,
-                'light': $color-danger-light,
-                'dark': $color-danger-dark
-        ),
-) !default;
-
-$colors-tags: (
-        '0': mix($color-secondary, $color-secondary, 65%),
-        '1': mix($color-primary, $color-secondary, 65%),
-        '2': mix($color-danger, $color-secondary, 65%),
-        '3': mix($color-success, $color-secondary, 65%),
-        '4': mix($color-warning, $color-secondary, 65%),
-        '5': mix($color-primary, $color-success, 65%),
-        '6': mix($color-secondary, $color-success, 65%),
-        '7': mix($color-danger, $color-success, 65%),
-        '8': mix($color-success, $color-success, 65%),
-        '9': mix($color-warning, $color-success, 65%),
-        '10': mix($color-primary, $color-danger, 65%),
-        '11': mix($color-secondary, $color-danger, 65%),
-        '12': mix($color-danger, $color-danger, 65%),
-        '13': mix($color-success, $color-danger, 65%),
-        '14': mix($color-warning, $color-danger, 65%),
-        '15': mix($color-primary, $color-warning, 65%),
-        '16': mix($color-secondary, $color-warning, 65%),
-        '17': mix($color-danger, $color-warning, 65%),
-        '18': mix($color-success, $color-warning, 65%),
-        '19': mix($color-warning, $color-warning, 65%),
-) !default;

package/themes/light/scrollbar/index.scss

@@ -1 +0,0 @@
-@import "./src/scrollbar/scrollbar";

package/themes/light/scrollbar/src/scrollbar/scrollbar.scss

@@ -1,6 +0,0 @@
-@import "../../../root/vars";
-
-.n-scrollbar-v:before,
-.n-scrollbar-h:before {
-    background: rgba($color-black, 0.3);
-}

package/themes/light/select/index.scss

@@ -1,2 +0,0 @@
-@import "./src/select/select";
-@import "./src/select-option/select-option";

package/themes/light/select/src/select/select.scss

@@ -1,46 +0,0 @@
-@import "../../../root/vars";
-
-.n-select {
-    border: 1px solid $color-gray-15;
-}
-
-.n-select.n-disabled {
-    background: rgba($color-gray-15, 0.3);
-}
-
-.n-select__clear,
-.n-select__angle {
-    color: $color-gray-60;
-}
-
-.n-select__clear i {
-    background: rgba($color-gray-15, 0.6);
-}
-
-.n-select__body,
-.n-select__empty {
-     background: $color-white;
-     box-shadow: 0 1px 3px 1px rgba($color-shadow, 0.15);
-}
-
- .n-select__empty {
-     color: $color-gray-60;
-}
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-     .n-select--#{$color}:not(.n-disabled):hover,
-     .n-select--#{$color}:not(.n-disabled).n-focus {
-        border-color: $-color-base;
-    }
-
-    .n-select--#{$color} .n-select__item {
-        color: $color-white;
-        background: $-color-base;
-    }
-
-}

package/themes/light/select/src/select-option/select-option.scss

@@ -1 +0,0 @@
-@import "../../../root/vars";

package/themes/light/switch/index.scss

@@ -1 +0,0 @@
-@import "./src/switch/switch";

package/themes/light/switch/src/switch/switch.scss

@@ -1,28 +0,0 @@
-@import "../../../root/vars";
-
-.n-switch__switch {
-    background: $color-gray-10;
-    border: 1px solid $color-gray-15;
-}
-
-.n-switch__switch span {
-    background: $color-white;
-    box-shadow: 0 1px 2px rgba($color-shadow, 0.15);
-}
-
-@each $color, $values in $colors {
-
-    $-color-base: map_get($values, 'base');
-    $-color-light: map_get($values, 'light');
-    $-color-dark: map_get($values, 'dark');
-
-    .n-switch--#{$color}:not(.n-disabled) .n-switch__switch {
-        background: $-color-base;
-        border-color: mix($-color-dark, $-color-base, 25%);
-    }
-
-    .n-switch--#{$color}:not(.n-disabled) .n-switch__label {
-        color: $-color-base;
-    }
-
-}

package/themes/light/table/index.scss

@@ -1,4 +0,0 @@
-@import "./src/table/table";
-@import "./src/table-column/table-column";
-@import "./src/table-cell/table-cell";
-@import "./src/table-filter/table-filter";

package/themes/light/table/src/table/table.scss

@@ -1,14 +0,0 @@
-@import "../../../root/vars";
-
-.n-table {
-    box-shadow: inset 0 0 1px 1px $color-gray-15;
-}
-
-.n-table .n-draglist-item {
-    border-bottom: 1px solid $color-gray-10;
-}
-
-.n-table .n-table__header {
-    border-bottom: 1px solid $color-gray-15;
-    box-shadow: 0 0 3px rgba($color-shadow, 0.10);
-}