106 lines
2.6 KiB
SCSS
106 lines
2.6 KiB
SCSS
// Color system
|
|
|
|
// scss-docs-start gray-color-variables
|
|
$white: #FFFFFF;
|
|
$gray-100: #F4F4F4;
|
|
$gray-200: #CACBCC;
|
|
$gray-300: #B3B4B5;
|
|
$gray-400: #B0B3B3;//Default Gray (Gray 400)
|
|
$black: #000;
|
|
// scss-docs-end gray-color-variables
|
|
|
|
// fusv-disable
|
|
// scss-docs-start gray-colors-map
|
|
$grays: (
|
|
"100": $gray-100,
|
|
"200": $gray-200,
|
|
"300": $gray-300,
|
|
"400": $gray-400,
|
|
);
|
|
// scss-docs-end gray-colors-map
|
|
// fusv-enable
|
|
|
|
// scss-docs-start color-variables
|
|
$blue-100: #E4F1F7;
|
|
$blue-200: #E7F1F6;
|
|
$blue-300: #B9D7E6;
|
|
$blue-400: #125B7E;
|
|
$blue-600: #1574A1;
|
|
$blue-700: #06577C;
|
|
$blue: #167CAC;//Default Blue (Blue 500)
|
|
$indigo: #6610f2;
|
|
$purple: #6f42c1;
|
|
$pink: #d63384;
|
|
$red-200: #FBE9E8;
|
|
$red-300: #F3BEBA;
|
|
$red: #DA291C;//Default Red (Red 400)
|
|
$red-500: #AF2117;
|
|
$orange: #fd7e14;
|
|
$yellow-200: #FEF6E8;
|
|
$yellow-300: #FCE6BA;
|
|
$yellow: #F88F1C;//Default Yellow (Yellow 400)
|
|
$green-200: #E6F2EC;
|
|
$green-300: #B5DAC8;
|
|
$green: #098649;//Default Green (Green 400)
|
|
$green-500: #075F35;
|
|
$teal: #20c997;
|
|
$cyan: #0dcaf0;
|
|
// scss-docs-end color-variables
|
|
|
|
// scss-docs-start colors-map
|
|
$colors: (
|
|
"blue": $blue,
|
|
"indigo": $indigo,
|
|
"purple": $purple,
|
|
"pink": $pink,
|
|
"red": $red,
|
|
"orange": $orange,
|
|
"yellow": $yellow,
|
|
"green": $green,
|
|
"teal": $teal,
|
|
"cyan": $cyan,
|
|
"white": $white,
|
|
"gray": $gray-400,
|
|
"gray-dark": $gray-400
|
|
);
|
|
// scss-docs-end colors-map
|
|
|
|
// scss-docs-start theme-color-variables
|
|
$primary: $red;
|
|
$secondary: $gray-400;
|
|
$success: $green;
|
|
$info: $cyan;
|
|
$warning: $yellow;
|
|
$danger: $red-500;
|
|
$light: $gray-100;
|
|
$dark: $gray-400;
|
|
// scss-docs-end theme-color-variables
|
|
|
|
// scss-docs-start theme-colors-map
|
|
$theme-colors: (
|
|
"primary": $primary,
|
|
"secondary": $secondary,
|
|
"success": $success,
|
|
"info": $info,
|
|
"warning": $warning,
|
|
"danger": $danger,
|
|
"light": $light,
|
|
"dark": $dark
|
|
);
|
|
// scss-docs-end theme-colors-map
|
|
|
|
//Fonts
|
|
$font-family-sans-serif: Roboto, Arial, Helvetica, sans-serif;
|
|
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
// stylelint-enable value-keyword-case
|
|
$font-family-base: $font-family-sans-serif;
|
|
$font-family-code: $font-family-monospace;
|
|
|
|
//Gutters
|
|
$grid-gutter-width: .75rem;
|
|
|
|
//Border Radius
|
|
$border-radius: .25rem;
|
|
$border-radius-sm: .2rem;
|
|
$border-radius-lg: .5rem;//Used for buttons. Can be used for other things, of course.
|
|
$border-radius-pill: 50rem;
|