hacks-guide-minimal-mistake.../assets/scss/_variables.scss

101 lines
No EOL
2.7 KiB
SCSS

/* ==========================================================================
Variables
========================================================================== */
/*
Typography
========================================================================== */
$doc-font-size : 16;
$doc-line-height : 26;
$paragraph-indent : false !default;
$indent-var : 0rem + ($doc-line-height / $doc-font-size);
$serif : "PT Serif", serif;
$sans-serif : -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;
$sans-serif-narrow : "PT Sans Narrow", sans-serif;
$monospace : Monaco, Consolas, "Lucida Console", monospace;
/*
Colors
========================================================================== */
$gray : #4c4c4c;
$dark-gray : #191413;
$light-gray : #e2e2e2;
$lighter-gray : #f9f9f9;
$body-color : #fff;
$background-color : #fff;
$text-color : #333332;
$border-color : $light-gray;
$base-color : #343434;
$comp-color : spin($base-color, 180);
$accent-color : #000;
/* buttons */
$primary-color : #000;
$success-color : #5cb85c;
$warning-color : #dd8338;
$danger-color : #C64537;
$info-color : #308cbc;
/* brands */
$facebook-color : #3b5998;
$flickr-color : #ff0084;
$foursquare-color : #0cbadf;
$google-plus-color : #dd4b39;
$instagram-color : #4e433c;
$linkedin-color : #4875b4;
$pinterest-color : #cb2027;
$rss-color : #fa9b39;
$tumblr-color : #2c4762;
$twitter-color : #55acee;
$vimeo-color : #1ab7ea;
$youtube-color : #ff3333;
/* links */
$link-color : #343434;
$link-color-hover : darken($link-color, 10);
$link-color-visited : lighten($link-color-hover, 20);
$link-color-focus : darken($link-color-visited, 10);
$border-radius : 4px;
/*
Breakpoints
========================================================================== */
@include breakpoint-set("to ems", true);
$small : 600px;
$medium : 768px;
$medium-wide : 900px;
$large : 1024px;
$x-large : 1280px;
/*
Grid
========================================================================== */
$right-sidebar-width : 300px;
$susy: (
columns: 12,
// column-width: 90px,
gutters: 1/4,
math: fluid,
output: float,
gutter-position: after,
container: $large,
global-box-sizing: border-box,
// debug: (
// image: show,
// color: blue,
// output: overlay,
// toggle: top right,
// ),
);