mirror of
https://github.com/anatolykopyl/vue-highlights.git
synced 2026-03-26 21:05:35 +00:00
93 lines
2.3 KiB
Stylus
93 lines
2.3 KiB
Stylus
// Variables
|
|
|
|
// Color
|
|
$color-primary ?= #ff3b8e
|
|
$color-brand ?= $color-primary
|
|
$color-brand-light ?= lighten($color-brand, 25%)
|
|
$color-brand-lighter ?= lighten($color-brand, 50%)
|
|
$color-brand-dark ?= darken($color-brand, 25%)
|
|
$color-brand-darker ?= darken($color-brand, 50%)
|
|
|
|
// Grays
|
|
$color-gray ?= #828c8f
|
|
$color-gray-1 ?= lighten($color-gray, 80%)
|
|
$color-gray-2 ?= lighten($color-gray, 70%)
|
|
$color-gray-3 ?= lighten($color-gray, 60%)
|
|
$color-gray-4 ?= lighten($color-gray, 50%)
|
|
$color-gray-5 ?= lighten($color-gray, 40%)
|
|
$color-gray-6 ?= lighten($color-gray, 30%)
|
|
$color-gray-7 ?= lighten($color-gray, 20%)
|
|
$color-gray-8 ?= lighten($color-gray, 10%)
|
|
$color-gray-9 ?= $color-gray
|
|
$color-gray-10 ?= darken($color-gray, 10%)
|
|
$color-gray-11 ?= darken($color-gray, 20%)
|
|
$color-gray-12 ?= darken($color-gray, 30%)
|
|
$color-gray-13 ?= darken($color-gray, 40%)
|
|
$color-gray-14 ?= darken($color-gray, 50%)
|
|
$color-gray-15 ?= darken($color-gray, 60%)
|
|
$color-gray-16 ?= darken($color-gray, 70%)
|
|
|
|
// Other colors
|
|
$color-black ?= #0a0a0a
|
|
$color-white ?= #fefefe
|
|
$color-blue ?= #00B0E9
|
|
$color-red ?= #f56c6c
|
|
$color-yellow ?= #f5ad58
|
|
$color-green ?= #67C23A
|
|
$color-pink ?= #D3529B
|
|
|
|
// App
|
|
$color-danger ?= $color-red
|
|
$color-warning ?= $color-yellow
|
|
$color-success ?= $color-green
|
|
$color-info ?= $color-blue
|
|
$color-background ?= $color-white
|
|
$color-border ?= #eaeaea
|
|
|
|
// Links
|
|
$color-link ?= $color-brand
|
|
$color-link-hover ?= $color-gray-8
|
|
$color-link-active ?= $color-gray-5
|
|
|
|
// Space
|
|
$space-base ?= 16px
|
|
$space-sm ?= 8px
|
|
$space-lg ?= 24px
|
|
|
|
$global-spaces ?= {
|
|
sm: $space-base * .5,
|
|
md: $space-base,
|
|
lg: $space-base * 1.25,
|
|
}
|
|
|
|
// Typo
|
|
$font-helvetica ?= Helvetica neue, Helvetica, Arial, sans-serif
|
|
$font-mono ?= Menlo, Monaco, Consolas, monospace
|
|
$font-default ?= $font-helvetica
|
|
|
|
$font-base ?= 14px
|
|
$font-xs ?= 10px
|
|
$font-sm ?= 12px
|
|
$font-md ?= $font-base
|
|
$font-lg ?= 16px
|
|
$font-xl ?= 18px
|
|
|
|
$font-h1 ?= 28px
|
|
$font-h2 ?= 24px
|
|
$font-h3 ?= 20px
|
|
$font-h4 ?= 18px
|
|
$font-h5 ?= 16px
|
|
$font-h6 ?= 14px
|
|
|
|
$font-weight-base ?= 400
|
|
$font-weight-light ?= 300
|
|
$font-weight-medium ?= 600
|
|
$font-weight-bold ?= 700
|
|
$font-weight-bolder ?= 800
|
|
|
|
$font-color-base ?= $color-gray-12
|
|
$font-color-light ?= $color-gray-4
|
|
|
|
$line-height-base ?= 1.5
|
|
$line-height-heading ?= 1.2
|