104 lines
2.4 KiB
SCSS
104 lines
2.4 KiB
SCSS
:root {
|
|
--baseFontFamily: 'Source Sans Pro', sans-serif, emoji;
|
|
--monospaceFontFamily: 'Ubuntu Mono', monospace, emoji;
|
|
--iconFontFamily: 'remixicon';
|
|
|
|
--txtPrimaryColor: #16161a;
|
|
--txtHintColor: #666f75;
|
|
--txtDisabledColor: #a0a6ac;
|
|
|
|
--primaryColor: #16161a;
|
|
|
|
--bodyColor: #f8f9fa;
|
|
|
|
--baseColor: #ffffff;
|
|
--baseAlt1Color: #e4e9ec;
|
|
--baseAlt2Color: #d7dde4;
|
|
--baseAlt3Color: #c6cdd7;
|
|
--baseAlt4Color: #a5b0c0;
|
|
|
|
--infoColor: #5499e8;
|
|
--infoAltColor: #cee2f8;
|
|
--successColor: #32ad84;
|
|
--successAltColor: #c4eedc;
|
|
--dangerColor: #e34562;
|
|
--dangerAltColor: #f7cad2;
|
|
--warningColor: #ff944d;
|
|
--warningAltColor: #ffd4b8;
|
|
|
|
--overlayColor: rgba(53, 71, 104, 0.28);
|
|
--tooltipColor: rgba(0, 0, 0, 0.85);
|
|
--shadowColor: rgba(0, 0, 0, 0.06);
|
|
|
|
--baseFontSize: 14.5px;
|
|
--xsFontSize: 12px;
|
|
--smFontSize: 13px;
|
|
--lgFontSize: 15px;
|
|
--xlFontSize: 16px;
|
|
|
|
--baseLineHeight: 22px;
|
|
--smLineHeight: 16px;
|
|
--lgLineHeight: 24px;
|
|
|
|
--inputHeight: 34px;
|
|
|
|
--btnHeight: 40px;
|
|
--xsBtnHeight: 22px;
|
|
--smBtnHeight: 30px;
|
|
--lgBtnHeight: 54px;
|
|
|
|
--baseSpacing: 30px;
|
|
--xsSpacing: 15px;
|
|
--smSpacing: 20px;
|
|
--lgSpacing: 50px;
|
|
--xlSpacing: 60px;
|
|
|
|
--wrapperWidth: 850px;
|
|
--smWrapperWidth: 420px;
|
|
--lgWrapperWidth: 1200px;
|
|
|
|
--appSidebarWidth: 75px;
|
|
--pageSidebarWidth: 235px;
|
|
|
|
--baseAnimationSpeed: 150ms;
|
|
--activeAnimationSpeed: 70ms;
|
|
--entranceAnimationSpeed: 250ms;
|
|
|
|
--baseRadius: 4px;
|
|
--lgRadius: 12px;
|
|
--btnRadius: 4px;
|
|
|
|
// https://developer.mozilla.org/en-US/docs/Web/CSS/accent-color
|
|
accent-color: var(--primaryColor);
|
|
}
|
|
|
|
|
|
// Maps
|
|
// ----
|
|
$colorsMap: (
|
|
"primary": var(--primaryColor),
|
|
"info": var(--infoColor),
|
|
"info-alt": var(--infoAltColor),
|
|
"success": var(--successColor),
|
|
"success-alt": var(--successAltColor),
|
|
"danger": var(--dangerColor),
|
|
"danger-alt": var(--dangerAltColor),
|
|
"warning": var(--warningColor),
|
|
"warning-alt": var(--warningAltColor),
|
|
);
|
|
|
|
$sidesMap: (
|
|
"t": "top",
|
|
"r": "right",
|
|
"b": "bottom",
|
|
"l": "left",
|
|
);
|
|
|
|
$sizesMap: (
|
|
"base": var(--baseSpacing),
|
|
"xs": var(--xsSpacing),
|
|
"sm": var(--smSpacing),
|
|
"lg": var(--lgSpacing),
|
|
"xl": var(--xlSpacing),
|
|
);
|