1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
|
//-----------------------------------------------------------------------
// Colors
//-----------------------------------------------------------------------
// text
$text: rgb(119, 119, 119);
$lighter-text: rgb(153, 153, 153);
$headline-color: rgb(0, 0, 0);
$monospace-font-color: rgb(0, 136, 0); // green
// links
$link-color: #39c;
$link-hover-color: #39f;
$footer-link-color: #999;
$menu-link: #fff;
// colors
$gray-light: rgb(245, 245, 245);
$gray-light-dark: rgb(190, 190, 190);
$gray-medium: rgb(170, 170, 170);
$gray-dark: rgb(130, 130, 130);
$black: rgb(0, 0, 0);
$white: rgb(255, 255, 255);
//else
$line-color: rgb(219, 219, 219);
//-----------------------------------------------------------------------
// Typography sizing
//-----------------------------------------------------------------------
$base-font-size: 16px; // setting to 16px so that 1em = 16px, and can be used easily in math for layout (instead of 13)
$base-line-height: 24px;
@include establish-baseline;
$body-font-size: 0.8125 * $base-font-size; // 13px, default text size for all text
$h1-font-size: 2.625 * $base-font-size; // 42px
$h2-font-size: 1.875 * $base-font-size; // 30px
$h3-font-size: 1.125 * $base-font-size; // 18px
$h4-font-size: 1.1 * $base-font-size;
$h5-font-size: 1 * $base-font-size;
$h6-font-size: 1 * $base-font-size;
$small-label-size: 0.7 * $base-font-size;
$monospace-font-size: 0.875 * $base-font-size; // 13px
// The amount lists, blockquotes and comments are indented.
$indent-amount: 0.8em;
//-----------------------------------------------------------------------
// Fonts
//-----------------------------------------------------------------------
// Let's define some font stacks
$opensans: "Open Sans", Arial, "Lucida Grande", sans-serif;
$sourcecode: 'Source Code Pro', sans-serif;
$georgia: Georgia, "Times New Roman", "DejaVu Serif", serif;
$helvetica: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
$courier: "Courier New", "DejaVu Sans Mono", monospace, sans-serif;
// Now let's create variables for fonts in use
$base-font: $opensans;
$body-font: $opensans;
$alt-font: $opensans;
$accent-font: $opensans;
$monospace-font: $courier;
$headline-font: $opensans;
//-----------------------------------------------------------------------
// Layout
//-----------------------------------------------------------------------
$break-small: 580px;
$break-large: 990px;
// Navigational
$site-max-width: 870px;
//$site-sides-padding: 0 25px;
$top-nav-height: 64px;
$main-content-top-margin: 40px;
$default-padding: 20px;
//-----------------------------------------------------------------------
// Shiny Things
//-----------------------------------------------------------------------
$default-border: 1px solid $line-color;
|