github.com/bosssauce/ponzu@v0.11.1-0.20200102001432-9bc41b703131/system/admin/static/editor/sass/components/_variables.scss (about)

     1  /*** Colors ***/
     2  $primary-color: color("materialize-red", "lighten-2") !default;
     3  $primary-color-light: lighten($primary-color, 15%) !default;
     4  $primary-color-dark: darken($primary-color, 15%) !default;
     5  
     6  $secondary-color: color("teal", "lighten-1") !default;
     7  $success-color: color("green", "base") !default;
     8  $error-color: color("red", "base") !default;
     9  $link-color: color("light-blue", "darken-1") !default;
    10  
    11  /*** Badges ***/
    12  $badge-bg-color: $secondary-color !default;
    13  
    14  /*** Buttons ***/
    15  $button-bg-color-disabled: #DFDFDF !default;
    16  $button-color: $secondary-color !default;
    17  $button-color-disabled: #9F9F9F !default;
    18  $button-color-flat: #343434 !default;
    19  $button-color-raised: #fff !default;
    20  $button-floating-size: 37px !default;
    21  $button-height: 36px !default;
    22  $button-font-size-shared: 1.3rem !default;
    23  $button-large-icon-font-size: 1.6rem !default;
    24  $button-line-height: 36px !default;
    25  
    26  /*** Cards ***/
    27  $card-padding: 20px !default;
    28  $card-bg-color: #fff !default;
    29  $card-link-color: color("orange", "accent-2") !default;
    30  $card-link-color-light: lighten($card-link-color, 20%) !default;
    31  
    32  /*** Collapsible ***/
    33  $collapsible-height: 3rem !default;
    34  $collapsible-header-color: #fff !default;
    35  $collapsible-border-color: #ddd !default;
    36  
    37  /*** Dropdown ***/
    38  $dropdown-bg-color: #fff !default;
    39  $dropdown-hover-bg-color: #eee !default;
    40  $dropdown-color: $secondary-color !default;
    41  
    42  /*** Fonts ***/
    43  $roboto-font-path: "../font/roboto/" !default;
    44  $icons-font-path: "../font/material-design-icons/" !default;
    45  
    46  /*** Forms ***/
    47  // Text Inputs + Textarea
    48  $input-border-color: color("grey", "base") !default;
    49  $input-bg-color: #fff !default;
    50  $input-error-color: $error-color !default;
    51  $input-success-color: $success-color !default;
    52  $input-focus-color: $secondary-color !default;
    53  $label-font-size: .8rem !default;
    54  $input-disabled-color: rgba(0,0,0, .26) !default;
    55  $input-disabled-solid-color: #BDBDBD !default;
    56  
    57  // Radio Buttons
    58  $radio-fill-color: $secondary-color !default;
    59  $radio-empty-color: #5a5a5a !default;
    60  
    61  // Switches
    62  $switch-bg-color: $secondary-color !default;
    63  $switch-checked-lever-bg: desaturate(lighten($secondary-color, 25%), 25%) !default;
    64  $switch-unchecked-bg: #F1F1F1 !default;
    65  $switch-unchecked-lever-bg: #818181 !default;
    66  
    67  // Date Picker
    68  $datepicker-weekday-bg: darken($secondary_color, 7%) !default;
    69  $datepicker-date-bg: $secondary_color !default;
    70  $datepicker-year: rgba(255, 255, 255, .4) !default;
    71  $datepicker-focus: rgba(0,0,0, .05) !default;
    72  $datepicker-selected: $secondary-color !default;
    73  $datepicker-selected-outfocus: desaturate(lighten($secondary-color, 35%), 15%) !default;
    74  
    75  
    76  /*** Global ***/
    77  // Media Query Ranges
    78  $small-screen-up: 601px !default;
    79  $medium-screen-up: 993px !default;
    80  $large-screen-up: 1201px !default;
    81  $small-screen: 600px !default;
    82  $medium-screen: 992px !default;
    83  $large-screen: 1200px !default;
    84  
    85  $medium-and-up: "only screen and (min-width : #{$small-screen-up})" !default;
    86  $large-and-up: "only screen and (min-width : #{$medium-screen-up})" !default;
    87  $small-and-down: "only screen and (max-width : #{$small-screen})" !default;
    88  $medium-and-down: "only screen and (max-width : #{$medium-screen})" !default;
    89  $medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default;
    90  
    91  // Grid Variables
    92  $num-cols: 12 !default;
    93  $gutter-width: 1.5rem !default;
    94  $element-top-margin: $gutter-width/3 !default;
    95  $element-bottom-margin: ($gutter-width*2)/3 !default;
    96  
    97  /*** Navbar ***/
    98  $navbar-height: 64px !default;
    99  $navbar-height-mobile: 56px !default;
   100  $navbar-font-color: #fff !default;
   101  $navbar-brand-font-size: 2.1rem !default;
   102  
   103  /*** SideNav ***/
   104  $sidenav-bg-color: #fff !default;
   105  $sidenav-padding-right: 15px !default;
   106  
   107  /*** Photo Slider ***/
   108  $slider-bg-color: color('grey', 'base') !default;
   109  $slider-bg-color-light: color('grey', 'lighten-2') !default;
   110  $slider-indicator-color: color('green', 'base') !default;
   111  
   112  /*** Tabs ***/
   113  $tabs-underline-color: $primary-color-light !default;
   114  $tabs-text-color: $primary-color !default;
   115  $tabs-bg-color: #fff !default;
   116  
   117  /*** Tables ***/
   118  $table-border-color: #d0d0d0 !default;
   119  $table-striped-color: #f2f2f2 !default;
   120  
   121  /*** Toasts ***/
   122  $toast-height: 48px !default;
   123  $toast-color: #323232 !default;
   124  $toast-text-color: #fff !default;
   125  
   126  /*** Typography ***/
   127  $off-black: rgba(0, 0, 0, 0.87) !default;
   128  // Header Styles
   129  $h1-fontsize: 4.2rem !default;
   130  $h2-fontsize: 3.56rem !default;
   131  $h3-fontsize: 2.92rem !default;
   132  $h4-fontsize: 2.28rem !default;
   133  $h5-fontsize: 1.64rem !default;
   134  $h6-fontsize: 1rem !default;
   135  
   136  // Footer
   137  $footer-bg-color: $primary-color !default;
   138  
   139  // Flowtext
   140  $range : $large-screen - $small-screen !default;
   141  $intervals: 20 !default;
   142  $interval-size: $range / $intervals !default;
   143  
   144  /*** Collections ***/
   145  $collection-border-color: #e0e0e0 !default;
   146  $collection-bg-color: #fff !default;
   147  $collection-active-bg-color: $secondary-color !default;
   148  $collection-active-color: lighten($secondary-color, 55%) !default;
   149  $collection-hover-bg-color: #ddd !default;
   150  
   151  /* Progress Bar */
   152  $progress-bar-color: $secondary-color !default;