You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
123 lines
3.5 KiB
123 lines
3.5 KiB
// Core variables
|
|
$version: "0.5.8";
|
|
|
|
// Core features
|
|
$rtl: false !default;
|
|
|
|
$yellow: #DEB8AE;
|
|
$blue: #0aa;
|
|
$red: #a00;
|
|
$gray: #444;
|
|
$snow: #eee;
|
|
$black: #000;
|
|
$green: #0a0;
|
|
$white: #fff;
|
|
$debug: red;
|
|
|
|
// Core colors
|
|
$primary-color: $gray !default;
|
|
$primary-color-dark: darken($primary-color, 3%) !default;
|
|
$primary-color-light: lighten($primary-color, 3%) !default;
|
|
$secondary-color: lighten($red, 17.5%) !default;
|
|
$secondary-color-dark: darken($secondary-color, 10%) !default;
|
|
$secondary-color-light: lighten($secondary-color, 10%) !default;
|
|
|
|
// Gray colors
|
|
$dark-color: $gray !default;
|
|
$light-color: $snow !default;
|
|
$gray-color: $gray !default;
|
|
$gray-color-dark: darken($gray-color, 10%) !default;
|
|
$gray-color-light: lighten($gray-color, 20%) !default;
|
|
|
|
$border-color: lighten($green, 65%) !default;
|
|
$border-color-dark: darken($border-color, 10%) !default;
|
|
$border-color-light: lighten($border-color, 8%) !default;
|
|
$bg-color: $black !default;
|
|
$bg-color-dark: darken($bg-color, 10%) !default;
|
|
$bg-color-light: lighten($bg-color, 10%) !default;
|
|
|
|
// Control colors
|
|
$success-color: $green !default;
|
|
$warning-color: $yellow !default;
|
|
$error-color: $red !default;
|
|
|
|
// Other colors
|
|
$code-color: $green !default;
|
|
$highlight-color: #ffe9b3 !default;
|
|
$body-bg: $bg-color !default;
|
|
$body-font-color: darken($white, 10%) !default;
|
|
$link-color: $green !default;
|
|
$link-color-dark: $red !default;
|
|
$link-color-light: $yellow !default;
|
|
|
|
// Fonts
|
|
// Credit: https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/
|
|
$base-font-family: "Tandy1K" !default;
|
|
$mono-font-family: "Tandy1KMono", monospace !default;
|
|
$fallback-font-family: "Roboto", sans-serif !default;
|
|
$body-font-family: $base-font-family, $fallback-font-family !default;
|
|
|
|
// Unit sizes
|
|
$unit-o: .05rem !default;
|
|
$unit-h: .1rem !default;
|
|
$unit-1: .2rem !default;
|
|
$unit-2: .4rem !default;
|
|
$unit-3: .6rem !default;
|
|
$unit-4: .8rem !default;
|
|
$unit-5: 1rem !default;
|
|
$unit-6: 1.2rem !default;
|
|
$unit-7: 1.4rem !default;
|
|
$unit-8: 1.6rem !default;
|
|
$unit-9: 1.8rem !default;
|
|
$unit-10: 2rem !default;
|
|
$unit-12: 2.4rem !default;
|
|
$unit-16: 3.2rem !default;
|
|
|
|
// Font sizes
|
|
$html-font-size: 16px !default;
|
|
$html-line-height: 1.5 !default;
|
|
$font-size: 1rem !default;
|
|
$font-size-sm: .9rem !default;
|
|
$font-size-lg: 1.9rem !default;
|
|
$line-height: 1.5rem !default;
|
|
|
|
// Sizes
|
|
$layout-spacing: $unit-2 !default;
|
|
$layout-spacing-sm: $unit-1 !default;
|
|
$layout-spacing-lg: $unit-4 !default;
|
|
$border-radius: $unit-h !default;
|
|
$border-width: $unit-o !default;
|
|
$border-width-lg: $unit-h !default;
|
|
$control-size: $unit-9 !default;
|
|
$control-size-sm: $unit-7 !default;
|
|
$control-size-lg: $unit-10 !default;
|
|
$control-padding-x: $unit-2 !default;
|
|
$control-padding-x-sm: $unit-2 * .75 !default;
|
|
$control-padding-x-lg: $unit-2 * 1.5 !default;
|
|
$control-padding-y: ($control-size - $line-height) / 2 - $border-width !default;
|
|
$control-padding-y-sm: ($control-size-sm - $line-height) / 2 - $border-width !default;
|
|
$control-padding-y-lg: ($control-size-lg - $line-height) / 2 - $border-width !default;
|
|
$control-icon-size: .8rem !default;
|
|
|
|
$control-width-xs: 180px !default;
|
|
$control-width-sm: 320px !default;
|
|
$control-width-md: 640px !default;
|
|
$control-width-lg: 960px !default;
|
|
$control-width-xl: 1280px !default;
|
|
|
|
// Responsive breakpoints
|
|
$size-xs: 480px !default;
|
|
$size-sm: 600px !default;
|
|
$size-md: 840px !default;
|
|
$size-lg: 960px !default;
|
|
$size-xl: 1280px !default;
|
|
$size-2x: 1440px !default;
|
|
|
|
$responsive-breakpoint: $size-xs !default;
|
|
|
|
// Z-index
|
|
$zindex-0: 1 !default;
|
|
$zindex-1: 100 !default;
|
|
$zindex-2: 200 !default;
|
|
$zindex-3: 300 !default;
|
|
$zindex-4: 400 !default;
|
|
|