$white: #fff; $black: #000; $body-bg: #fff; $body-color: #212529; // site specific variables // bootstrap settings // screen size - 32px (ex. 1400 - 32 = 1368) $grid-breakpoints: (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1168px); // screen size - (32px * 2) (ex. 1400 - 64 = 1336) $container-max-widths: (sm: 540px, md: 720px, lg: 960px, xl: 1136px); $enable-gradients: false; $enable-shadows: false; $body-header-bg: $body-bg; $body-header-color: $body-color; $body-header-link: $body-color; $body-main-nav-link-color: $body-color; $body-main-nav-link-hover-color: $body-color; $body-main-nav-dropdown-hover-bg: $body-color; $body-footer-footer-bg: $body-bg; $font-family-base: 'Roboto'; // $full-body-min-width: map-get($grid-breakpoints, 'lg'); $typography-breakpoint: map-get($grid-breakpoints, 'sm') - 1; $header-bg: var(--header-bg); $header-color: var(--header-color); $header-link: var(--header-link); $main-nav-link-color: var(--main-nav-link-color); $main-nav-link-bg: none; $main-nav-toggler-size: 2rem; $main-nav-link-hover-bg: none; $main-nav-link-hover-color: var(--main-nav-link-hover-color); $main-nav-dropdown-bg: $header-bg; $main-nav-dropdown-color: $header-link; $main-nav-dropdown-hover-bg: var(--main-nav-dropdown-hover-bg); $main-nav-dropdown-hover-color: $main-nav-link-hover-color; $footer-bg: $header-bg; $footer-color: $header-color; $footer-link: $header-link; $footer-footer-bg: var(--footer-footer-bg); $sliderelement-carousel-slide-max-y: none; $sliderelement-carousel-slide-bg: $header-bg; $sliderelement-carousel-slide-ratio-x: 16; $sliderelement-carousel-slide-ratio-y: 9; $carousel-title-color: $white; $carousel-slide-min-height: 4rem; $carousel-text-shadow: 1px 1px $black; $carousel-controls-font-size: 3rem; $carousel-controls-zindex: 11; $carousel-controls-shadow: 1px 1px $black; $carousel-controls-hover-bg: transparentize($black, 0.4); $carousel-slide-img-loading-max-height: 70vh; // disable large screen sizing by default $extra-large-screen: 80000px; @import '~@a2nt/ss-bootstrap-ui-webpack-boilerplate-react/src/scss/_variables'; $headings-margin-bottom: $spacer; $headings-line-height: 1.2; $font-family-base: 'Roboto', $font-family-sans-serif;