|
|
|
|
//
|
|
|
|
|
// Variables
|
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Type
|
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
$font-family-default: "Helvetica Neue", Helvetica, sans-serif;
|
|
|
|
|
$font-size-default: 17px;
|
|
|
|
|
$font-weight: 500;
|
|
|
|
|
$font-weight-light: 400;
|
|
|
|
|
$line-height-default: 21px;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Colors
|
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
|
|
// Main theme colors
|
|
|
|
|
$primary-color: #007aff;
|
|
|
|
|
$chrome-color: rgba(247,247,247,.98);
|
|
|
|
|
|
|
|
|
|
// Action colors
|
|
|
|
|
$default-color: #929292;
|
|
|
|
|
$positive-color: #4cd964;
|
|
|
|
|
$negative-color: #dd524d;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Bars
|
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
$bar-base-height: 44px;
|
|
|
|
|
$bar-tab-height: 50px;
|
|
|
|
|
$bar-side-spacing: 10px;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Buttons
|
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
$button-directional-padding: 20px;
|
|
|
|
|
$button-directional-margin: -($bar-side-spacing/2);
|
|
|
|
|
$button-font-size: 12px;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Transitions
|
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
$timing-fuction: cubic-bezier(.1, .5, .1, 1); // Inspired by @c2prods
|
|
|
|
|
|
|
|
|
|
// Misc
|
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
|
|
// Hairline dividers (.5px tall for retina devices.)
|
|
|
|
|
$hairline: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'><rect fill='#e6e6e6' x='0' y='0' width='1' height='0.5'/></svg>"); // Thanks to @madrobby
|
