bourbon 2.1.0 → 2.1.1
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.
- data/app/assets/stylesheets/_bourbon.scss +1 -0
- data/app/assets/stylesheets/css3/_background.scss +107 -0
- data/app/assets/stylesheets/css3/_border-radius.scss +10 -8
- data/app/assets/stylesheets/css3/_box-shadow.scss +1 -1
- data/app/assets/stylesheets/css3/_transition.scss +1 -1
- data/lib/bourbon/version.rb +1 -1
- data/readme.md +1 -1
- metadata +9 -62
- data/_config.yml +0 -42
- data/_includes/animation.html +0 -20
- data/_includes/appearance.html +0 -8
- data/_includes/background-image.html +0 -36
- data/_includes/background-size.html +0 -12
- data/_includes/border-image.html +0 -11
- data/_includes/border-radius.html +0 -26
- data/_includes/box-shadow.html +0 -20
- data/_includes/box-sizing.html +0 -8
- data/_includes/buttons.html +0 -52
- data/_includes/clearfix.html +0 -11
- data/_includes/columns.html +0 -9
- data/_includes/compact.html +0 -9
- data/_includes/complete-list.html +0 -115
- data/_includes/flex-box.html +0 -23
- data/_includes/flex-grid.html +0 -28
- data/_includes/font-family.html +0 -21
- data/_includes/footer.html +0 -37
- data/_includes/golden-ratio.html +0 -16
- data/_includes/grid-width.html +0 -15
- data/_includes/hide-text.html +0 -12
- data/_includes/html5-input-types.html +0 -22
- data/_includes/inline-block.html +0 -8
- data/_includes/intro.html +0 -5
- data/_includes/linear-gradient-function.html +0 -21
- data/_includes/linear-gradient.html +0 -24
- data/_includes/modular-scale.html +0 -20
- data/_includes/navigation.html +0 -43
- data/_includes/position.html +0 -18
- data/_includes/radial-gradient-function.html +0 -24
- data/_includes/radial-gradient.html +0 -26
- data/_includes/timing-functions.html +0 -47
- data/_includes/tint-shade.html +0 -13
- data/_includes/transform-origin.html +0 -8
- data/_includes/transform.html +0 -10
- data/_includes/transitions.html +0 -9
- data/_includes/user-select.html +0 -8
- data/_site/images/border.png +0 -0
- data/_site/images/bourbon-logo.png +0 -0
- data/_site/index.html +0 -890
- data/_site/stylesheets/style.css +0 -1226
- data/doc/README.md +0 -36
- data/images/border.png +0 -0
- data/images/bourbon-logo.png +0 -0
- data/index.html +0 -80
- data/stylesheets/sass/_animation-keyframes.scss +0 -31
- data/stylesheets/sass/_base.scss +0 -304
- data/stylesheets/sass/_demos.scss +0 -198
- data/stylesheets/sass/_mixins.scss +0 -21
- data/stylesheets/sass/_normalize.scss +0 -264
- data/stylesheets/sass/_pygments-theme-dark.scss +0 -38
- data/stylesheets/sass/_pygments-theme-light.scss +0 -37
- data/stylesheets/sass/style.scss +0 -10
- data/stylesheets/style.css +0 -1226
data/doc/README.md
DELETED
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
------------------------------------------------------------------------------------------
|
|
2
|
-
Bourbon README for getting the gh-pages server up and running
|
|
3
|
-
------------------------------------------------------------------------------------------
|
|
4
|
-
|
|
5
|
-
Run the server locally:
|
|
6
|
-
jekyll --server
|
|
7
|
-
|
|
8
|
-
Watch the sass folder from root directory:
|
|
9
|
-
sass --watch stylesheets/sass:stylesheets -r ./stylesheets/sass/bourbon/lib/bourbon.rb
|
|
10
|
-
|
|
11
|
-
------------------------------------------------------------------------------------------
|
|
12
|
-
|
|
13
|
-
To pull in the latest changes on gh-pages branch:
|
|
14
|
-
git pull --rebase origin gh-pages
|
|
15
|
-
|
|
16
|
-
To pull in the latest Bourbon changes, you must fetch and merge master into gh-pages:
|
|
17
|
-
git fetch origin master && git merge master
|
|
18
|
-
|
|
19
|
-
To update the bourbon files with the latest version; from the root directory:
|
|
20
|
-
bourbon update
|
|
21
|
-
|
|
22
|
-
------------------------------------------------------------------------------------------
|
|
23
|
-
|
|
24
|
-
For Code Highlighting within Jekyll:
|
|
25
|
-
gem install pygmentize
|
|
26
|
-
|
|
27
|
-
{% highlight scss %}
|
|
28
|
-
<code here>
|
|
29
|
-
{% endhighlight %}
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
Jekyll Wiki:
|
|
33
|
-
https://github.com/mojombo/jekyll/wiki
|
|
34
|
-
|
|
35
|
-
Pygmentize:
|
|
36
|
-
http://pygments.org/
|
data/images/border.png
DELETED
|
Binary file
|
data/images/bourbon-logo.png
DELETED
|
Binary file
|
data/index.html
DELETED
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: Bourbon Sass Mixins Library
|
|
3
|
-
---
|
|
4
|
-
|
|
5
|
-
<!DOCTYPE html>
|
|
6
|
-
<html lang="en">
|
|
7
|
-
<head>
|
|
8
|
-
<meta charset="utf-8">
|
|
9
|
-
<title>{{ page.title }}</title>
|
|
10
|
-
<link rel="stylesheet" href="stylesheets/style.css">
|
|
11
|
-
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
|
|
12
|
-
</head>
|
|
13
|
-
<body>
|
|
14
|
-
<div class="main-content">
|
|
15
|
-
{% include navigation.html %}
|
|
16
|
-
|
|
17
|
-
<div class="main-inner">
|
|
18
|
-
<section class="intro-wrapper">
|
|
19
|
-
<h1 class="logo">Bourbon – Sass Mixin Library</h1>
|
|
20
|
-
<h2 class="tagline">A simple and lightweight mixin library for Sass.</h2>
|
|
21
|
-
|
|
22
|
-
{% include intro.html %}
|
|
23
|
-
</section>
|
|
24
|
-
|
|
25
|
-
<section class="mixins">
|
|
26
|
-
<h1 id="mixins">Mixins</h1>
|
|
27
|
-
{% include animation.html %}
|
|
28
|
-
{% include appearance.html %}
|
|
29
|
-
{% include background-image.html %}
|
|
30
|
-
{% include background-size.html %}
|
|
31
|
-
{% include border-image.html %}
|
|
32
|
-
{% include border-radius.html %}
|
|
33
|
-
{% include box-shadow.html %}
|
|
34
|
-
{% include box-sizing.html %}
|
|
35
|
-
{% include columns.html %}
|
|
36
|
-
{% include flex-box.html %}
|
|
37
|
-
{% include inline-block.html %}
|
|
38
|
-
{% include linear-gradient.html %}
|
|
39
|
-
{% include radial-gradient.html %}
|
|
40
|
-
{% include transform.html %}
|
|
41
|
-
{% include transitions.html %}
|
|
42
|
-
{% include user-select.html %}
|
|
43
|
-
</section>
|
|
44
|
-
|
|
45
|
-
<section ckass="functions">
|
|
46
|
-
<h1 id="functions">Functions</h1>
|
|
47
|
-
{% include compact.html %}
|
|
48
|
-
{% include flex-grid.html %}
|
|
49
|
-
{% include golden-ratio.html %}
|
|
50
|
-
{% include grid-width.html %}
|
|
51
|
-
{% include linear-gradient-function.html %}
|
|
52
|
-
{% include modular-scale.html %}
|
|
53
|
-
{% include radial-gradient-function.html %}
|
|
54
|
-
{% include tint-shade.html %}
|
|
55
|
-
</section>
|
|
56
|
-
|
|
57
|
-
<section class="addons">
|
|
58
|
-
<h1 id="add-ons">Add-ons</h1>
|
|
59
|
-
{% include buttons.html %}
|
|
60
|
-
{% include clearfix.html %}
|
|
61
|
-
{% include font-family.html %}
|
|
62
|
-
{% include hide-text.html %}
|
|
63
|
-
{% include html5-input-types.html %}
|
|
64
|
-
{% include timing-functions.html %}
|
|
65
|
-
</section>
|
|
66
|
-
|
|
67
|
-
<section class="complete-list">
|
|
68
|
-
<h1 id="complete-list">Complete List</h1>
|
|
69
|
-
{% include complete-list.html %}
|
|
70
|
-
</section>
|
|
71
|
-
|
|
72
|
-
<section class="footer">
|
|
73
|
-
<h1 id="footer"></h1>
|
|
74
|
-
{% include footer.html %}
|
|
75
|
-
</section>
|
|
76
|
-
|
|
77
|
-
</div>
|
|
78
|
-
</div>
|
|
79
|
-
</body>
|
|
80
|
-
</html>
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
// scale animation
|
|
3
|
-
@mixin scale {
|
|
4
|
-
0% {
|
|
5
|
-
@include transform(scale(1.0));
|
|
6
|
-
}
|
|
7
|
-
50% {
|
|
8
|
-
@include transform(scale(2.0));
|
|
9
|
-
}
|
|
10
|
-
100% {
|
|
11
|
-
@include transform(scale(1.0));
|
|
12
|
-
}
|
|
13
|
-
}
|
|
14
|
-
@-webkit-keyframes scale { @include scale; }
|
|
15
|
-
@-moz-keyframes scale { @include scale; }
|
|
16
|
-
@keyframes scale { @include scale; }
|
|
17
|
-
|
|
18
|
-
@mixin slide {
|
|
19
|
-
0% {
|
|
20
|
-
left: 0;
|
|
21
|
-
}
|
|
22
|
-
50% {
|
|
23
|
-
left: 100px;
|
|
24
|
-
}
|
|
25
|
-
100% {
|
|
26
|
-
left: 0;
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
@-webkit-keyframes slide { @include slide; }
|
|
30
|
-
@-moz-keyframes slide { @include slide; }
|
|
31
|
-
@keyframes slide { @include slide; }
|
data/stylesheets/sass/_base.scss
DELETED
|
@@ -1,304 +0,0 @@
|
|
|
1
|
-
html, body {
|
|
2
|
-
background-color: $background-color;
|
|
3
|
-
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
4
|
-
font-size: 13px;
|
|
5
|
-
height: 100%;
|
|
6
|
-
width: 100%;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
html {
|
|
10
|
-
padding: 0;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
h1 {
|
|
14
|
-
font-weight: 300;
|
|
15
|
-
margin-top: 0;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
h1, h2 {
|
|
19
|
-
font-size: golden-ratio(14px, 1) + 4px;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
h2 {
|
|
23
|
-
font-weight: 300;
|
|
24
|
-
margin-bottom: 0.5em;
|
|
25
|
-
margin-top: 0;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
p, div.highlight {
|
|
29
|
-
& + h2 {
|
|
30
|
-
margin-top: 2em;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
h3 {
|
|
35
|
-
font-size: 18px;
|
|
36
|
-
font-weight: 400;
|
|
37
|
-
margin-bottom: 0.5em;
|
|
38
|
-
margin-top: 2em;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
h4, h5, h6 {
|
|
42
|
-
font-size: golden-ratio(13px, 0);
|
|
43
|
-
margin-top: 0;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
p {
|
|
47
|
-
// margin-top: 0;
|
|
48
|
-
line-height: 1.5em;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
a, a:link, a:active, a:visited {
|
|
52
|
-
color: hsl(212, 89%, 55%);
|
|
53
|
-
text-decoration: none;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
a:hover {
|
|
57
|
-
color: hsl(212, 94%, 36%);
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
//************************************************************************//
|
|
61
|
-
// Navigation
|
|
62
|
-
//************************************************************************//
|
|
63
|
-
nav.fixed-nav {
|
|
64
|
-
@extend .clearfix;
|
|
65
|
-
clear: left;
|
|
66
|
-
float: left;
|
|
67
|
-
min-height: 300px;
|
|
68
|
-
width: grid-width(2);
|
|
69
|
-
|
|
70
|
-
ul {
|
|
71
|
-
// border: 1px solid darken($base-border-color, 10%);
|
|
72
|
-
border-bottom: 0;
|
|
73
|
-
border-left: 0;
|
|
74
|
-
border-top: 0;
|
|
75
|
-
height: 100%;
|
|
76
|
-
margin: 0;
|
|
77
|
-
overflow-y: scroll;
|
|
78
|
-
padding: 0;
|
|
79
|
-
position: fixed;
|
|
80
|
-
width: inherit;
|
|
81
|
-
|
|
82
|
-
input[type="search"] {
|
|
83
|
-
margin-left: 20px;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
li {
|
|
87
|
-
line-height: 180%;
|
|
88
|
-
list-style-type: none;
|
|
89
|
-
text-transform: capitalize;
|
|
90
|
-
|
|
91
|
-
&:first-child {
|
|
92
|
-
margin-top: 15px;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
&.title:not(:first-child) {
|
|
96
|
-
margin-bottom: 5px;
|
|
97
|
-
margin-top: 15px;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
&.title.complete-list h3 {
|
|
101
|
-
border-bottom: 0;
|
|
102
|
-
@include box-shadow(none);
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
a {
|
|
106
|
-
display: block;
|
|
107
|
-
padding: 0 20px;
|
|
108
|
-
@include transition;
|
|
109
|
-
|
|
110
|
-
h3 {
|
|
111
|
-
border-bottom: 1px solid darken($base-border-color, 10%);
|
|
112
|
-
@include box-shadow(0 1px 0 white);
|
|
113
|
-
color: hsl(0, 0%, 30%);
|
|
114
|
-
font-size: 12px;
|
|
115
|
-
font-weight: bold;
|
|
116
|
-
margin: 0;
|
|
117
|
-
text-shadow: 0 1px 0 white;
|
|
118
|
-
text-transform: uppercase;
|
|
119
|
-
|
|
120
|
-
&:hover {
|
|
121
|
-
color: hsl(0, 0%, 40%);
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
//************************************************************************//
|
|
131
|
-
// Global styles
|
|
132
|
-
//************************************************************************//
|
|
133
|
-
div.main-content {
|
|
134
|
-
@extend .clearfix;
|
|
135
|
-
margin: 0 auto;
|
|
136
|
-
padding: 0px $gw-gutter;
|
|
137
|
-
width: grid-width(9);
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
div.main-inner {
|
|
141
|
-
background: white;
|
|
142
|
-
border: 1px solid darken($base-border-color, 10%);
|
|
143
|
-
border-bottom: 0;
|
|
144
|
-
border-top: 0;
|
|
145
|
-
@include box-sizing(border-box);
|
|
146
|
-
clear: right;
|
|
147
|
-
float: left;
|
|
148
|
-
padding: 35px 0px;
|
|
149
|
-
width: grid-width(7) + $gw-gutter;
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
h2.tagline {
|
|
153
|
-
padding: 0 28px;
|
|
154
|
-
margin: 20px 0 0;
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
// Top Level Section
|
|
158
|
-
//************************************************************************//
|
|
159
|
-
> section {
|
|
160
|
-
h1 {
|
|
161
|
-
background-color: hsl(43, 23%, 94%);
|
|
162
|
-
border: 1px solid hsl(0, 0%, 88%);
|
|
163
|
-
border-left: 0;
|
|
164
|
-
border-right: 0;
|
|
165
|
-
@include box-shadow(1px 0 0 $background-color, -1px 0 0 $background-color);
|
|
166
|
-
font-size: 27px;
|
|
167
|
-
font-weight: 500;
|
|
168
|
-
line-height: 100%;
|
|
169
|
-
margin: 30px 0 0;
|
|
170
|
-
margin-top: 40px;
|
|
171
|
-
padding: 15px 28px;
|
|
172
|
-
text-shadow: 0 1px 0 white;
|
|
173
|
-
|
|
174
|
-
&.logo {
|
|
175
|
-
background-color: transparent;
|
|
176
|
-
background-image: url(../images/bourbon-logo.png);
|
|
177
|
-
background-repeat: no-repeat;
|
|
178
|
-
border: 0;
|
|
179
|
-
@include box-shadow(none);
|
|
180
|
-
height: 58px;
|
|
181
|
-
margin-left: 24px;
|
|
182
|
-
margin-top: 0;
|
|
183
|
-
padding: 0;
|
|
184
|
-
text-indent: -9999px;
|
|
185
|
-
}
|
|
186
|
-
}
|
|
187
|
-
}
|
|
188
|
-
|
|
189
|
-
> section > section {
|
|
190
|
-
border-bottom: 1px solid $base-border-color;
|
|
191
|
-
padding: 30px 28px;
|
|
192
|
-
@include transition;
|
|
193
|
-
|
|
194
|
-
// View Source Link
|
|
195
|
-
//************************************************************************//
|
|
196
|
-
a.view-source {
|
|
197
|
-
color: hsl(43, 13%, 75%);
|
|
198
|
-
float: right;
|
|
199
|
-
font-size: $base-font-size;
|
|
200
|
-
margin-top: 5px;
|
|
201
|
-
padding: 2px 20px;
|
|
202
|
-
text-shadow: 0 1px 0 white;
|
|
203
|
-
text-transform: capitalize;
|
|
204
|
-
@include transition;
|
|
205
|
-
opacity: 0;
|
|
206
|
-
|
|
207
|
-
&:hover {
|
|
208
|
-
background-color: $background-color;
|
|
209
|
-
@include border-radius(20px);
|
|
210
|
-
color: hsl(43, 13%, 60%);
|
|
211
|
-
}
|
|
212
|
-
}
|
|
213
|
-
|
|
214
|
-
// Show link on hover
|
|
215
|
-
&:hover {
|
|
216
|
-
a.view-source {
|
|
217
|
-
opacity: 1;
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
// Intro Text
|
|
222
|
-
//************************************************************************//
|
|
223
|
-
&#intro {
|
|
224
|
-
border-bottom: none;
|
|
225
|
-
padding-bottom: 0px;
|
|
226
|
-
padding-top: 0;
|
|
227
|
-
|
|
228
|
-
& + h1 {
|
|
229
|
-
margin-top: 40px;
|
|
230
|
-
}
|
|
231
|
-
|
|
232
|
-
p a + a {
|
|
233
|
-
margin-left: 20px;
|
|
234
|
-
}
|
|
235
|
-
|
|
236
|
-
p:last-child {
|
|
237
|
-
margin: 20px 0 50px;
|
|
238
|
-
}
|
|
239
|
-
}
|
|
240
|
-
|
|
241
|
-
&:last-child {
|
|
242
|
-
border: 0;
|
|
243
|
-
}
|
|
244
|
-
}
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
// Target Styles
|
|
248
|
-
//************************************************************************//
|
|
249
|
-
> section > section {
|
|
250
|
-
&:target {
|
|
251
|
-
@include box-shadow(inset 4px 0 0px 0 hsl(14, 97%, 55%));
|
|
252
|
-
@include transition(all 0.3s);
|
|
253
|
-
|
|
254
|
-
h2 {
|
|
255
|
-
font-weight: 500;
|
|
256
|
-
}
|
|
257
|
-
}
|
|
258
|
-
}
|
|
259
|
-
}
|
|
260
|
-
|
|
261
|
-
// Wrapper for any occasion
|
|
262
|
-
div.wrapper {
|
|
263
|
-
margin-bottom: 20px;
|
|
264
|
-
}
|
|
265
|
-
|
|
266
|
-
// Code highlighting styling
|
|
267
|
-
div.highlight {
|
|
268
|
-
background-color: transparent;
|
|
269
|
-
width: 100%;
|
|
270
|
-
}
|
|
271
|
-
|
|
272
|
-
pre {
|
|
273
|
-
background-color: $highlight-color;
|
|
274
|
-
@include border-radius(3px);
|
|
275
|
-
@include box-shadow(0 0 0 1px darken($highlight-color, 8%));
|
|
276
|
-
margin: 1em 0;
|
|
277
|
-
overflow: auto;
|
|
278
|
-
padding: 7px;
|
|
279
|
-
@include transition;
|
|
280
|
-
white-space: pre;
|
|
281
|
-
word-wrap: normal;
|
|
282
|
-
|
|
283
|
-
// render a nice scrollbar in overflowed pre area's
|
|
284
|
-
&::-webkit-scrollbar {
|
|
285
|
-
height: 7px;
|
|
286
|
-
-webkit-appearance: none;
|
|
287
|
-
width: 7px;
|
|
288
|
-
}
|
|
289
|
-
|
|
290
|
-
&::-webkit-scrollbar-thumb {
|
|
291
|
-
background-color: desaturate(darken($highlight-color, 10%), 5%);
|
|
292
|
-
border-radius: 4px;
|
|
293
|
-
-webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
|
|
294
|
-
}
|
|
295
|
-
&::-webkit-scrollbar-corner {
|
|
296
|
-
}
|
|
297
|
-
}
|
|
298
|
-
|
|
299
|
-
p code, ul code, ol code {
|
|
300
|
-
background-color: $background-color;
|
|
301
|
-
border: 1px solid $base-border-color;
|
|
302
|
-
color: hsl(0, 0%, 27%);
|
|
303
|
-
padding: 0 .2em;
|
|
304
|
-
}
|