getbase
Version:
A Rock Solid, Responsive HTML/CSS Framework built to work on all devices big and small.
83 lines (74 loc) • 3.73 kB
text/less
// ==========================================================================
// Base – Variables
// ==========================================================================
// Global Typography
@base-background-color: #fff;
@base-font-family: sans-serif;
@base-font-size: 16;
@base-line-height: 22;
@base-font-weight: 400;
@base-font-color: #000;
@base-link-color: #000;
@base-link-hover-color: #000;
// Headings
@base-heading-font-family: sans-serif;
@base-h1-font-size: 32;
@base-h1-line-height: 38;
@base-h1-font-weight: 700;
@base-h1-color: #000;
@base-h2-font-size: 26;
@base-h2-line-height: 32;
@base-h2-font-weight: 700;
@base-h2-color: #000;
@base-h3-font-size: 22;
@base-h3-line-height: 28;
@base-h3-font-weight: 700;
@base-h3-color: #000;
@base-h4-font-size: 18;
@base-h4-line-height: 24;
@base-h4-font-weight: 700;
@base-h4-color: #000;
@base-h5-font-size: 16;
@base-h5-line-height: 22;
@base-h5-font-weight: 700;
@base-h5-color: #000;
@base-h6-font-size: 14;
@base-h6-line-height: 20;
@base-h6-font-weight: 700;
@base-h6-color: #000;
// Blockquotes
@base-blockquote-font-family: sans-serif;
@base-blockquote-font-size: 22;
@base-blockquote-line-height: 28;
// Code
@base-code-font-family: monospace, monospace;
@base-code-font-size: 13;
@base-code-line-height: 18;
@base-code-color: #000;
@base-code-background-color: transparent;
@base-code-border-color: #d7d7d7;
// Forms
@base-input-height: 36px;
@base-input-placeholder-color: #999;
@base-input-color: #000;
@base-input-background-color: #fff;
@base-input-background-focus-color: #fff;
@base-input-border-color: #ccc;
@base-input-border-focus-color: #f7c723;
@base-select-box-height: 36px;
// Grid Alignment
@grid-alignment: left;
// Grid Containers
@container: 100%;
@container-m: 720px;
@container-l: 960px;
@container-xl: 1120px;
// Grid Gutters
@grid-gutter: 15px;
@grid-gutter-m: 15px;
@grid-gutter-l: 15px;
@grid-gutter-xl: 15px;
// Responsive Breakpoints
@breakpoint-m: (@container-m + 20);
@breakpoint-l: (@container-l + 20);
@breakpoint-xl: (@container-xl + 20);