vue-wp/vue-theme/src/sss/variables.sss

@import './_ratios.sss'

$transition: 300ms

$min-width: 20em
$max-width: 77em

/* Circles for add page */
$radius: 2.5vw
$path: 4px

/* Proportion */
$base: 1.0em
$ratio: $minor-third

$ms-0: calc($base)
$ms--1: calc($ms-0 / $ratio)
$ms--2: calc($ms--1 / $ratio)
$ms--3: calc($ms--2 / $ratio)
$ms--4: calc($ms--3 / $ratio)
$ms--5: calc($ms--4 / $ratio)
$ms--6: calc($ms--5 / $ratio)
$ms-1: calc($ms-0 * $ratio)
$ms-2: calc($ms-1 * $ratio)
$ms-3: calc($ms-2 * $ratio)
$ms-4: calc($ms-3 * $ratio)
$ms-5: calc($ms-4 * $ratio)
$ms-6: calc($ms-5 * $ratio)
$ms-7: calc($ms-6 * $ratio)
$ms-8: calc($ms-7 * $ratio)
$ms-9: calc($ms-8 * $ratio)

/* Fonts */
$sans: 'Questrial', sans-serif
$serif: 'Hoefler Text', 'Crimson Text', serif
$mono: 'Roboto Mono', monospace

/* Screen Breaks */
$tiny: 375px
$small: 480px
$medium: 768px
$large: 960px
$extra-large: 1080px
$huge: 1200px
$ultra: 1440px