111 lines
2.8 KiB
SCSS
111 lines
2.8 KiB
SCSS
// Color system
|
|
$gray-100: hsl(210, 20%, 98%) !default;
|
|
$gray-200: hsl(210, 20%, 93%) !default;
|
|
$gray-300: hsl(210, 20%, 89%) !default;
|
|
$gray-400: hsl(210, 20%, 81%) !default;
|
|
$gray-500: hsl(210, 20%, 71%) !default;
|
|
$gray-600: hsl(210, 20%, 46%) !default;
|
|
$gray-700: hsl(210, 20%, 31%) !default;
|
|
$gray-800: hsl(210, 20%, 23%) !default;
|
|
$gray-900: hsl(210, 50%, 15%) !default;
|
|
|
|
$white: #fff !default;
|
|
$black: #000 !default;
|
|
|
|
$blue: #0d6efd !default; // From Bootstrap
|
|
$indigo: #6610f2 !default; // From Bootstrap
|
|
$purple: hsl(265, 60%, 50%) !default; // Chosen
|
|
$pink: #d63384 !default; // From Bootstrap
|
|
$red: hsl(0, 100%, 43%) !default; // Chosen
|
|
$orange: hsl(30, 100%, 50%) !default; // Chosen, the Gold color from God
|
|
$green: hsl(134, 87%, 30%) !default; // Chosen
|
|
$teal: #20c997 !default; // From Bootstrap
|
|
$cyan: #0dcaf0 !default; // From Bootstrap
|
|
|
|
$primary: $purple !default;
|
|
$info: $blue !default;
|
|
$warning: $orange !default;
|
|
|
|
// Options
|
|
$enable-shadows: true !default;
|
|
|
|
// Spacing
|
|
$spacer: 1rem !default;
|
|
$spacers: (
|
|
0: 0,
|
|
1: $spacer * .25,
|
|
2: $spacer * .5,
|
|
3: $spacer,
|
|
4: $spacer * 1.5,
|
|
45: $spacer * 2,
|
|
5: $spacer * 3,
|
|
6: $spacer * 4,
|
|
7: $spacer * 5,
|
|
8: $spacer * 6,
|
|
9: $spacer * 7,
|
|
10: $spacer * 8,
|
|
11: $spacer * 9,
|
|
) !default;
|
|
|
|
// Links
|
|
$link-hover-decoration: none !default;
|
|
|
|
// Components
|
|
$focus-ring-width: .175rem !default;
|
|
$focus-ring-opacity: .175 !default;
|
|
|
|
// Typography
|
|
$font-family-sans-serif: "Roboto", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
|
|
|
|
$font-size-base: 1rem !default;
|
|
|
|
$line-height-base: 1.6 !default;
|
|
|
|
$h1-font-size: $font-size-base * 1.6 !default;
|
|
$h2-font-size: $font-size-base * 1.4 !default;
|
|
$h3-font-size: $font-size-base * 1.3 !default;
|
|
$h4-font-size: $font-size-base * 1.2 !default;
|
|
$h5-font-size: $font-size-base * 1.1 !default;
|
|
$h6-font-size: $font-size-base !default;
|
|
|
|
$headings-font-weight: bold !default; // Make headings bold
|
|
|
|
$lead-font-weight: normal;
|
|
|
|
// Tables
|
|
$table-hover-bg-factor: .03 !default;
|
|
|
|
// Buttons + Forms
|
|
|
|
// Buttons
|
|
$btn-box-shadow: none;
|
|
$enable-gradients: true;
|
|
$btn-transition: none;
|
|
|
|
// Forms
|
|
$input-bg: $white;
|
|
$input-color: $black;
|
|
$input-border-color: $gray-500;
|
|
$input-transition: none;
|
|
|
|
// Navs
|
|
$nav-link-transition: none;
|
|
|
|
// Navbar
|
|
$navbar-dark-color: rgba($white, .8) !default;
|
|
$navbar-dark-hover-color: $white !default;
|
|
|
|
// Dropdown
|
|
$dropdown-link-hover-bg: hsl(200, 36%, 95%);
|
|
|
|
// Cards
|
|
$card-border-width: 0;
|
|
$card-box-shadow: 0 .125rem .25rem rgba($black, .075);
|
|
|
|
// Breadcrumb
|
|
$breadcrumb-divider: quote(">");
|
|
|
|
// Code
|
|
$code-font-size: 100% !default;
|
|
$code-color: $purple !default;
|