74 lines
2.6 KiB
SCSS
74 lines
2.6 KiB
SCSS
|
// Typography Variables
|
||
|
|
// -------------------------------------------------
|
||
|
|
|
||
|
|
// Basic Typography
|
||
|
|
$base-font-size: 14px;
|
||
|
|
$base-line-height: 1.8;
|
||
|
|
$font-size: $base-font-size !default;
|
||
|
|
$browser-font-size: 16px !default;
|
||
|
|
|
||
|
|
// Body type
|
||
|
|
$body-font-family: 'Open Sans', sans-serif !default;
|
||
|
|
$body-font-weight: 400 !default;
|
||
|
|
$body-font-style: normal !default;
|
||
|
|
|
||
|
|
// Heading type
|
||
|
|
$heading-font-weight: 600 !default;
|
||
|
|
$heading-font-style: normal !default;
|
||
|
|
|
||
|
|
// Color Variables
|
||
|
|
// -------------------------------------------------
|
||
|
|
|
||
|
|
// Project base color
|
||
|
|
// ==================================
|
||
|
|
$color-1: #fff !default;
|
||
|
|
$color-2: #333 !default;
|
||
|
|
$color-3: #222 !default;
|
||
|
|
$color-4: #929292 !default;
|
||
|
|
$color-5: #13aff0 !default;
|
||
|
|
$color-6: #0b7cac !default;
|
||
|
|
$color-7: #e9e9e9 !default;
|
||
|
|
$color-8: #f8f8f8 !default;
|
||
|
|
$color-9: #f1f1f1 !default;
|
||
|
|
$color-10: #ddd !default;
|
||
|
|
$color-11: #555 !default;
|
||
|
|
$color-12: #1B1B1B !default;
|
||
|
|
$color-13: #bbb !default;
|
||
|
|
$color-14: #444 !default;
|
||
|
|
$color-15: #777 !default;
|
||
|
|
$color-16: #f5f5f5 !default;
|
||
|
|
$color-17: #666 !default;
|
||
|
|
$color-18: #4a4a4a !default;
|
||
|
|
|
||
|
|
// ===================================
|
||
|
|
|
||
|
|
// Base colors
|
||
|
|
$body-bg-color: $color-1 !default;
|
||
|
|
$border-color: $color-7 !default;
|
||
|
|
$selection-bg-color: $color-2 !default;
|
||
|
|
$selection-font-color: $color-1 !default;
|
||
|
|
|
||
|
|
// Typography colors
|
||
|
|
$body-font-color: $color-18 !default;
|
||
|
|
$heading-font-color: $color-2 !default;
|
||
|
|
|
||
|
|
// Link colors
|
||
|
|
$link-color: $color-2 !default;
|
||
|
|
$link-hover-color: $color-5 !default;
|
||
|
|
|
||
|
|
// Settings Hamburgers buttons
|
||
|
|
// ==================================================
|
||
|
|
$hamburger-layer-width : 20px !default;
|
||
|
|
$hamburger-layer-height : 2px !default;
|
||
|
|
$hamburger-layer-spacing : 5px !default;
|
||
|
|
$hamburger-layer-color : #000 !default;
|
||
|
|
$hamburger-layer-border-radius : 3px !default;
|
||
|
|
$hamburger-hover-opacity : 0.7 !default;
|
||
|
|
$hamburger-hover-transition-duration : 0.15s !default;
|
||
|
|
$hamburger-hover-transition-timing-function: linear !default;
|
||
|
|
|
||
|
|
// To use CSS filters as the hover effect instead of opacity,
|
||
|
|
// set $hamburger-hover-use-filter as true and
|
||
|
|
// change the value of $hamburger-hover-filter accordingly.
|
||
|
|
$hamburger-hover-use-filter: false !default;
|
||
|
|
$hamburger-hover-filter : opacity(50%) !default;
|