// Variables
//
// Variables should follow the `$component-state-property-size` formula for
// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
//
// Bootstrap overrides ===================================
//
// Color system
$white: #FFFFFF !default;
$gray-100: #F9FBFD !default;
$gray-200: #F1F4F8 !default;
$gray-300: #D9E2EF !default;
$gray-400: #C6D3E6 !default;
$gray-500: #ABBCD5 !default;
$gray-600: #869AB8 !default;
$gray-700: #506690 !default;
$gray-800: #384C74 !default;
$gray-900: #1B2A4E !default;
$black: #161C2D !default;
$primary: #335EEA !default;
$secondary: $gray-700 !default;
$primary-desat: #6C8AEC !default; // NEW
$success: #42BA96 !default;
$info: #7C69EF !default;
$warning: #FAD776 !default;
$danger: #DF4759 !default;
$light: $gray-100 !default;
$dark: $gray-900 !default;
/* beautify ignore:start */
$theme-colors: (
"primary": $primary,
"secondary": $secondary,
"success": $success,
"info": $info,
"warning": $warning,
"danger": $danger,
"light": $light,
"dark": $dark,
"primary-desat": $primary-desat, // NEW
"black": $black, // NEW
"white": $white // NEW
);
/* beautify ignore:end */
// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
$min-contrast-ratio: 1.75 !default;
// Customize the light and dark text colors for use in our YIQ color contrast function.
$color-contrast-dark: $gray-900 !default;
$color-contrast-light: $white !default;
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-shadows: true !default;
$enable-smooth-scroll: false !default;
$enable-rfs: false !default;
$enable-validation-icons: false !default;
$enable-negative-margins: true !default;
// Spacing
//
// Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing.
// You can add more entries to the $spacers map, should you need more variation.
$spacer: 1rem !default;
$spacers: () !default;
/* beautify ignore:start */
$spacers: map-merge(
(
0: 0,
1: ($spacer * .25), // 4px
2: ($spacer * .5), // 8px
3: ($spacer * .75), // 12px
4: $spacer, // 16px
5: ($spacer * 1.5), // 24px
6: ($spacer * 2), // 32px
7: ($spacer * 2.5), // 40px
8: ($spacer * 3), // 48px
9: ($spacer * 4), // 64px
10: ($spacer * 5), // 80px
11: ($spacer * 6), // 96px
12: ($spacer * 8), // 128px
13: ($spacer * 10), // 160px
14: ($spacer * 12), // 192px
15: ($spacer * 16), // 256px
16: ($spacer * 25), // 400px
),
$spacers
);
/* beautify ignore:end */
// Body
//
// Settings for the `` element.
$body-bg: $white !default;
$body-color: $black !default;
// Links
//
// Style anchor elements.
$link-decoration: none !default;
$link-hover-decoration: underline !default;
// Paragraphs
//
// Style p element.
$paragraph-margin-bottom: 1rem !default;
// Grid containers
//
// Define the maximum width of `.container` for different screen sizes.
/* beautify ignore:start */
$container-max-widths: (
sm: 540px,
md: 720px,
lg: 960px,
xl: 1040px
) !default;
/* beautify ignore:end */
// Grid columns
//
// Set the number of columns and specify the width of the gutters.
$grid-gutter-width: 2.5rem !default;
// Components
//
// Define common padding and border radius sizes and more.
$border-width: 1px !default;
$border-color: $gray-200 !default;
$border-radius-sm: .25rem !default;
$border-radius: 0.375rem !default;
$border-radius-lg: 0.5rem !default;
$border-radius-xl: 1rem !default; // NEW
$border-radius-pill: 50rem !default;
$box-shadow: 0 0.5rem 1.5rem fade-out($black, .9) !default;
$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
$box-shadow-lg: 0 1.5rem 4rem fade-out($black, .9) !default;
$box-shadow-light: 0 0.5rem 1.5rem fade-out($black, .95) !default;
$box-shadow-light-lg: 0 1.5rem 4rem fade-out($black, .95) !default;
$box-shadow-dark: 0 0.5rem 1.5rem fade-out($black, .85) !default;
$box-shadow-dark-lg: 0 1.5rem 4rem fade-out($black, .85) !default;
$box-shadow-lift: 0 1rem 2.5rem fade-out($black, .9), 0 .5rem 1rem -.75rem fade-out($black, .9) !default;
$box-shadow-lift-lg: 0 2rem 5rem fade-out($black, .9), 0 .5rem 1rem -.75rem fade-out($black, .95) !default;
$component-active-color: $white !default;
$component-active-bg: $primary !default;
// Typography
//
// Font, line-height, and color for body text, headings, and more.
$font-family-base: 'HKGroteskPro', serif !default;
$font-size-base: 1.0625rem !default; // 17px
$font-size-xs: 0.75rem !default; // 12px NEW
$font-size-sm: 0.9375rem !default; // 15px
$font-size-lg: 1.1875rem !default; // 19px
$font-weight-normal: 400 !default;
$font-weight-bold: 600 !default;
$font-weight-bolder: 700 !default;
$line-height-base: 1.6 !default;
$line-height-sm: 1.3 !default;
$line-height-lg: 1.3 !default;
$h1-font-size: 2.3125rem !default; // 37px
$h2-font-size: 1.9375rem !default; // 31px
$h3-font-size: 1.3125rem !default; // 21px
$h4-font-size: 1.1875rem !default; // 19px
$h5-font-size: 1.0625rem !default; // 17px
$h6-font-size: 0.75rem !default; // 12px
/* beautify ignore:start */
$font-sizes: (
1: $h1-font-size,
2: $h2-font-size,
3: $h3-font-size,
4: $h4-font-size,
5: $h5-font-size,
6: $h6-font-size,
sm: $font-size-sm,
lg: $font-size-lg
) !default;
/* beautify ignore:end */
$headings-margin-bottom: .5rem !default;
$headings-font-weight: $font-weight-normal !default;
$headings-line-height: 1 !default;
/* beautify ignore:start */
$display-font-sizes: (
1: 4.375rem, // 70px
2: 3.8125rem, // 61px
3: 3rem, // 48px
4: 2.6875rem // 43px
) !default;
/* beautify ignore:end */
$display-font-weight: $font-weight-normal !default;
$lead-font-size: 1.3125rem !default;
$lead-font-weight: $font-weight-normal !default;
$small-font-size: 88.2% !default;
$text-muted: $gray-600 !default;
$blockquote-font-size: 1.25rem !default;
$blockquote-footer-color: $gray-600 !default;
$blockquote-footer-font-size: $font-size-xs !default;
$hr-color: $border-color !default;
$hr-opacity: 1 !default;
// Tables
//
// Customizes the `.table` component with basic values, each used across all table variations.
$table-cell-padding-y: 1.5rem !default;
$table-cell-padding-x: 2rem !default;
$table-bg: $white !default;
$table-striped-bg: $gray-100 !default;
$table-active-bg: $gray-100 !default;
$table-hover-bg: $gray-100 !default;
$table-border-color: $border-color !default;
$table-group-seperator-color: inherit !default;
$table-bg-scale: -90% !default;
/* beautify ignore:start */
$table-variants: (
"primary": shift-color($primary, $table-bg-scale),
"secondary": shift-color($secondary, $table-bg-scale),
"success": shift-color($success, $table-bg-scale),
"info": shift-color($info, $table-bg-scale),
"warning": shift-color($warning, $table-bg-scale),
"danger": shift-color($danger, $table-bg-scale),
"light": $light,
"dark": $gray-800,
) !default;
/* beautify ignore:end */
$table-head-bg: $table-bg !default; // NEW
$table-head-color: $body-color !default; // NEW
// Buttons + Forms
//
// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
$input-btn-padding-y: .8125rem !default;
$input-btn-padding-x: 1.25rem !default;
$input-btn-font-size: $font-size-base !default;
$input-btn-line-height: $line-height-base !default;
$input-btn-focus-width: 0 !default;
$input-btn-focus-color: transparent !default;
$input-btn-focus-box-shadow: none !default;
$input-btn-padding-y-sm: .5625rem !default;
$input-btn-padding-x-sm: 1rem !default;
$input-btn-font-size-sm: $font-size-base !default;
$input-btn-line-height-sm: $line-height-base !default; // NEW
$input-btn-padding-y-lg: 1.122rem !default;
$input-btn-padding-x-lg: 1.5rem !default;
$input-btn-font-size-lg: $font-size-base !default;
$input-btn-line-height-lg: $line-height-base !default; // NEW
// Buttons
//
// For each of Bootstrap's buttons, define text, background, and border color.
$btn-font-weight: $font-weight-bold !default;
$btn-box-shadow: none !default;
$btn-active-box-shadow: none !default;
$btn-border-radius-sm: $border-radius !default;
$btn-border-radius-lg: $border-radius !default;
// Forms
$input-bg: $white !default;
$input-color: $body-color !default;
$input-border-color: $border-color !default;
$input-border-width: $border-width !default;
$input-box-shadow: none !default;
$input-border-radius-sm: $border-radius !default;
$input-border-radius-lg: $border-radius !default;
$input-focus-border-color: $primary !default;
$input-focus-box-shadow: $input-btn-focus-box-shadow !default;
$input-placeholder-color: $text-muted !default;
$form-check-input-active-filter: none !default;
$form-check-padding-start: 1.5rem !default;
$form-check-label-cursor: pointer !default;
$form-check-input-bg: $gray-300 !default;
$form-check-input-border: transparent !default;
$form-check-input-border-radius: $border-radius !default;
$form-check-input-focus-border: $form-check-input-border !default;
$form-check-input-focus-box-shadow: none !default;
$form-check-input-checked-color: $component-active-color !default;
$form-check-input-checked-bg-color: $component-active-bg !default;
$form-check-input-checked-bg-image: url("data:image/svg+xml,") !default;
$form-check-radio-checked-bg-image: url("data:image/svg+xml,") !default;
$form-check-input-indeterminate-color: $component-active-color !default;
$form-switch-color: $white !default;
$form-switch-width: 2.5rem !default;
$form-switch-padding-start: $form-switch-width + .5rem !default;
$form-switch-bg-image: url("data:image/svg+xml,") !default;
$form-switch-focus-color: $form-switch-color !default;
$form-switch-focus-bg-image: url("data:image/svg+xml,") !default;
$form-switch-checked-color: $form-switch-color !default;
$form-switch-checked-bg-image: url("data:image/svg+xml,") !default;
$input-group-addon-color: $input-placeholder-color;
$input-group-addon-bg: $input-bg !default;
$form-select-indicator-padding: 1.25rem !default;
$form-select-bg-size: 1em 1em !default;
$form-select-indicator-color: $gray-400 !default;
$form-select-indicator: url("data:image/svg+xml,") !default;
$form-select-box-shadow: $input-box-shadow !default;
$form-select-focus-border-color: $input-focus-border-color !default;
$form-select-focus-box-shadow: $input-focus-box-shadow !default;
$form-file-button-bg: $light !default;
$form-floating-label-opacity: 1 !default;
$form-floating-label-transform: translateY(-.5rem) !default;
$form-group-margin-bottom: 1rem !default; // NEW
// Navbar
$navbar-padding-y: 1.25rem !default;
$navbar-padding-x: 0 !default;
$navbar-nav-link-padding-x: 1.5rem !default;
$navbar-brand-font-size: 1.5rem !default;
$navbar-brand-margin-end: 0 !default;
$navbar-dark-color: $white !default;
$navbar-dark-hover-color: $white !default;
$navbar-dark-active-color: $white !default;
$navbar-dark-toggler-border-color: transparent !default;
$navbar-light-color: $gray-700 !default;
$navbar-light-hover-color: $primary !default;
$navbar-light-active-color: $primary !default;
$navbar-light-toggler-border-color: transparent !default;
// Dropdowns
//
// Dropdown menu container and contents.
$dropdown-min-width: 14rem !default;
$dropdown-padding-y: 1.625rem !default;
$dropdown-spacer: 0 !default;
$dropdown-font-size: $font-size-sm !default;
$dropdown-border-width: 0px !default;
$dropdown-box-shadow: $box-shadow !default;
$dropdown-link-color: $gray-700 !default;
$dropdown-link-hover-color: $primary !default;
$dropdown-link-hover-bg: none !default;
$dropdown-link-active-color: $primary !default;
$dropdown-link-active-bg: none !default;
$dropdown-item-padding-y: 0 !default;
$dropdown-item-padding-x: 1.75rem !default;
$dropdown-header-color: $primary !default;
// Pagination
$pagination-padding-y: $input-btn-padding-y !default;
$pagination-padding-x: $input-btn-padding-x !default;
$pagination-padding-y-sm: $input-btn-padding-y-sm !default;
$pagination-padding-x-sm: $input-btn-padding-x-sm !default;
$pagination-padding-y-lg: $input-btn-padding-y-lg !default;
$pagination-padding-x-lg: $input-btn-padding-x-lg !default;
$pagination-line-height: $line-height-base !default; // NEW
// Cards
$card-spacer-y: 2rem !default;
$card-spacer-x: 2rem !default;
$card-title-spacer-y: 1.5rem !default;
$card-border-width: 0px !default;
$card-border-color: $border-color !default;
$card-cap-padding-y: 1.5rem !default;
// Popovers
$popover-max-width: 380px !default;
$popover-border-color: transparent !default;
$popover-border-radius: $border-radius !default;
$popover-box-shadow: $box-shadow-lg !default;
$popover-header-bg: transparent !default;
$popover-header-padding-y: 1.5rem !default;
$popover-header-padding-x: 2rem !default;
$popover-body-color: $text-muted !default;
$popover-body-padding-y: 1.5rem !default;
$popover-body-padding-x: 2rem !default;
$popover-arrow-width: 1.25rem !default;
$popover-arrow-height: 0.625rem !default;
// Toasts
$toast-padding-y: .5rem !default;
// Badges
$badge-padding-y: .25rem !default;
$badge-padding-x: .75rem !default;
$border-radius-pill-padding-x: $badge-padding-x !default; // NEW
// Modals
$modal-inner-padding: 2.5rem !default;
$modal-backdrop-opacity: .8 !default;
// Alerts
$alert-padding-y: .75rem !default;
$alert-padding-x: 1.25rem !default;
$alert-bg-scale: 0% !default;
$alert-border-scale: 0% !default;
$alert-color-scale: 60% !default;
// List group
$list-group-border-color: $border-color !default;
$list-group-item-padding-y: 1.5rem !default;
$list-group-item-padding-x: 2rem !default;
// Figures
$figure-caption-font-size: $small-font-size !default;
$figure-caption-color: $text-muted !default;
// Breadcrumbs
$breadcrumb-padding-y: .75rem !default;
$breadcrumb-padding-x: 0 !default;
$breadcrumb-margin-bottom: 0 !default;
$breadcrumb-bg: transparent !default;
$breadcrumb-divider-color: $gray-700 !default;
$breadcrumb-active-color: $gray-700 !default;
$breadcrumb-border-radius: 0 !default;
// Close
$btn-close-width: .5em !default;
$btn-close-color: $text-muted !default;
$btn-close-text-shadow: none !default;
// Code
$code-font-size: 0.8125rem !default;
//
// Theme ===================================
//
// Paths
$path-to-img: "../img" !default;
$path-to-fonts: "../fonts" !default;
// Typography
$headings-letter-spacing: -.01em !default;
$h1-line-height: 1.3 !default;
$h2-line-height: 1.35 !default;
$h3-line-height: 1.4 !default;
$h4-line-height: 1.45 !default;
$h5-line-height: 1.5 !default;
$h6-line-height: 1.55 !default;
$display-line-height: 1.2 !default;
$display-letter-spacing: -.02em !default;
$h1-font-size-md: 1.875rem !default; // 30px
$h2-font-size-md: 1.5rem !default; // 24px
$h3-font-size-md: 1.125rem !default; // 18px
$h4-font-size-md: 1.0625rem !default; // 17px
$display1-font-size-md: 3.125rem !default; // 48px
$display2-font-size-md: 2.5rem !default; // 38px
$display3-font-size-md: 2.25rem !default; // 36px
$display4-font-size-md: 2rem !default; // 32px
$font-size-lg-md: 1.0625rem !default; // 17px
$lead-font-size-md: 1.1875rem !default; // 19px
$blockquote-small-font-weight: $font-weight-bold !default;
$blockquote-small-letter-spacing: .07em !default;
$letter-spacing-lg: .08em !default;
// Buttons + Forms
$input-btn-padding-y-xs: .25rem !default;
$input-btn-padding-x-xs: .625rem !default;
$input-btn-font-size-xs: $font-size-sm !default;
$input-btn-line-height-xs: $line-height-base !default;
// Buttons
$btn-soft-bg-opacity: .1 !default;
$btn-line-height-sm: $input-btn-line-height-sm !default;
$btn-line-height-lg: $input-btn-line-height-lg !default;
$btn-padding-y-xs: $input-btn-padding-y-xs !default;
$btn-padding-x-xs: $input-btn-padding-x-xs !default;
// Forms
$input-line-height-sm: $input-btn-line-height-sm !default;
$input-line-height-lg: $input-btn-line-height-lg !default;
$input-padding-y-xs: $input-btn-padding-y-xs !default;
$input-padding-x-xs: $input-btn-padding-x-xs !default;
$input-font-size-xs: $input-btn-font-size-xs !default;
$input-line-height-xs: $input-btn-line-height-xs !default;
$input-height-xs: calc(#{$input-btn-padding-y-xs * 2} + #{$input-btn-font-size-xs} * #{$input-line-height-xs} + #{$input-border-width * 2});
$form-check-input-bg-dark: rgba($white, .2) !default;
$form-check-input-checked-bg-color-dark: $white !default;
$form-switch-min-height: 1.375rem !default;
$form-switch-color-dark: $white !default;
$form-switch-focus-color-dark: $white !default;
$form-switch-checked-color-dark: $primary !default;
$form-switch-bg-image-dark: url("data:image/svg+xml,") !default;
$form-switch-focus-bg-image-dark: url("data:image/svg+xml,") !default;
$form-switch-checked-bg-image-dark: url("data:image/svg+xml,") !default;
$form-select-padding-y-xs: $input-padding-y-xs !default;
$form-select-padding-x-xs: $input-padding-x-xs !default;
$form-select-font-size-xs: $input-font-size-xs !default;
$form-select-line-height-xs: $input-line-height-xs !default;
$form-select-height-xs: $input-height-xs !default;
$form-select-indicator-padding-xs: .625rem !default;
$form-select-bg-size-xs: .75em !default;
$form-floating-label-font-size: $font-size-xs !default;
$form-floating-label-color: $input-placeholder-color !default;
// Navbar
$navbar-brand-font-weight: $font-weight-bold !default;
$navbar-nav-link-font-weight: $font-weight-bold !default;
$navbar-nav-item-spacing: 1.5rem !default;
$navbar-dropdown-toggle-margin-bottom: 1.5rem !default;
// Dropdowns
$dropdown-item-padding-x-lg: 2.5rem !default;
$dropdown-item-spacing-y: .45rem !default;
$dropdown-padding-x: $dropdown-item-padding-x !default;
$dropdown-padding-x-xs: 1.25rem !default;
$dropdown-padding-y-xs: 1rem !default;
$dropdown-padding-x-lg: $dropdown-item-padding-x-lg !default;
$dropdown-padding-y-lg: 2.375rem !default;
$dropdown-min-width-xs: 0 !default;
$dropdown-min-width-md: 22rem !default;
$dropdown-min-width-lg: 35rem !default;
$dropdown-min-width-xl: 42rem !default;
// Card
$card-meta-spacer-y: 1.5rem !default;
$card-row-spacer-y: 4rem !default;
$card-row-spacer-x: 2.5rem !default;
// Popover
$popover-header-font-size: $h6-font-size !default;
$popover-header-color: $primary !default;
// Badges
$badge-padding-y-lg: .7em !default;
$badge-padding-x-lg: 1.15em !default;
$badge-soft-bg-opacity: .1 !default;
// Breadcrumbs
$breadcrumb-font-size: $font-size-sm !default;
// Code
$code-line-height: 1.35 !default;
// Avatar
$avatar-size-base: 1.875rem !default;
$avatar-size-xs: 1rem !default;
$avatar-size-sm: 1.5rem !default;
$avatar-size-lg: 2.25rem !default;
$avatar-size-xl: 4rem !default;
$avatar-size-xxl: 5rem !default;
$avatar-title-bg: $gray-500 !default;
$avatar-title-color: $white !default;
// Icons
$icon-size-base: 3rem !default;
$icon-size-xs: 1.5rem !default;
$icon-size-sm: 2.25rem !default;
$icon-size-lg: 4rem !default;
$icon-size-xl: 5rem !default;
$icon-circle-size: 4.1875rem !default;
$icon-circle-font-size: 1.875rem !default;
// Images
$img-skewed-rotate-y: 35deg !default;
$img-skewed-rotate-x: 15deg !default;
// List
$list-item-spacing-y: .35rem;
$list-link-font-size: $font-size-sm !default;
$list-link-color: $gray-700 !default;
$list-link-hover-color: $primary !default;
// Screenshot
$screenshot-border-radius: 0.625rem !default;
$screenshot-box-shadow: 25px 60px 125px -25px fade-out($gray-700, .9), 16px 40px 75px -40px fade-out(black, .8) !default;
//
// Utilities =====================================
//
/* beautify ignore:start */
$utilities: (
"position": (
responsive: true,
property: position,
values: static relative absolute fixed sticky
),
"top": (
property: top,
values: (
0: 0,
)
),
"right": (
property: right,
values: (
0: 0,
)
),
"bottom": (
property: bottom,
values: (
0: 0,
)
),
"left": (
property: left,
values: (
0: 0,
)
),
"width": (
responsive: true,
property: width,
class: w,
values: (
25: 25%,
50: 50%,
75: 75%,
100: 100%,
110: 110%,
120: 120%,
130: 130%,
140: 140%,
150: 150%,
auto: auto
)
),
"max-width": (
responsive: true,
property: max-width,
class: mw,
values: (
25: 25%,
50: 50%,
75: 75%,
100: 100%,
110: 110%,
120: 120%,
130: 130%,
140: 140%,
150: 150%
)
),
"viewport-width": (
responsive: true,
property: width,
class: vw,
values: (
25: 25vw,
50: 50vw,
75: 75vw,
100: 100vw,
110: 110vw,
120: 120vw,
130: 130vw,
140: 140vw,
150: 150vw,
)
),
"height": (
responsive: true,
property: height,
class: h,
values: (
25: 25%,
50: 50%,
75: 75%,
100: 100%,
110: 110%,
120: 120%,
130: 130%,
140: 140%,
150: 150%,
auto: auto
)
),
"viewport-height": (
responsive: true,
property: height,
class: vh,
values: (
25: 25vh,
50: 50vh,
75: 75vh,
100: 100vh,
110: 110vh,
120: 120vh,
130: 130vh,
140: 140vh,
150: 150vh,
)
),
"background-color": (
property: background-color,
class: bg,
values: map-merge(
$theme-colors,
(
"white-20": rgba($white, .2),
"gray-200": $gray-200,
"gray-300": $gray-300,
"gray-800": $gray-800,
"gray-900": $gray-900,
"gray-900-50": rgba($gray-900, .5)
)
)
),
"rounded": (
property: border-radius,
class: rounded,
values: (
null: $border-radius,
0: 0,
1: $border-radius-sm,
2: $border-radius,
3: $border-radius-lg,
4: $border-radius-xl,
circle: 50%,
pill: $border-radius-pill
)
),
"border": (
responsive: true,
property: border,
values: (
null: $border-width solid $border-color,
0: 0,
)
),
"border-top": (
responsive: true,
property: border-top,
values: (
null: $border-width solid $border-color,
0: 0,
)
),
"border-end": (
responsive: true,
property: border-right,
values: (
null: $border-width solid $border-color,
0: 0,
)
),
"border-bottom": (
responsive: true,
property: border-bottom,
values: (
null: $border-width solid $border-color,
0: 0,
)
),
"border-start": (
responsive: true,
property: border-left,
values: (
null: $border-width solid $border-color,
0: 0,
)
),
"border-color": (
property: border-color,
class: border,
values: map-merge(
$theme-colors,
(
"white-10": rgba($white, .1),
"white-20": rgba($white, .2),
"gray-300": $gray-300,
"gray-800": $gray-800,
"gray-800-50": rgba($gray-800, .5),
"gray-900-50": rgba($gray-900, .5)
)
)
),
"shadow": (
property: box-shadow,
class: shadow,
values: (
null: $box-shadow,
"sm": $box-shadow-sm,
"lg": $box-shadow-lg,
"light": $box-shadow-light,
"dark": $box-shadow-dark,
"light-lg": $box-shadow-light-lg,
"dark-lg": $box-shadow-dark-lg,
"lift": $box-shadow-lift,
"none": none
)
),
"color": (
property: color,
class: text,
values: map-merge(
$theme-colors,
(
"gray-100": $gray-100,
"gray-200": $gray-200,
"gray-300": $gray-300,
"gray-400": $gray-400,
"gray-500": $gray-500,
"gray-600": $gray-600,
"gray-700": $gray-700,
"gray-800": $gray-800,
"gray-900": $gray-900,
"white": $white,
"body": $body-color,
"muted": $text-muted,
"muted-80": rgba($text-muted, .8),
"black-50": rgba($black, .5),
"white-50": rgba($white, .5),
"white-70": rgba($white, .7),
"white-75": rgba($white, .75),
"white-80": rgba($white, .8),
"reset": inherit,
)
)
),
"letter-spacing": (
property: letter-spacing,
values: (
lg: $letter-spacing-lg
)
),
"opacity": (
property: opacity,
values: (
0: 0,
1: 1
)
),
);
/* beautify ignore:end */