_scss/minima.scss

   1 @charset "utf-8";
   2
   3 // Define defaults for each variable.
   4
   5 $base-font-family: Roboto, Helvetica, Arial, sans-serif !default;
   6 $base-font-size:   16px !default;
   7 $base-font-weight: 400 !default;
   8 $small-font-size:  $base-font-size * 0.875 !default;
   9 $base-line-height: 1.5 !default;
  10
  11 $spacing-unit:     30px !default;
  12
  13 $text-color:       #111 !default;
  14 $background-color: #fdfdfd !default;
  15 $brand-color:      #2a7ae2 !default;
  16
  17 $grey-color:       #828282 !default;
  18 $grey-color-light: lighten($grey-color, 40%) !default;
  19 $grey-color-dark:  darken($grey-color, 25%) !default;
  20
  21 $table-text-align: left !default;
  22
  23 // Width of the content area
  24 $content-width:    800px !default;
  25
  26 $on-palm:          600px !default;
  27 $on-laptop:        800px !default;
  28
  29 // Use media queries like this:
  30 // @include media-query($on-palm) {
  31 //   .wrapper {
  32 //     padding-right: $spacing-unit / 2;
  33 //     padding-left: $spacing-unit / 2;
  34 //   }
  35 // }
  36 @mixin media-query($device) {
  37   @media screen and (max-width: $device) {
  38     @content;
  39   }
  40 }
  41
  42 @mixin relative-font-size($ratio) {
  43   font-size: $base-font-size * $ratio;
  44 }
  45
  46 // Import partials.
  47 @import
  48   "minima/base",
  49   "minima/layout",
  50   "minima/syntax-highlighting"
  51 ;