src/assets/styles/_variable.scss
/* Sizes */
$header-height: 36px;
$sidebar-width: 48px;
$aside-width: 202px;
$aside-padding: 0;
$content-padding: 15px;
$layout-width: 1200px;
$layout-margin: 42px;
/* Animation */
$a-time: .3s;
$a-func: linear;
$a-delay: 0s;
$a-micro-time: .15s;
$a-long-time: .7s;
$font-size-base: 10px;
$font-size-limit: 12px;
// $font-family-base: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
$font-family-base: 'Avenir Next', Avenir, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, Arial, sans-serif;
$p-variations-percent: 10%;
/* System */
$c-text-color: #29323d;
$c-normal-color: rgba(0, 0, 0, .8);
$c-normal-background: #e6e6e6;
$c-select-color: #f00;
$c-select-background: #000;
$c-placeholder-color: #000;
$c-placeholder-opacity: .5;
$c-focus-color: #4353ff;
$c-input-text: #29323d;
/* Colors */
$c-link: #656d79;
$c-blue: #437fc1;
$c-smalt: #00278c;
$c-border: #cdcdcd;
$c-cerulean: #009ee3;
$c-rangoon-green: #1a171b;
$c-error: #f10;
$c-success: #28c75d;
$c-alert: #fffce0;
$c-link: #07c;
$c-link-visited: #6ea4db;
$c-secondary: #c7c7c7;
$c-bg-secondary: #f0f0f0;
$c-help: #999;
$c-black: #000;
$c-white: #fff;
$c-snow: #fafafa;
$c-gainsboro: #e1e1e1;
$c-cobalt: #00529f;
$c-silver: #ccc;
$c-roman: #e65d5b;
$c-smalt: #063d8d;
$c-whisper: #e5e5e5;
$c-pink-swan: #b3b3b3;
$c-light-blue: #b5d7ec;
$c-carrot-orange: #f8991c;
$c-dark-gray: #a4a4a4;
$c-amaranth: #e2394e;
$c-white-smoke: #f7f7f7;
$c-lighter-color: #b3b3b3;
/* New colors */
$c-red: #ff564e;
$c-green: #28bc00;
$c-yellow: #ffc000;
/* buttons */
$c-button-link: #0052cc;
$c-button-subtle-link: #6b778c;
$c-info-color: #034067;
$c-info-border: #04beda;
$c-info-background: #04beda;
$c-normal-color: #313b4d;
$c-normal-border: #e8e8e8;
$c-normal-background: #fff;
$c-primary-color: #fff;
$c-primary-border: #0052cc;
$c-primary-background: #0052cc;
$c-success-color: #06543a;
$c-success-border: #28c75d;
$c-success-background: #28c75d;
$c-warning-color: #8e6f31;
$c-warning-border: #f5dc74;
$c-warning-background: #f5dc74;
$c-danger-color: #fff;
$c-danger-border: #dc371d;
$c-danger-background: #dc371d;