@finqu/cool 1.2.29 → 2.0.2

package/less/variables.less

@@ -1,343 +0,0 @@
-// Variables
-// Colors
-@color-black:                      #000000;
-@color-white:                      #ffffff;
-@color-blue-darker:                #2491C2;
-@color-blue:                       #03A2D2;
-@color-blue-light:                 #DFF4FB;
-@color-green:                      #5eb951;
-@color-pink:                       #DE367B;
-@color-yellow:                     #ffa900;
-@color-red:                        #DA7070;
-@color-grey-darkest:               #41464F;
-@color-grey-darker:                #76848F;
-@color-grey-dark:                  #CCCCCC;
-@color-grey:                       #DDDDDD;
-@color-grey-light:                 #EEEEEE;
-@color-grey-lighter:               #F5F5F5;
-@color-grey-lightest:              #F9F9F9;
-@color-placeholder:                #9e9e9e;
-@color-bg:                         @color-white;
-@color-icon:                       @color-grey-darker;
-@color-primary:                    #283543;
-@color-secondary:                  #727b84;
-@color-dark-grey-blue:             #76848f;
-@color-grey-blue:                  #5e6a74;
-
-
-// Body
-@color-body:                       #e4e7ea;
-
-
-// Borders
-@border-radius:                    3px;
-@border-width:                     1px;
-@border-color:                     @color-grey;
-@color-border:                     @border-color; // Fallback to old variable names
-
-
-// Fonts
-@font-family-sans-serif:           'Roboto', Helvetica, Arial, sans-serif;
-@font-family-serif:                Georgia, "Times New Roman", Times, serif;
-
-@font-family-monospace:            Menlo, Monaco, Consolas, "Courier New", monospace;
-@font-family-base:                 @font-family-sans-serif;
-
-@font-size-large:                  16px;
-@font-size-base:                   14px;
-@font-size-small:                  12px;
-@font-size-extra-small:            10px;
-
-@font-weight-light:                300;
-@font-weight-normal:               400;
-@font-weight-bold:                 500;
-@font-weight-base:                 @font-weight-normal;
-
-@line-height-lg:                   1.5;
-@line-height-base:                 1.5;
-@line-height-sm:                   1.35;
-@line-height-xs:                   1.25;
-@line-height-computed:             floor((@font-size-base * @line-height-base)); // 21px
-
-@h1-font-size:                     floor((@font-size-base * 1.86)); // ~26px
-@h2-font-size:                     floor((@font-size-base * 1.60)); // ~22px
-@h3-font-size:                     ceil((@font-size-base * 1.35)); // ~19px
-@h4-font-size:                     ceil((@font-size-base * 1.20)); // ~17px
-@h5-font-size:                     @font-size-base;
-@h6-font-size:                     ceil((@font-size-base * 0.85)); // ~12px
-
-@headings-margin-bottom:	       (@line-height-computed / 2);
-@headings-font-family:             inherit;
-@headings-font-weight:             400;
-@headings-line-height:             1.2;
-@headings-color:                   inherit;
-
-@display1-size:                    84px;
-@display2-size:                    77px;
-@display3-size:                    63px;
-@display4-size:                    49px;
-
-@display1-weight:                  300;
-@display2-weight:                  300;
-@display3-weight:                  300;
-@display4-weight:                  300;
-@display-line-height:              @headings-line-height;
-
-@lead-font-size:                   (@font-size-base * 1.25);
-@lead-font-weight:                 300;
-
-@small-font-size:                  75%;
-@smaller-font-size:                85%;
-
-@hr-border-color:                  @border-color;
-@hr-border-width:                  @border-width;
-@hr-margin-y:                      16px;
-
-@color-text-disabled:              @color-grey-lightest;
-@color-heading:                    @color-grey-darkest;
-@color-text:                       @color-grey-darkest;
-
-
-// Box shadow
-@box-shadow-sm:                    0 17px 3px fade(@color-black, .075);
-@box-shadow:                       0 7px 14px fade(@color-black, .15);
-@box-shadow-lg:                    0 14px 42px fade(@color-black, .175);
-
-
-// Caret
-@caret-width:                      4px;
-
-
-// Forms
-@input-line-height:                1.50;
-
-@input-padding-y:                  8px;
-@input-padding-x:                  14px;
-
-@input-padding-y-sm:               6px;
-@input-padding-x-sm:               12px;
-
-@input-padding-y-xs:               4px;
-@input-padding-x-xs:               10px;
-
-@input-padding-y-lg: 			   13px;
-@input-padding-x-lg: 			   14px;
-
-@input-height:                     ((@font-size-base * @input-line-height) + (@input-padding-y * 2));
-@input-height-sm:                  ((@font-size-small * @line-height-sm) + (@input-padding-y-sm * 2));
-@input-height-xs:                  ((@font-size-extra-small * @line-height-xs) + (@input-padding-y-xs * 2));
-@input-height-lg:                  ((@font-size-large * @line-height-lg) + (@input-padding-y-lg * 2));
-
-@form-group-margin-bottom:         16px;
-@label-margin-bottom:              8px;
-
-// Buttons
-@btn-font-weight:                  normal;
-@btn-line-height:                  1.15;
-
-@btn-font-size:                    14px;
-@btn-padding-y:                    10px;
-@btn-padding-x:                    16px;
-
-@btn-font-size-sm:                 14px;
-@btn-padding-y-sm:                 8px;
-@btn-padding-x-sm:                 14px;
-
-@btn-font-size-xs:                 12px;
-@btn-padding-y-xs:                 6px;
-@btn-padding-x-xs:                 12px;
-
-@btn-font-size-lg:                 16px;
-@btn-padding-y-lg:                 16px;
-@btn-padding-x-lg:                 14px;
-
-@btn-height:                       ((@btn-font-size * @btn-line-height) + (@btn-padding-y * 2));
-@btn-height-sm:                    ((@btn-font-size-sm * @btn-line-height) + (@btn-padding-y-sm * 2));
-@btn-height-xs:                    ((@btn-font-size-xs * @btn-line-height) + (@btn-padding-y-xs * 2));
-@btn-height-lg:                    ((@btn-font-size-lg * @btn-line-height) + (@btn-padding-y-lg * 2));
-
-@color-btn-primary:                @color-primary;
-@color-btn-secondary:              @color-secondary;
-
-
-// Pagination
-@pagination-padding-y:             8px;
-@pagination-padding-x:             12px;
-
-@pagination-active-color:          @color-white;
-@pagination-active-bg:             @color-primary;
-@pagination-active-border-color:   @color-primary;
-
-@pagination-disabled-color:        @color-grey-dark;
-@pagination-disabled-bg:           @color-grey-lighter;
-@pagination-disabled-border-color: @color-border;
-
-@pagination-color:                 @color-grey-darker;
-@pagination-bg:                    @color-white;
-@pagination-border: 1px solid      @color-border;
-@pagination-line-height:           20px;
-
-@pagination-hover-color:           @color-grey-darkest;
-@pagination-hover-bg:              @color-grey-lightest;
-@pagination-hover-border-color:    @color-border;
-
-
-// Z-index
-@zindex-fixed:                     1005;
-@zindex-sticky:                    1005;
-@zindex-popover:                   1005;
-@zindex-tooltip:                   1001;
-@zindex-dropdown:                  1005;
-@zindex-select:                    1005;
-@zindex-dialog:					   1010;
-
-// Links colors
-@color-link:                       @color-blue;
-@color-hover:                      darken(@color-blue, 15%);
-
-
-// Table
-@color-table-border:               @color-grey;
-@color-table-bg:                   @color-grey-lighter;
-@color-table-bg-hover:             #ecf4f9;
-@color-table-bg-heading:           #f9f9f9;
-@color-table-a:                    @color-link;
-@color-table-a-hover:              @color-hover;
-@color-table-icon:                 @color-grey-darker;
-@color-table-bg-accent:            @color-grey-lighter;
-
-
-// Tabs
-@color-tab-bg:                     @color-white;
-@color-tab-text:                   @color-grey-darker;
-@color-tab-bg-active:              @color-white;
-@color-tab-text-active:            @color-text;
-
-
-// Tooltips
-@tooltip-font-size:                @font-size-small;
-@tooltip-max-width:                200px;
-@tooltip-color:                    @color-white;
-@tooltip-bg:                       @color-black;
-@tooltip-border-radius:            @border-radius;
-@tooltip-opacity:                  .9;
-@tooltip-padding-y:                4px;
-@tooltip-padding-x:                7px;
-@tooltip-margin:                   0;
-
-@tooltip-arrow-width:              12px;
-@tooltip-arrow-height:             6px;
-@tooltip-arrow-color:              @tooltip-bg;
-
-
-// Popovers
-@popover-font-size:                @font-size-small;
-@popover-bg:                       @color-white;
-@popover-max-width:                276px;
-@popover-border-width:             @border-width;
-@popover-border-color:             fade(@color-black, 20%);
-@popover-border-radius:            @border-radius;
-
-@popover-header-bg:                darken(@popover-bg, 3%);
-@popover-header-color:             @color-heading;
-@popover-header-padding-y:         8px;
-@popover-header-padding-x:         12px;
-
-@popover-body-color:               @color-text;
-@popover-body-padding-y:           @popover-header-padding-y;
-@popover-body-padding-x:           @popover-header-padding-x;
-
-@popover-arrow-width:              14px;
-@popover-arrow-height:             7px;
-@popover-arrow-color:              @popover-bg;
-
-@popover-arrow-outer-color:        fadein(@popover-border-color, 5%);
-
-
-// Nav divider
-@nav-divider-color:                @color-grey-light;
-@nav-divider-margin-y:             14px / 2;
-
-
-// Dropdown
-@dropdown-min-width:               140px;
-@dropdown-padding-y:               7px;
-@dropdown-spacer:                  3px;
-@dropdown-bg:                      @color-white;
-@dropdown-color:                   @color-text;
-@dropdown-border-color:            fade(@color-black, 15%);
-@dropdown-border-radius:           @border-radius;
-@dropdown-border-width:            @border-width;
-@dropdown-divider-bg:              @color-grey-light;
-@dropdown-box-shadow:              0 2px 5px fade(@color-black, 16%);
-
-@dropdown-link-color:              @color-grey-darkest;
-@dropdown-link-hover-color:        darken(@color-grey-darkest, 5%);
-@dropdown-link-hover-bg:           @color-grey-lightest;
-
-@dropdown-link-active-color:       @color-grey-darkest;
-@dropdown-link-active-bg:          @color-blue;
-
-@dropdown-link-disabled-color:     @color-grey-darker;
-
-@dropdown-item-padding-y:          5px;
-@dropdown-item-padding-x:          21px;
-
-@dropdown-header-color:            @color-grey-darker;
-
-
-// Select
-@select-spacer:                    8px;
-@select-bg:                        @color-white;
-@select-border-color:              fade(@color-black, 15%);
-@select-border-radius:             @border-radius;
-@select-border-width:              @border-width;
-@select-divider-bg:                @color-grey-light;
-@select-box-shadow:                0 2px 5px fade(@color-black, 16%);
-
-@select-item-color:                @color-grey-darkest;
-@select-item-hover-color:          darken(@color-grey-darkest, 5%);
-@select-item-hover-bg:             @color-grey-lightest;
-
-@select-item-disabled-color:       @color-grey-darker;
-
-@select-item-padding-y:            6px;
-@select-item-padding-x:            12px;
-
-@select-header-color:              @color-grey-darker;
-
-
-// Section
-@section-font-size:                @font-size-base;
-@section-border-radius:            @border-radius;
-@section-spacer:                   20px;
-@section-spacer-mobile:            10px;
-@section-padding:                  16px;
-
-@section-bg:                       @color-white;
-@section-color:                    @color-text;
-@section-box-shadow:               0 1px 2px #cccccc, 0 0 0 1px #eeeeee;
-@section-divider-color:            @color-grey-light;
-
-@section-header-font-family:       @font-family-base;
-@section-header-font-size:         15px;
-@section-header-font-weight:       @font-weight-bold;
-@section-header-bg:                @color-white;
-@section-header-color:             @color-grey-darkest;
-@section-header-actions-color:     @color-black;
-@section-header-icons-color:       @color-grey-darkest;
-@section-header-icons-size:        15px;
-
-@section-tabs-bg:                  @color-white;
-@section-tabs-item-padding-y:      @section-padding;
-@section-tabs-item-margin-x:       @section-padding;
-@section-tabs-item-min-width:      50px;
-
-@section-tabs-color:               @color-grey-darker;
-@section-tabs-hover-color:         @color-grey-darkest;
-@section-tabs-active-color:        @color-grey-darkest;
-
-@section-tabs-border-width:        3px;
-@section-tabs-border-color:        fade(@color-black, 15%);
-@section-tabs-border-hover-color:  @color-grey-dark;
-@section-tabs-border-active-color: @color-blue;

package/scss/_alert.scss

@@ -1,102 +0,0 @@
-    // Alert
-// ---------------------------------------------------------------------------------------------------------------
-
-.alert-icon {
-    border-radius: 50% 50%;
-    width: 0.9em;
-    height: 0.9em;
-    border: $border-width solid theme-color('primary');
-    box-sizing: border-box;
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    vertical-align: middle;
-    position: relative;
-    z-index: 2;
-    background: white;
-    //box-shadow: 0 0 0 0.2em fade-out(theme-color('primary'), 0.7);
-
-    .icon {
-        font-size: 0.5em;
-        color: theme-color('primary');
-    }
-}
-
-// Alert variants
-@each $color, $value in $theme-colors {
-    .alert-icon-#{$color} {
-        @include alert-icon-variant($value);
-    }
-}
-
-.alert {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    position: relative;
-    border-radius: $border-radius;
-    margin-bottom: $section-spacer-mobile;
-    width: 100%;
-    overflow: hidden;
-    box-sizing: border-box;
-    position: relative;
-    padding: $section-padding;
-    background: white;
-    border-top: $alert-border-width solid theme-color('primary');
-    border-left: $border-width solid theme-color('primary');
-    border-right: $border-width solid theme-color('primary');
-    border-bottom: $border-width solid theme-color('primary');
-
-    @include media-breakpoint-up(sm) {
-        margin-bottom: $section-spacer;
-    }
-
-    // Icon
-    .alert-icon {
-        width: 28px;
-        height: 28px;
-        margin-top: $section-padding;
-        margin-bottom: $section-padding;
-        flex-shrink: 0;
-        flex-grow: 0;
-
-        .icon {
-            font-size: 12px;
-        }
-    }
-
-
-    // Content
-    .alert-content-container {
-        padding: 0 $section-padding;
-        box-sizing: border-box;
-        flex: 1;
-
-        .alert-content {
-        }
-
-        .alert-action {
-            margin-top: $section-padding;
-        }
-    }
-}
-
-a.alert {
-    color: $body-color;
-
-    .icon {
-        color: theme-color('medium');
-        font-size: $font-size-lg;
-    }
-}
-
-.section-content .alert {
-    border-width: 0;
-}
-
-// Alert variants
-@each $color, $value in $theme-colors {
-    .alert-#{$color} {
-        @include alert-variant($value);
-    }
-}