kentucky 0.4.3 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/kentucky/{setup/_debug.scss → _debug.scss} +3 -3
- data/app/assets/stylesheets/kentucky/_kentucky.scss +19 -65
- data/app/assets/stylesheets/kentucky/{_defaults.scss → _project-settings.scss} +26 -52
- data/app/assets/stylesheets/kentucky/{setup → base}/_normalize.scss +95 -123
- data/app/assets/stylesheets/kentucky/{main/_main.scss → base/_typography.scss} +40 -37
- data/app/assets/stylesheets/kentucky/extends/_alignment.scss +13 -0
- data/app/assets/stylesheets/kentucky/extends/_breadcrumbs.scss +24 -0
- data/app/assets/stylesheets/kentucky/extends/_capslock.scss +7 -0
- data/app/assets/stylesheets/kentucky/extends/_go.scss +11 -0
- data/app/assets/stylesheets/kentucky/{_shame.scss → extends/_mute.scss} +6 -1
- data/app/assets/stylesheets/kentucky/extends/_show-hide.scss +11 -0
- data/app/assets/stylesheets/kentucky/mixins/_borders.scss +10 -0
- data/app/assets/stylesheets/kentucky/mixins/_font-size.scss +12 -0
- data/app/assets/stylesheets/kentucky/mixins/_headings.scss +23 -0
- data/app/assets/stylesheets/kentucky/mixins/_sprite.scss +9 -0
- data/app/assets/stylesheets/kentucky/mixins/_truncate.scss +14 -0
- data/lib/kentucky/version.rb +1 -1
- metadata +18 -13
- data/app/assets/stylesheets/kentucky/helpers/_extends.scss +0 -102
- data/app/assets/stylesheets/kentucky/helpers/_mixins.scss +0 -77
- data/app/assets/stylesheets/kentucky/main/_brand.scss +0 -16
- data/app/assets/stylesheets/kentucky/objects/_media.scss +0 -30
- data/app/assets/stylesheets/kentucky/objects/_split.scss +0 -18
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 32565bc4ad2ed1c912768f6b2d43eead4e28426a
|
4
|
+
data.tar.gz: 9933658c3f148f07c1ba7e1f8cc989709cd4400c
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: a7b0e1c0ff9a069c57b21855a0dad6e3f93dfcc71d940aa700db4ea5ce33a5b773844a1b328f84d9f1922321a35ae6a3437ed73939b6e01f66e485bcd8221bb1
|
7
|
+
data.tar.gz: 9aa02b0f8aa0794a02f247e4e4c83fcc520dd153e73e3c7cad53681a4f9fd03919e9886b0afac5e82bedd6b2a2b7ff1d46ba9e3e6dc664785c7bdbd2dfa2994d
|
@@ -1,6 +1,6 @@
|
|
1
1
|
// ------------------------------------------------------------------- //
|
2
|
-
//
|
3
|
-
//
|
2
|
+
// Debug - Only active if variable set to TRUE in _project-settings.scss
|
3
|
+
// Use to determine CSS issues within the site
|
4
4
|
// ------------------------------------------------------------------- //
|
5
5
|
|
6
6
|
// Red == Definite Error
|
@@ -90,4 +90,4 @@
|
|
90
90
|
outline: 5px solid red;
|
91
91
|
}
|
92
92
|
|
93
|
-
} // END if
|
93
|
+
} // END if
|
@@ -1,81 +1,35 @@
|
|
1
1
|
// ------------------------------------------------------------------- //
|
2
|
-
//
|
3
|
-
//
|
4
|
-
// The goal of Kentucky is to do a majority of the heavy lifting
|
5
|
-
// for you at the very start of a project. The styles and organization
|
6
|
-
// required at the beginning of every project is done for you, just
|
7
|
-
// fill in the variables!
|
8
|
-
//
|
9
|
-
// The table of contents below explains, briefly, what each import
|
10
|
-
// does.
|
11
|
-
//
|
12
|
-
// Kentucky aims to be heavily documented to help you learn why or how
|
13
|
-
// it's pieces work. More complex portions come with implemenation
|
14
|
-
// examples.
|
15
|
-
//
|
16
|
-
// Copyright 2013 LookThink
|
17
|
-
// Developed in part by:
|
18
|
-
// Greg Bruening, Aaron Clemmer, and Chris Brinson
|
19
|
-
//
|
20
|
-
// WARNING: Variables set now are being used throughout the entirety
|
21
|
-
// of Kentucky. Any custom, project-related styles SHOULD NOT be added
|
22
|
-
// or modified in Kentucky diretcly, but added via a separate theme
|
23
|
-
// folder/files.
|
24
|
-
//
|
2
|
+
// Kentucky Imports
|
25
3
|
// ------------------------------------------------------------------- //
|
26
|
-
// Contents
|
27
|
-
// ------------------------------------------------------------------- //
|
28
|
-
|
29
|
-
// Imports Begin importing the sections below
|
30
|
-
|
31
|
-
// Defaults All variable values set here
|
32
|
-
// Normalize Nicolas Gallagher's normalize.css, sassy style
|
33
|
-
// Clearfix Set some defaults
|
34
|
-
// Mixins Super-simple SCSS stuff
|
35
|
-
|
36
|
-
// Main High-level elements like `html`, `body`, etc.
|
37
|
-
// Headings Double-stranded heading hierarchy
|
38
|
-
// Smallprint Smaller text elements like `small`
|
39
|
-
// Lists Basic list styles and extends
|
40
|
-
|
41
|
-
// Abstraction details here
|
42
|
-
|
43
|
-
// Brand Helper class to apply brand treatment to elements
|
44
|
-
// Helpers A series of helper classes to use arbitrarily
|
45
|
-
// Debug Enable to add visual flags for debugging purposes
|
46
4
|
|
5
|
+
@import "project-settings";
|
47
6
|
|
48
7
|
// ------------------------------------------------------------------- //
|
49
|
-
//
|
8
|
+
// Mixins & Extends
|
50
9
|
// ------------------------------------------------------------------- //
|
51
10
|
|
52
|
-
@import "
|
53
|
-
@import "
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
// ------------------------------------------------------------------- //
|
58
|
-
|
59
|
-
@import "helpers/extends";
|
60
|
-
@import "helpers/mixins";
|
61
|
-
@import "objects/media";
|
62
|
-
@import "objects/split";
|
63
|
-
|
64
|
-
// ------------------------------------------------------------------- //
|
65
|
-
// Main (Type, Brand, etc.)
|
66
|
-
// ------------------------------------------------------------------- //
|
11
|
+
@import "mixins/font-size";
|
12
|
+
@import "mixins/headings";
|
13
|
+
@import "mixins/sprite";
|
14
|
+
@import "mixins/borders";
|
15
|
+
@import "mixins/truncate";
|
67
16
|
|
68
|
-
@import "
|
69
|
-
@import "
|
17
|
+
@import "extends/alignment";
|
18
|
+
@import "extends/breadcrumbs";
|
19
|
+
@import "extends/capslock";
|
20
|
+
@import "extends/go";
|
21
|
+
@import "extends/mute";
|
22
|
+
@import "extends/show-hide";
|
70
23
|
|
71
24
|
// ------------------------------------------------------------------- //
|
72
|
-
//
|
25
|
+
// Base
|
73
26
|
// ------------------------------------------------------------------- //
|
74
27
|
|
75
|
-
@import "
|
28
|
+
@import "base/normalize";
|
29
|
+
@import "base/typography";
|
76
30
|
|
77
31
|
// ------------------------------------------------------------------- //
|
78
|
-
//
|
32
|
+
// Debug
|
79
33
|
// ------------------------------------------------------------------- //
|
80
34
|
|
81
|
-
@import "
|
35
|
+
@import "debug";
|
@@ -1,32 +1,35 @@
|
|
1
1
|
// ------------------------------------------------------------------- //
|
2
|
-
//
|
2
|
+
// Project Settings
|
3
3
|
// ------------------------------------------------------------------- //
|
4
|
-
//
|
4
|
+
// ------------------------------------------------------------------- //
|
5
|
+
// Toggleable Helpers / Modules
|
5
6
|
// ------------------------------------------------------------------- //
|
6
7
|
|
7
|
-
$debug-mode:
|
8
|
-
$use-media: false !default;
|
9
|
-
$use-sprite: false !default;
|
10
|
-
$use-breadcrumb: false !default;
|
11
|
-
$use-split: false !default;
|
12
|
-
|
13
|
-
// If use-sprite is set to true, input relevant values
|
14
|
-
$sprite-sheet-loc: "sprite sheet url.png";
|
15
|
-
$sprite-sheet-grid: 36px;
|
8
|
+
$debug-mode: false !default;
|
16
9
|
|
10
|
+
// If using a sprite, set relevant variables:
|
11
|
+
$sprite-sheet-location: "url/to/spritesheet.png";
|
12
|
+
$sprite-sheet-gridsize: 36px;
|
17
13
|
|
18
14
|
// ------------------------------------------------------------------- //
|
19
|
-
//
|
15
|
+
// Typography
|
20
16
|
// ------------------------------------------------------------------- //
|
21
17
|
|
18
|
+
// Brand
|
19
|
+
|
20
|
+
$brand-font-family: $helvetica !default;
|
21
|
+
$brand-color: #333 !default;
|
22
|
+
$brand-round: 5px !default; // Used for border-radius
|
23
|
+
|
24
|
+
// Base
|
25
|
+
|
22
26
|
$base-font-family: $helvetica !default;
|
23
27
|
$base-font-size: 14px !default;
|
24
28
|
$base-line-height: 1 !default;
|
25
29
|
$base-font-color: #333 !default;
|
30
|
+
$link-color: #bebebe !default;
|
26
31
|
|
27
|
-
|
28
|
-
$mega-size: 72px !default;
|
29
|
-
$kilo-size: 48px !default;
|
32
|
+
// Heading Sizes
|
30
33
|
|
31
34
|
$h1-size: 42px !default; // %alpha
|
32
35
|
$h2-size: 36px !default; // %bravo
|
@@ -35,49 +38,20 @@ $h4-size: 20px !default; // %delta
|
|
35
38
|
$h5-size: 18px !default; // %echo
|
36
39
|
$h6-size: 16px !default; // %foxtrot
|
37
40
|
|
41
|
+
$giga-size: 96px !default;
|
42
|
+
$mega-size: 72px !default;
|
43
|
+
$kilo-size: 48px !default;
|
44
|
+
|
38
45
|
$milli-size: 12px !default;
|
39
46
|
$micro-size: 10px !default;
|
40
47
|
|
41
|
-
|
42
|
-
// ------------------------------------------------------------------- //
|
43
|
-
// Brand Variables
|
44
|
-
// ------------------------------------------------------------------- //
|
45
|
-
|
46
|
-
$brand-font-family: $helvetica !default;
|
47
|
-
$brand-color: #333 !default;
|
48
|
-
$brand-round: 3px !default; // Used for rounded corners
|
49
|
-
|
50
|
-
$link-color: #bebebe !default;
|
51
|
-
|
52
|
-
|
53
|
-
// ------------------------------------------------------------------- //
|
54
|
-
// Base Spacing Units
|
55
|
-
// ------------------------------------------------------------------- //
|
56
|
-
|
57
|
-
$base-spacing-unit: $base-line-height !default;
|
58
|
-
$half-spacing-unit: $base-spacing-unit / 2 !default;
|
59
|
-
|
60
|
-
|
61
48
|
// ------------------------------------------------------------------- //
|
62
|
-
//
|
49
|
+
// Media Query Widths
|
50
|
+
//
|
51
|
+
// [max-width] [in pixels] [columns]
|
63
52
|
// ------------------------------------------------------------------- //
|
64
53
|
|
65
54
|
$mobile: new-breakpoint(max-width 480px 4);
|
66
55
|
$tablet: new-breakpoint(max-width 990px 8);
|
67
56
|
$laptop: new-breakpoint(max-width 1440px 12);
|
68
|
-
|
69
|
-
// ------------------------------------------------------------------- //
|
70
|
-
// Single Direction Margins
|
71
|
-
//
|
72
|
-
// Any block level elements should be added to this list as well.
|
73
|
-
// Keeping the margins in one direction will avoid margin collapse
|
74
|
-
// issues and keep spacing consistant.
|
75
|
-
// ------------------------------------------------------------------- //
|
76
|
-
|
77
|
-
h1, h2, h3, h4, h5, h6,
|
78
|
-
ul, ol, dd,
|
79
|
-
section, article, p,
|
80
|
-
pre, table, fieldset, hr{
|
81
|
-
margin-bottom: ($base-font-size / $base-line-height); // IE8 Fallback
|
82
|
-
margin-bottom: 1rem;
|
83
|
-
}
|
57
|
+
$desktop: new-breakpoint(max-width 1920px 12);
|
@@ -1,16 +1,9 @@
|
|
1
1
|
// ------------------------------------------------------------------- //
|
2
|
-
//
|
3
|
-
// http://necolas.github.io/normalize.css/
|
4
|
-
//
|
5
|
-
// Edited for use with Kentucky
|
2
|
+
// LookThink Normalization Sassified
|
6
3
|
// ------------------------------------------------------------------- //
|
7
|
-
// Base Reset
|
8
|
-
// Allows for better control over spacing from the start
|
9
4
|
// ------------------------------------------------------------------- //
|
10
|
-
|
11
|
-
|
12
|
-
@include box-sizing(border-box);
|
13
|
-
}
|
5
|
+
// Meyer's Style Reset
|
6
|
+
// ------------------------------------------------------------------- //
|
14
7
|
|
15
8
|
html, body, div, span, iframe,
|
16
9
|
h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr,
|
@@ -22,10 +15,14 @@ table, caption, tbody, tfoot, thead, tr, th, td,
|
|
22
15
|
article, aside, canvas, details, figcaption, figure,
|
23
16
|
footer, header, menu, nav, section, summary,
|
24
17
|
time, mark, audio, video{
|
25
|
-
|
26
|
-
|
18
|
+
margin: 0;
|
19
|
+
padding: 0;
|
27
20
|
}
|
28
21
|
|
22
|
+
// ------------------------------------------------------------------- //
|
23
|
+
// Display Definitions
|
24
|
+
// ------------------------------------------------------------------- //
|
25
|
+
|
29
26
|
article,
|
30
27
|
aside,
|
31
28
|
details,
|
@@ -38,218 +35,193 @@ main,
|
|
38
35
|
nav,
|
39
36
|
section,
|
40
37
|
summary {
|
41
|
-
|
38
|
+
display: block;
|
42
39
|
}
|
43
40
|
|
44
41
|
audio,
|
45
42
|
canvas,
|
46
43
|
video {
|
47
|
-
|
44
|
+
display: inline-block;
|
48
45
|
}
|
49
46
|
|
50
47
|
audio:not([controls]) {
|
51
|
-
|
52
|
-
|
48
|
+
display: none;
|
49
|
+
height: 0;
|
53
50
|
}
|
54
51
|
|
55
|
-
[hidden]
|
56
|
-
|
52
|
+
[hidden],
|
53
|
+
template {
|
54
|
+
display: none;
|
57
55
|
}
|
58
56
|
|
59
57
|
// ------------------------------------------------------------------- //
|
60
|
-
//
|
58
|
+
// Base Level
|
61
59
|
// ------------------------------------------------------------------- //
|
62
60
|
|
63
61
|
html {
|
64
|
-
|
65
|
-
|
66
|
-
|
62
|
+
font-family: sans-serif;
|
63
|
+
-ms-text-size-adjust: 100%;
|
64
|
+
-webkit-text-size-adjust: 100%;
|
67
65
|
}
|
68
66
|
|
69
|
-
body
|
70
|
-
|
67
|
+
body{
|
68
|
+
margin: 0;
|
71
69
|
}
|
72
70
|
|
73
71
|
// ------------------------------------------------------------------- //
|
74
|
-
//
|
72
|
+
// Links
|
75
73
|
// ------------------------------------------------------------------- //
|
76
74
|
|
77
|
-
a
|
78
|
-
|
79
|
-
}
|
75
|
+
a{
|
76
|
+
background: transparent;
|
80
77
|
|
81
|
-
|
82
|
-
|
78
|
+
&:focus{
|
79
|
+
outline: thin dotted;
|
80
|
+
}
|
81
|
+
&:hover,
|
82
|
+
&:active{
|
83
|
+
outline: 0;
|
84
|
+
}
|
83
85
|
}
|
84
86
|
|
85
87
|
// ------------------------------------------------------------------- //
|
86
|
-
//
|
88
|
+
// Typography
|
87
89
|
// ------------------------------------------------------------------- //
|
88
90
|
|
89
|
-
abbr[title]
|
90
|
-
|
91
|
-
}
|
92
|
-
|
93
|
-
b,
|
94
|
-
strong {
|
95
|
-
font-weight: bold;
|
91
|
+
abbr[title]{
|
92
|
+
border-bottom: 1px dotted;
|
96
93
|
}
|
97
94
|
|
98
|
-
|
99
|
-
|
95
|
+
strong{
|
96
|
+
font-weight: bold;
|
100
97
|
}
|
101
98
|
|
102
|
-
hr
|
103
|
-
|
104
|
-
|
105
|
-
background: #ccc;
|
106
|
-
border: none;
|
107
|
-
}
|
108
|
-
|
109
|
-
mark {
|
110
|
-
background: #ff0;
|
111
|
-
color: #000;
|
99
|
+
hr{
|
100
|
+
@include prefixer(box-sizing, content-box, moz spec);
|
101
|
+
height: 0;
|
112
102
|
}
|
113
103
|
|
114
104
|
code,
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
font-family: monospace,serif;
|
119
|
-
font-size: 1em;
|
105
|
+
pre{
|
106
|
+
font-family: $monospace; // "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
|
107
|
+
font-size: 1em;
|
120
108
|
}
|
121
109
|
|
122
|
-
pre
|
123
|
-
|
110
|
+
pre{
|
111
|
+
white-space: pre-wrap;
|
124
112
|
}
|
125
113
|
|
126
|
-
|
127
|
-
|
128
|
-
}
|
129
|
-
|
130
|
-
small {
|
131
|
-
font-size: 80%;
|
114
|
+
small{
|
115
|
+
font-size: 75%;
|
132
116
|
}
|
133
117
|
|
134
118
|
sub,
|
135
|
-
sup
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
119
|
+
sup{
|
120
|
+
position: relative;
|
121
|
+
font-size: 75%;
|
122
|
+
line-height: 0;
|
123
|
+
vertical-align: baseline;
|
140
124
|
}
|
141
125
|
|
142
|
-
|
143
|
-
|
126
|
+
sub{
|
127
|
+
bottom: -0.25em;
|
144
128
|
}
|
145
|
-
|
146
|
-
|
147
|
-
bottom: -.25em;
|
129
|
+
sup{
|
130
|
+
top: -0.5em;
|
148
131
|
}
|
149
132
|
|
150
133
|
// ------------------------------------------------------------------- //
|
151
|
-
//
|
134
|
+
// Embedded Content
|
152
135
|
// ------------------------------------------------------------------- //
|
153
136
|
|
154
|
-
img
|
155
|
-
|
137
|
+
img{
|
138
|
+
border: 0;
|
156
139
|
}
|
157
140
|
|
158
|
-
svg:not(:root)
|
159
|
-
|
141
|
+
svg:not(:root){
|
142
|
+
overflow: hidden;
|
160
143
|
}
|
161
144
|
|
162
145
|
// ------------------------------------------------------------------- //
|
163
|
-
//
|
146
|
+
// Forms
|
164
147
|
// ------------------------------------------------------------------- //
|
165
148
|
|
166
|
-
|
167
|
-
border: 1px solid #ccc;
|
168
|
-
}
|
169
|
-
|
170
|
-
legend {
|
171
|
-
border: 0;
|
172
|
-
}
|
173
|
-
|
149
|
+
#{$all-text-inputs}, // http://bourbon.io/docs/#html5-input-types
|
174
150
|
button,
|
175
|
-
input,
|
176
151
|
select,
|
177
|
-
textarea
|
178
|
-
|
179
|
-
|
180
|
-
|
152
|
+
textarea{
|
153
|
+
margin: 0;
|
154
|
+
font-family: $base-font-family;
|
155
|
+
font-size: 100%;
|
156
|
+
line-height: 1;
|
181
157
|
}
|
182
158
|
|
183
159
|
button,
|
184
|
-
|
185
|
-
|
186
|
-
}
|
187
|
-
|
188
|
-
button,
|
189
|
-
select {
|
190
|
-
text-transform: none;
|
160
|
+
select{
|
161
|
+
text-transform: none;
|
191
162
|
}
|
192
163
|
|
193
164
|
button,
|
194
165
|
html input[type="button"],
|
195
166
|
input[type="reset"],
|
196
|
-
input[type="submit"]
|
197
|
-
|
198
|
-
|
167
|
+
input[type="submit"]{
|
168
|
+
@include prefixer(appearance, button, webkit);
|
169
|
+
cursor: pointer;
|
199
170
|
}
|
200
171
|
|
201
172
|
button[disabled],
|
202
|
-
html input[disabled]
|
203
|
-
|
173
|
+
html input[disabled]{
|
174
|
+
cursor: default;
|
204
175
|
}
|
205
176
|
|
206
177
|
input[type="checkbox"],
|
207
|
-
input[type="radio"]
|
208
|
-
|
178
|
+
input[type="radio"]{
|
179
|
+
box-sizing: border-box;
|
180
|
+
padding: 0;
|
209
181
|
}
|
210
182
|
|
211
183
|
input[type="search"] {
|
212
|
-
|
184
|
+
-webkit-appearance: textfield;
|
185
|
+
@include prefixer(appearance, content-box, moz webkit spec);
|
213
186
|
}
|
214
187
|
|
215
188
|
input[type="search"]::-webkit-search-cancel-button,
|
216
189
|
input[type="search"]::-webkit-search-decoration {
|
217
|
-
|
190
|
+
-webkit-appearance: none;
|
218
191
|
}
|
219
192
|
|
220
193
|
button::-moz-focus-inner,
|
221
194
|
input::-moz-focus-inner {
|
222
|
-
|
195
|
+
border: 0;
|
196
|
+
padding: 0;
|
223
197
|
}
|
224
198
|
|
225
|
-
textarea
|
226
|
-
|
227
|
-
|
199
|
+
textarea{
|
200
|
+
overflow: auto;
|
201
|
+
vertical-align: top;
|
228
202
|
}
|
229
203
|
|
230
|
-
|
231
204
|
// ------------------------------------------------------------------- //
|
232
|
-
//
|
205
|
+
// Lists
|
233
206
|
// ------------------------------------------------------------------- //
|
234
207
|
|
235
208
|
ul,
|
236
209
|
ol,
|
237
|
-
dl
|
238
|
-
|
210
|
+
dl{
|
211
|
+
margin-left: 1rem;
|
239
212
|
}
|
240
213
|
|
241
214
|
li > ul,
|
242
215
|
li > ol{
|
243
|
-
|
244
|
-
|
216
|
+
margin-bottom: 0;
|
217
|
+
padding-bottom: 0;
|
245
218
|
}
|
246
219
|
|
247
|
-
|
248
220
|
// ------------------------------------------------------------------- //
|
249
|
-
//
|
221
|
+
// Tables
|
250
222
|
// ------------------------------------------------------------------- //
|
251
223
|
|
252
|
-
table
|
253
|
-
|
254
|
-
|
224
|
+
table{
|
225
|
+
border-collapse: collapse;
|
226
|
+
border-spacing: 0;
|
255
227
|
}
|
@@ -1,17 +1,23 @@
|
|
1
1
|
// ------------------------------------------------------------------- //
|
2
|
-
//
|
2
|
+
// Base Typographic Rules
|
3
3
|
// ------------------------------------------------------------------- //
|
4
|
-
|
4
|
+
|
5
|
+
html{
|
6
|
+
font: #{($base-font-size/16px)*1em} / #{$base-line-height} $base-font-family;
|
7
|
+
}
|
8
|
+
|
9
|
+
// ------------------------------------------------------------------- //
|
10
|
+
// Headings
|
5
11
|
//
|
6
|
-
//
|
7
|
-
//
|
12
|
+
// The goal here is to define headings and establish practical
|
13
|
+
// font-sizing from the get go.
|
8
14
|
//
|
9
|
-
//
|
10
|
-
//
|
11
|
-
//
|
15
|
+
// Also includes a "double-stranded hierarchy" allowing you to use HTML
|
16
|
+
// heading elements or the alternate extend included (based on the
|
17
|
+
// military alphabet).
|
12
18
|
// ------------------------------------------------------------------- //
|
13
19
|
|
14
|
-
|
20
|
+
h1, h2, h3, h4, h5, h6{
|
15
21
|
font-family: $brand-font-family;
|
16
22
|
}
|
17
23
|
|
@@ -45,11 +51,10 @@ h6,
|
|
45
51
|
@include font-size($h6-size);
|
46
52
|
}
|
47
53
|
|
48
|
-
|
49
54
|
// ------------------------------------------------------------------- //
|
50
|
-
//
|
51
|
-
//
|
52
|
-
//
|
55
|
+
// Heading Groups
|
56
|
+
//
|
57
|
+
// Target a group of headings stacked together (such as title/subtitle)
|
53
58
|
// ------------------------------------------------------------------- //
|
54
59
|
|
55
60
|
%hgroup{
|
@@ -58,26 +63,22 @@ h6,
|
|
58
63
|
}
|
59
64
|
}
|
60
65
|
|
61
|
-
|
62
66
|
// ------------------------------------------------------------------- //
|
63
|
-
//
|
67
|
+
// Extra Large / Small Extends
|
64
68
|
// ------------------------------------------------------------------- //
|
65
69
|
|
66
70
|
%giga{
|
67
71
|
@include font-size($giga-size);
|
68
72
|
}
|
73
|
+
|
69
74
|
%mega{
|
70
75
|
@include font-size($mega-size);
|
71
76
|
}
|
77
|
+
|
72
78
|
%kilo{
|
73
79
|
@include font-size($kilo-size);
|
74
80
|
}
|
75
81
|
|
76
|
-
|
77
|
-
// ------------------------------------------------------------------- //
|
78
|
-
// What is this? Type for ants?!
|
79
|
-
// ------------------------------------------------------------------- //
|
80
|
-
|
81
82
|
%milli{
|
82
83
|
@include font-size($milli-size);
|
83
84
|
}
|
@@ -86,26 +87,28 @@ h6,
|
|
86
87
|
@include font-size($micro-size);
|
87
88
|
}
|
88
89
|
|
89
|
-
|
90
90
|
// ------------------------------------------------------------------- //
|
91
|
-
//
|
91
|
+
// Links
|
92
92
|
// ------------------------------------------------------------------- //
|
93
93
|
|
94
|
-
html{
|
95
|
-
font: #{($base-font-size/16px)*1em} / #{$base-line-height} $base-font-family;
|
96
|
-
min-height: 100%;
|
97
|
-
overflow-y: scroll;
|
98
|
-
} // END html
|
99
|
-
|
100
|
-
body{
|
101
|
-
background: #fff;
|
102
|
-
} // END body
|
103
|
-
|
104
94
|
a{
|
105
95
|
color: $link-color;
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
96
|
+
text-decoration: none;
|
97
|
+
}
|
98
|
+
|
99
|
+
// ------------------------------------------------------------------- //
|
100
|
+
// Single-direction Margins
|
101
|
+
// ------------------------------------------------------------------- //
|
102
|
+
|
103
|
+
h1, h2, h3, h4, h5, h6,
|
104
|
+
ul, ol, dl,
|
105
|
+
p,
|
106
|
+
pre, table, fieldset{
|
107
|
+
margin-bottom: ($base-font-size / $base-line-height); // IE8 Fallback
|
108
|
+
margin-bottom: 1rem;
|
109
|
+
}
|
110
|
+
|
111
|
+
hr{
|
112
|
+
margin: ($base-font-size / $base-line-height) 0;
|
113
|
+
margin: 1rem 0;
|
114
|
+
}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Text Alignment
|
3
|
+
// ------------------------------------------------------------------- //
|
4
|
+
|
5
|
+
%text-left{
|
6
|
+
text-align: left;
|
7
|
+
}
|
8
|
+
%text-right{
|
9
|
+
text-align: right;
|
10
|
+
}
|
11
|
+
%text-center{
|
12
|
+
text-align: center;
|
13
|
+
}
|
@@ -0,0 +1,24 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Breadcrumbs
|
3
|
+
//
|
4
|
+
// Must be extended in the ul of the breadcrumbs
|
5
|
+
// Adds auto-magical separators
|
6
|
+
// ------------------------------------------------------------------- //
|
7
|
+
|
8
|
+
// Simple breadcrumb ">"
|
9
|
+
%breadcrumb{
|
10
|
+
& > li + li:before{
|
11
|
+
content:"\00BB" "\00A0";
|
12
|
+
}
|
13
|
+
}
|
14
|
+
|
15
|
+
// Path breadcrumb "/"
|
16
|
+
%breadcrumb--path{
|
17
|
+
& > li + li:before{
|
18
|
+
content:"\002F" "\00A0";
|
19
|
+
}
|
20
|
+
}
|
21
|
+
|
22
|
+
%breadcrumb__root{
|
23
|
+
font-weight:bold;
|
24
|
+
}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// "Go"
|
3
|
+
//
|
4
|
+
// Add right-facing arrow, indicating movement through site
|
5
|
+
// ------------------------------------------------------------------- //
|
6
|
+
|
7
|
+
%go{
|
8
|
+
&:after{
|
9
|
+
content: "\00A0" "\OOBB";
|
10
|
+
}
|
11
|
+
}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Show / Hide Elements
|
3
|
+
// To be used in jQuery as a toggle class
|
4
|
+
// ------------------------------------------------------------------- //
|
5
|
+
|
6
|
+
.is-shown{
|
7
|
+
display: block;
|
8
|
+
}
|
9
|
+
.is-hidden{
|
10
|
+
display: none;
|
11
|
+
}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Custom Borders / Widths
|
3
|
+
//
|
4
|
+
// @include border(2px 0 5px 3px, solid, #B4DA55);
|
5
|
+
// ------------------------------------------------------------------- //
|
6
|
+
|
7
|
+
@mixin border($border-widths, $border-style, $border-color){
|
8
|
+
border: $border-style $border-color;
|
9
|
+
border-width: $border-widths;
|
10
|
+
}
|
@@ -0,0 +1,12 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Font Size / Line Height
|
3
|
+
// ------------------------------------------------------------------- //
|
4
|
+
|
5
|
+
@mixin font-size($font-size, $line-height: true){
|
6
|
+
font-size: $font-size;
|
7
|
+
font-size: ($font-size / $base-font-size) * 1rem;
|
8
|
+
|
9
|
+
@if $line-height == true{
|
10
|
+
line-height: ceil($font-size / $base-line-height) * ($base-line-height / $font-size);
|
11
|
+
}
|
12
|
+
}
|
@@ -0,0 +1,23 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Style any number of headings at once
|
3
|
+
//
|
4
|
+
// .foo{
|
5
|
+
// @include headings(1,3){
|
6
|
+
// color: #B4DA55;
|
7
|
+
// }
|
8
|
+
// }
|
9
|
+
// ------------------------------------------------------------------- //
|
10
|
+
|
11
|
+
@mixin headings($from: 1, $to: 6){
|
12
|
+
%base-heading{
|
13
|
+
@content
|
14
|
+
}
|
15
|
+
|
16
|
+
@if $from >= 1 and $to <= 6{
|
17
|
+
@for $i from $from through $to{
|
18
|
+
h#{$i}{
|
19
|
+
@extend %base-heading;
|
20
|
+
}
|
21
|
+
}
|
22
|
+
}
|
23
|
+
}
|
@@ -0,0 +1,9 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Sprite Sheet
|
3
|
+
//
|
4
|
+
// @include sprite(0,0);
|
5
|
+
// ------------------------------------------------------------------- //
|
6
|
+
|
7
|
+
@mixin sprite($col, $row){
|
8
|
+
background: url($sprite-sheet-loc) no-repeat ($col * -$sprite-sheet-grid) ($row * -$sprite-sheet-grid);
|
9
|
+
}
|
@@ -0,0 +1,14 @@
|
|
1
|
+
// ------------------------------------------------------------------- //
|
2
|
+
// Text Truncation
|
3
|
+
//
|
4
|
+
// @include truncate(450px);
|
5
|
+
// Only works for single-line truncation
|
6
|
+
// ------------------------------------------------------------------- //
|
7
|
+
|
8
|
+
@mixin truncate($truncation-boundary){
|
9
|
+
display: inline-block;
|
10
|
+
max-width: $truncation-boundary;
|
11
|
+
white-space: nowrap;
|
12
|
+
overflow: hidden;
|
13
|
+
text-overflow: ellipsis;
|
14
|
+
}
|
data/lib/kentucky/version.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: kentucky
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.5.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Aaron Clemmer
|
@@ -10,7 +10,7 @@ authors:
|
|
10
10
|
autorequire:
|
11
11
|
bindir: bin
|
12
12
|
cert_chain: []
|
13
|
-
date: 2013-
|
13
|
+
date: 2013-11-08 00:00:00.000000000 Z
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: sass
|
@@ -111,17 +111,22 @@ files:
|
|
111
111
|
- Kentucky.sublime-workspace
|
112
112
|
- LICENSE
|
113
113
|
- Rakefile
|
114
|
-
- app/assets/stylesheets/kentucky/
|
114
|
+
- app/assets/stylesheets/kentucky/_debug.scss
|
115
115
|
- app/assets/stylesheets/kentucky/_kentucky.scss
|
116
|
-
- app/assets/stylesheets/kentucky/
|
117
|
-
- app/assets/stylesheets/kentucky/
|
118
|
-
- app/assets/stylesheets/kentucky/
|
119
|
-
- app/assets/stylesheets/kentucky/
|
120
|
-
- app/assets/stylesheets/kentucky/
|
121
|
-
- app/assets/stylesheets/kentucky/
|
122
|
-
- app/assets/stylesheets/kentucky/
|
123
|
-
- app/assets/stylesheets/kentucky/
|
124
|
-
- app/assets/stylesheets/kentucky/
|
116
|
+
- app/assets/stylesheets/kentucky/_project-settings.scss
|
117
|
+
- app/assets/stylesheets/kentucky/base/_normalize.scss
|
118
|
+
- app/assets/stylesheets/kentucky/base/_typography.scss
|
119
|
+
- app/assets/stylesheets/kentucky/extends/_alignment.scss
|
120
|
+
- app/assets/stylesheets/kentucky/extends/_breadcrumbs.scss
|
121
|
+
- app/assets/stylesheets/kentucky/extends/_capslock.scss
|
122
|
+
- app/assets/stylesheets/kentucky/extends/_go.scss
|
123
|
+
- app/assets/stylesheets/kentucky/extends/_mute.scss
|
124
|
+
- app/assets/stylesheets/kentucky/extends/_show-hide.scss
|
125
|
+
- app/assets/stylesheets/kentucky/mixins/_borders.scss
|
126
|
+
- app/assets/stylesheets/kentucky/mixins/_font-size.scss
|
127
|
+
- app/assets/stylesheets/kentucky/mixins/_headings.scss
|
128
|
+
- app/assets/stylesheets/kentucky/mixins/_sprite.scss
|
129
|
+
- app/assets/stylesheets/kentucky/mixins/_truncate.scss
|
125
130
|
- app/assets/stylesheets/style.scss
|
126
131
|
- bin/kentucky
|
127
132
|
- features/install.feature
|
@@ -157,7 +162,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
157
162
|
version: '0'
|
158
163
|
requirements: []
|
159
164
|
rubyforge_project:
|
160
|
-
rubygems_version: 2.1.
|
165
|
+
rubygems_version: 2.1.10
|
161
166
|
signing_key:
|
162
167
|
specification_version: 4
|
163
168
|
summary: Kentucky Bourbon, Neat Grid System and SCSS Mixins
|
@@ -1,102 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Kentucky Extends
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
// Show / Hide Elements
|
5
|
-
// To be used in jQuery as a toggle class
|
6
|
-
// ------------------------------------------------------------------- //
|
7
|
-
|
8
|
-
.is-shown{
|
9
|
-
display: block;
|
10
|
-
}
|
11
|
-
.is-hidden{
|
12
|
-
display: none;
|
13
|
-
}
|
14
|
-
|
15
|
-
|
16
|
-
// ------------------------------------------------------------------- //
|
17
|
-
// Add / Remove Floats
|
18
|
-
// ------------------------------------------------------------------- //
|
19
|
-
|
20
|
-
%float-left{
|
21
|
-
float: left;
|
22
|
-
}
|
23
|
-
%float-right{
|
24
|
-
float: right;
|
25
|
-
}
|
26
|
-
%float-none{
|
27
|
-
float: none;
|
28
|
-
}
|
29
|
-
|
30
|
-
|
31
|
-
// ------------------------------------------------------------------- //
|
32
|
-
// Text Alignment
|
33
|
-
// ------------------------------------------------------------------- //
|
34
|
-
|
35
|
-
%text-left{
|
36
|
-
text-align: left;
|
37
|
-
}
|
38
|
-
%text-right{
|
39
|
-
text-align: right;
|
40
|
-
}
|
41
|
-
%text-center{
|
42
|
-
text-align: center;
|
43
|
-
}
|
44
|
-
|
45
|
-
|
46
|
-
// ------------------------------------------------------------------- //
|
47
|
-
// Muted
|
48
|
-
// ------------------------------------------------------------------- //
|
49
|
-
|
50
|
-
%muted{
|
51
|
-
opacity: .5;
|
52
|
-
filter: alpha(opacity=50);
|
53
|
-
}
|
54
|
-
|
55
|
-
|
56
|
-
// ------------------------------------------------------------------- //
|
57
|
-
// "Go"
|
58
|
-
//
|
59
|
-
// Add right-facing arrow, indicating movement through site
|
60
|
-
// ------------------------------------------------------------------- //
|
61
|
-
|
62
|
-
%go{
|
63
|
-
&:after{
|
64
|
-
content: "\00A0" "\OOBB";
|
65
|
-
}
|
66
|
-
}
|
67
|
-
|
68
|
-
|
69
|
-
// ------------------------------------------------------------------- //
|
70
|
-
// Breadcrumbs
|
71
|
-
//
|
72
|
-
// Must be extended in the ul of the breadcrumbs
|
73
|
-
// Adds auto-magical separators
|
74
|
-
// ------------------------------------------------------------------- //
|
75
|
-
|
76
|
-
// Simple breadcrumb ">"
|
77
|
-
%breadcrumb{
|
78
|
-
& > li + li:before{
|
79
|
-
content:"\00BB" "\00A0";
|
80
|
-
}
|
81
|
-
}
|
82
|
-
|
83
|
-
// Path breadcrumb "/"
|
84
|
-
%breadcrumb--path{
|
85
|
-
& > li + li:before{
|
86
|
-
content:"\002F" "\00A0";
|
87
|
-
}
|
88
|
-
}
|
89
|
-
|
90
|
-
%breadcrumb__root{
|
91
|
-
font-weight:bold;
|
92
|
-
}
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
// ------------------------------------------------------------------- //
|
97
|
-
// Caps Lock - Calm down there, champ...
|
98
|
-
// ------------------------------------------------------------------- //
|
99
|
-
|
100
|
-
%caps{
|
101
|
-
text-transform: uppercase;
|
102
|
-
}
|
@@ -1,77 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Kentucky Mixins
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
// Font Size / Line Height
|
5
|
-
// ------------------------------------------------------------------- //
|
6
|
-
|
7
|
-
@mixin font-size($font-size, $line-height: true){
|
8
|
-
font-size: $font-size;
|
9
|
-
font-size: ($font-size / $base-font-size) * 1rem;
|
10
|
-
|
11
|
-
@if $line-height == true{
|
12
|
-
line-height: ceil($font-size / $base-line-height) * ($base-line-height / $font-size);
|
13
|
-
}
|
14
|
-
}
|
15
|
-
|
16
|
-
|
17
|
-
// ------------------------------------------------------------------- //
|
18
|
-
// Style any number of headings at once
|
19
|
-
//
|
20
|
-
// .foo{
|
21
|
-
// @include headings(1,3){
|
22
|
-
// color: #B4DA55;
|
23
|
-
// }
|
24
|
-
// }
|
25
|
-
// ------------------------------------------------------------------- //
|
26
|
-
|
27
|
-
@mixin headings($from: 1, $to: 6){
|
28
|
-
%base-heading{
|
29
|
-
@content
|
30
|
-
}
|
31
|
-
|
32
|
-
@if $from >= 1 and $to <= 6{
|
33
|
-
@for $i from $from through $to{
|
34
|
-
h#{$i}{
|
35
|
-
@extend %base-heading;
|
36
|
-
}
|
37
|
-
}
|
38
|
-
}
|
39
|
-
}
|
40
|
-
|
41
|
-
|
42
|
-
// ------------------------------------------------------------------- //
|
43
|
-
// Text Truncation
|
44
|
-
//
|
45
|
-
// @include truncate(450px);
|
46
|
-
// Only works for single-line truncation
|
47
|
-
// ------------------------------------------------------------------- //
|
48
|
-
|
49
|
-
@mixin truncate($truncation-boundary){
|
50
|
-
max-width: $truncation-boundary;
|
51
|
-
white-space: nowrap;
|
52
|
-
overflow: hidden;
|
53
|
-
text-overflow: ellipsis;
|
54
|
-
}
|
55
|
-
|
56
|
-
|
57
|
-
// ------------------------------------------------------------------- //
|
58
|
-
// Sprite Sheet
|
59
|
-
//
|
60
|
-
// @include sprite(0,0);
|
61
|
-
// ------------------------------------------------------------------- //
|
62
|
-
|
63
|
-
@mixin sprite($col, $row){
|
64
|
-
background: url($sprite-sheet-loc) no-repeat ($col * -$sprite-sheet-grid) ($row * -$sprite-sheet-grid);
|
65
|
-
}
|
66
|
-
|
67
|
-
|
68
|
-
// ------------------------------------------------------------------- //
|
69
|
-
// Custom Borders / Widths
|
70
|
-
//
|
71
|
-
// @include border(2px 0 5px 3px, solid, #B4DA55);
|
72
|
-
// ------------------------------------------------------------------- //
|
73
|
-
|
74
|
-
@mixin border($border-widths, $border-style, $border-color){
|
75
|
-
border: $border-style $border-color;
|
76
|
-
border-width: $border-widths;
|
77
|
-
}
|
@@ -1,16 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Brand extensions
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
|
5
|
-
%brand{
|
6
|
-
font-family: $brand-font-family !important;
|
7
|
-
color: $brand-color !important;
|
8
|
-
}
|
9
|
-
|
10
|
-
%brand-type{
|
11
|
-
font-family: $brand-font-family !important;
|
12
|
-
}
|
13
|
-
|
14
|
-
%brand-color{
|
15
|
-
color: $brand-color !important;
|
16
|
-
}
|
@@ -1,30 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Media Objects
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
|
5
|
-
@if $use-media == true{
|
6
|
-
|
7
|
-
.media{
|
8
|
-
display:block;
|
9
|
-
@extend %cf;
|
10
|
-
|
11
|
-
.media__img{
|
12
|
-
float: left;
|
13
|
-
margin-right: $base-spacing-unit;
|
14
|
-
}
|
15
|
-
.media__img-rev{
|
16
|
-
float: right;
|
17
|
-
margin-left: $base-spacing-unit;
|
18
|
-
}
|
19
|
-
|
20
|
-
.media__body{
|
21
|
-
overflow: hidden;
|
22
|
-
|
23
|
-
&,
|
24
|
-
& > :last-child{
|
25
|
-
margin-bottom: 0;
|
26
|
-
}
|
27
|
-
} // END media-body
|
28
|
-
} // END media
|
29
|
-
|
30
|
-
} // END if
|
@@ -1,18 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Split
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
|
5
|
-
@if $use-split == true{
|
6
|
-
|
7
|
-
%split{
|
8
|
-
margin-left: 0;
|
9
|
-
text-align: right;
|
10
|
-
|
11
|
-
.split__title{
|
12
|
-
float: left;
|
13
|
-
clear: both;
|
14
|
-
text-align: left;
|
15
|
-
}
|
16
|
-
}
|
17
|
-
|
18
|
-
} // END if
|