api_taster 0.8.2 → 0.8.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (65) hide show
  1. checksums.yaml +4 -4
  2. data/api_taster.gemspec +3 -3
  3. data/lib/api_taster.rb +1 -1
  4. data/lib/api_taster/engine.rb +2 -0
  5. data/lib/api_taster/version.rb +1 -1
  6. data/vendor/assets/images/glyphicons-halflings-white.png +0 -0
  7. data/vendor/assets/images/glyphicons-halflings.png +0 -0
  8. data/vendor/assets/javascripts/bootstrap-affix.js +117 -0
  9. data/vendor/assets/javascripts/bootstrap-alert.js +99 -0
  10. data/vendor/assets/javascripts/bootstrap-button.js +105 -0
  11. data/vendor/assets/javascripts/bootstrap-carousel.js +207 -0
  12. data/vendor/assets/javascripts/bootstrap-collapse.js +167 -0
  13. data/vendor/assets/javascripts/bootstrap-dropdown.js +169 -0
  14. data/vendor/assets/javascripts/bootstrap-modal.js +247 -0
  15. data/vendor/assets/javascripts/bootstrap-popover.js +114 -0
  16. data/vendor/assets/javascripts/bootstrap-scrollspy.js +162 -0
  17. data/vendor/assets/javascripts/bootstrap-tab.js +144 -0
  18. data/vendor/assets/javascripts/bootstrap-tooltip.js +361 -0
  19. data/vendor/assets/javascripts/bootstrap-transition.js +60 -0
  20. data/vendor/assets/javascripts/bootstrap-typeahead.js +335 -0
  21. data/vendor/assets/javascripts/bootstrap.js +13 -0
  22. data/vendor/assets/stylesheets/bootstrap-responsive.scss +1 -0
  23. data/vendor/assets/stylesheets/bootstrap.scss +1 -0
  24. data/vendor/assets/stylesheets/bootstrap/_accordion.scss +34 -0
  25. data/vendor/assets/stylesheets/bootstrap/_alerts.scss +79 -0
  26. data/vendor/assets/stylesheets/bootstrap/_breadcrumbs.scss +24 -0
  27. data/vendor/assets/stylesheets/bootstrap/_button-groups.scss +229 -0
  28. data/vendor/assets/stylesheets/bootstrap/_buttons.scss +228 -0
  29. data/vendor/assets/stylesheets/bootstrap/_carousel.scss +158 -0
  30. data/vendor/assets/stylesheets/bootstrap/_close.scss +32 -0
  31. data/vendor/assets/stylesheets/bootstrap/_code.scss +61 -0
  32. data/vendor/assets/stylesheets/bootstrap/_component-animations.scss +22 -0
  33. data/vendor/assets/stylesheets/bootstrap/_dropdowns.scss +248 -0
  34. data/vendor/assets/stylesheets/bootstrap/_forms.scss +689 -0
  35. data/vendor/assets/stylesheets/bootstrap/_grid.scss +21 -0
  36. data/vendor/assets/stylesheets/bootstrap/_hero-unit.scss +25 -0
  37. data/vendor/assets/stylesheets/bootstrap/_labels-badges.scss +83 -0
  38. data/vendor/assets/stylesheets/bootstrap/_layouts.scss +16 -0
  39. data/vendor/assets/stylesheets/bootstrap/_media.scss +55 -0
  40. data/vendor/assets/stylesheets/bootstrap/_mixins.scss +696 -0
  41. data/vendor/assets/stylesheets/bootstrap/_modals.scss +95 -0
  42. data/vendor/assets/stylesheets/bootstrap/_navbar.scss +497 -0
  43. data/vendor/assets/stylesheets/bootstrap/_navs.scss +409 -0
  44. data/vendor/assets/stylesheets/bootstrap/_pager.scss +43 -0
  45. data/vendor/assets/stylesheets/bootstrap/_pagination.scss +123 -0
  46. data/vendor/assets/stylesheets/bootstrap/_popovers.scss +133 -0
  47. data/vendor/assets/stylesheets/bootstrap/_progress-bars.scss +122 -0
  48. data/vendor/assets/stylesheets/bootstrap/_reset.scss +216 -0
  49. data/vendor/assets/stylesheets/bootstrap/_responsive-1200px-min.scss +28 -0
  50. data/vendor/assets/stylesheets/bootstrap/_responsive-767px-max.scss +193 -0
  51. data/vendor/assets/stylesheets/bootstrap/_responsive-768px-979px.scss +19 -0
  52. data/vendor/assets/stylesheets/bootstrap/_responsive-navbar.scss +189 -0
  53. data/vendor/assets/stylesheets/bootstrap/_responsive-utilities.scss +74 -0
  54. data/vendor/assets/stylesheets/bootstrap/_scaffolding.scss +53 -0
  55. data/vendor/assets/stylesheets/bootstrap/_sprites.scss +197 -0
  56. data/vendor/assets/stylesheets/bootstrap/_tables.scss +235 -0
  57. data/vendor/assets/stylesheets/bootstrap/_thumbnails.scss +53 -0
  58. data/vendor/assets/stylesheets/bootstrap/_tooltip.scss +70 -0
  59. data/vendor/assets/stylesheets/bootstrap/_type.scss +247 -0
  60. data/vendor/assets/stylesheets/bootstrap/_utilities.scss +45 -0
  61. data/vendor/assets/stylesheets/bootstrap/_variables.scss +301 -0
  62. data/vendor/assets/stylesheets/bootstrap/_wells.scss +29 -0
  63. data/vendor/assets/stylesheets/bootstrap/bootstrap.scss +63 -0
  64. data/vendor/assets/stylesheets/bootstrap/responsive.scss +48 -0
  65. metadata +63 -16
@@ -0,0 +1,21 @@
1
+ //
2
+ // Grid system
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Fixed (940px)
7
+ @include grid-core($gridColumnWidth, $gridGutterWidth);
8
+
9
+ // Fluid (940px)
10
+ @include grid-fluid($fluidGridColumnWidth, $fluidGridGutterWidth);
11
+
12
+ // Reset utility classes due to specificity
13
+ [class*="span"].hide,
14
+ .row-fluid [class*="span"].hide {
15
+ display: none;
16
+ }
17
+
18
+ [class*="span"].pull-right,
19
+ .row-fluid [class*="span"].pull-right {
20
+ float: right;
21
+ }
@@ -0,0 +1,25 @@
1
+ //
2
+ // Hero unit
3
+ // --------------------------------------------------
4
+
5
+
6
+ .hero-unit {
7
+ padding: 60px;
8
+ margin-bottom: 30px;
9
+ font-size: 18px;
10
+ font-weight: 200;
11
+ line-height: $baseLineHeight * 1.5;
12
+ color: $heroUnitLeadColor;
13
+ background-color: $heroUnitBackground;
14
+ @include border-radius(6px);
15
+ h1 {
16
+ margin-bottom: 0;
17
+ font-size: 60px;
18
+ line-height: 1;
19
+ color: $heroUnitHeadingColor;
20
+ letter-spacing: -1px;
21
+ }
22
+ li {
23
+ line-height: $baseLineHeight * 1.5; // Reset since we specify in type.scss
24
+ }
25
+ }
@@ -0,0 +1,83 @@
1
+ //
2
+ // Labels and badges
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Base classes
7
+ .label,
8
+ .badge {
9
+ display: inline-block;
10
+ padding: 2px 4px;
11
+ font-size: $baseFontSize * .846;
12
+ font-weight: bold;
13
+ line-height: 14px; // ensure proper line-height if floated
14
+ color: $white;
15
+ vertical-align: baseline;
16
+ white-space: nowrap;
17
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
18
+ background-color: $grayLight;
19
+ }
20
+ // Set unique padding and border-radii
21
+ .label {
22
+ @include border-radius(3px);
23
+ }
24
+ .badge {
25
+ padding-left: 9px;
26
+ padding-right: 9px;
27
+ @include border-radius(9px);
28
+ }
29
+
30
+ // Empty labels/badges collapse
31
+ .label,
32
+ .badge {
33
+ &:empty {
34
+ display: none;
35
+ }
36
+ }
37
+
38
+ // Hover/focus state, but only for links
39
+ a {
40
+ &.label:hover,
41
+ &.label:focus,
42
+ &.badge:hover,
43
+ &.badge:focus {
44
+ color: $white;
45
+ text-decoration: none;
46
+ cursor: pointer;
47
+ }
48
+ }
49
+
50
+ // Colors
51
+ // Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute)
52
+ @each $item in label, badge {
53
+ // Important (red)
54
+ .#{$item}-important { background-color: $errorText; }
55
+ .#{$item}-important[href] { background-color: darken($errorText, 10%); }
56
+ // Warnings (orange)
57
+ .#{$item}-warning { background-color: $orange; }
58
+ .#{$item}-warning[href] { background-color: darken($orange, 10%); }
59
+ // Success (green)
60
+ .#{$item}-success { background-color: $successText; }
61
+ .#{$item}-success[href] { background-color: darken($successText, 10%); }
62
+ // Info (turquoise)
63
+ .#{$item}-info { background-color: $infoText; }
64
+ .#{$item}-info[href] { background-color: darken($infoText, 10%); }
65
+ // Inverse (black)
66
+ .#{$item}-inverse { background-color: $grayDark; }
67
+ .#{$item}-inverse[href] { background-color: darken($grayDark, 10%); }
68
+ }
69
+
70
+ // Quick fix for labels/badges in buttons
71
+ .btn {
72
+ .label,
73
+ .badge {
74
+ position: relative;
75
+ top: -1px;
76
+ }
77
+ }
78
+ .btn-mini {
79
+ .label,
80
+ .badge {
81
+ top: 0;
82
+ }
83
+ }
@@ -0,0 +1,16 @@
1
+ //
2
+ // Layouts
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Container (centered, fixed-width layouts)
7
+ .container {
8
+ @include container-fixed();
9
+ }
10
+
11
+ // Fluid layouts (left aligned, with sidebar, min- & max-width content)
12
+ .container-fluid {
13
+ padding-right: $gridGutterWidth;
14
+ padding-left: $gridGutterWidth;
15
+ @include clearfix();
16
+ }
@@ -0,0 +1,55 @@
1
+ // Media objects
2
+ // Source: http://stubbornella.org/content/?p=497
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Common styles
7
+ // -------------------------
8
+
9
+ // Clear the floats
10
+ .media,
11
+ .media-body {
12
+ overflow: hidden;
13
+ *overflow: visible;
14
+ zoom: 1;
15
+ }
16
+
17
+ // Proper spacing between instances of .media
18
+ .media,
19
+ .media .media {
20
+ margin-top: 15px;
21
+ }
22
+ .media:first-child {
23
+ margin-top: 0;
24
+ }
25
+
26
+ // For images and videos, set to block
27
+ .media-object {
28
+ display: block;
29
+ }
30
+
31
+ // Reset margins on headings for tighter default spacing
32
+ .media-heading {
33
+ margin: 0 0 5px;
34
+ }
35
+
36
+
37
+ // Media image alignment
38
+ // -------------------------
39
+
40
+ .media > .pull-left {
41
+ margin-right: 10px;
42
+ }
43
+ .media > .pull-right {
44
+ margin-left: 10px;
45
+ }
46
+
47
+
48
+ // Media list variation
49
+ // -------------------------
50
+
51
+ // Undo default ul/ol styles
52
+ .media-list {
53
+ margin-left: 0;
54
+ list-style: none;
55
+ }
@@ -0,0 +1,696 @@
1
+ //
2
+ // Mixins
3
+ // --------------------------------------------------
4
+
5
+
6
+ // UTILITY MIXINS
7
+ // --------------------------------------------------
8
+
9
+ // Clearfix
10
+ // --------
11
+ // For clearing floats like a boss h5bp.com/q
12
+ @mixin clearfix {
13
+ *zoom: 1;
14
+ &:before,
15
+ &:after {
16
+ display: table;
17
+ content: "";
18
+ // Fixes Opera/contenteditable bug:
19
+ // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952
20
+ line-height: 0;
21
+ }
22
+ &:after {
23
+ clear: both;
24
+ }
25
+ }
26
+
27
+ // Webkit-style focus
28
+ // ------------------
29
+ @mixin tab-focus() {
30
+ // Default
31
+ outline: thin dotted #333;
32
+ // Webkit
33
+ outline: 5px auto -webkit-focus-ring-color;
34
+ outline-offset: -2px;
35
+ }
36
+
37
+ // Center-align a block level element
38
+ // ----------------------------------
39
+ @mixin center-block() {
40
+ display: block;
41
+ margin-left: auto;
42
+ margin-right: auto;
43
+ }
44
+
45
+ // IE7 inline-block
46
+ // ----------------
47
+ @mixin ie7-inline-block() {
48
+ *display: inline; /* IE7 inline-block hack */
49
+ *zoom: 1;
50
+ }
51
+
52
+ // IE7 likes to collapse whitespace on either side of the inline-block elements.
53
+ // Ems because we're attempting to match the width of a space character. Left
54
+ // version is for form buttons, which typically come after other elements, and
55
+ // right version is for icons, which come before. Applying both is ok, but it will
56
+ // mean that space between those elements will be .6em (~2 space characters) in IE7,
57
+ // instead of the 1 space in other browsers.
58
+ @mixin ie7-restore-left-whitespace() {
59
+ *margin-left: .3em;
60
+
61
+ &:first-child {
62
+ *margin-left: 0;
63
+ }
64
+ }
65
+
66
+ @mixin ie7-restore-right-whitespace() {
67
+ *margin-right: .3em;
68
+ }
69
+
70
+ // Sizing shortcuts
71
+ // -------------------------
72
+ @mixin size($height, $width) {
73
+ width: $width;
74
+ height: $height;
75
+ }
76
+ @mixin square($size) {
77
+ @include size($size, $size);
78
+ }
79
+
80
+ // Placeholder text
81
+ // -------------------------
82
+ @mixin placeholder($color: $placeholderText) {
83
+ &:-moz-placeholder {
84
+ color: $color;
85
+ }
86
+ &:-ms-input-placeholder {
87
+ color: $color;
88
+ }
89
+ &::-webkit-input-placeholder {
90
+ color: $color;
91
+ }
92
+ }
93
+
94
+ // Text overflow
95
+ // -------------------------
96
+ // Requires inline-block or block for proper styling
97
+ @mixin text-overflow() {
98
+ overflow: hidden;
99
+ text-overflow: ellipsis;
100
+ white-space: nowrap;
101
+ }
102
+
103
+ // CSS image replacement
104
+ // -------------------------
105
+ // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
106
+ @mixin hide-text {
107
+ font: 0/0 a;
108
+ color: transparent;
109
+ text-shadow: none;
110
+ background-color: transparent;
111
+ border: 0;
112
+ }
113
+
114
+
115
+ // FONTS
116
+ // --------------------------------------------------
117
+
118
+ @mixin font-family-serif() {
119
+ font-family: $serifFontFamily;
120
+ }
121
+ @mixin font-family-sans-serif() {
122
+ font-family: $sansFontFamily;
123
+ }
124
+ @mixin font-family-monospace() {
125
+ font-family: $monoFontFamily;
126
+ }
127
+ @mixin font-shorthand($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
128
+ font-size: $size;
129
+ font-weight: $weight;
130
+ line-height: $lineHeight;
131
+ }
132
+ @mixin font-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
133
+ @include font-family-serif();
134
+ @include font-shorthand($size, $weight, $lineHeight);
135
+ }
136
+ @mixin font-sans-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
137
+ @include font-family-sans-serif();
138
+ @include font-shorthand($size, $weight, $lineHeight);
139
+ }
140
+ @mixin font-monospace($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
141
+ @include font-family-monospace();
142
+ @include font-shorthand($size, $weight, $lineHeight);
143
+ }
144
+
145
+
146
+ // FORMS
147
+ // --------------------------------------------------
148
+
149
+ // Block level inputs
150
+ @mixin input-block-level {
151
+ display: block;
152
+ width: 100%;
153
+ min-height: $inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
154
+ @include box-sizing(border-box); // Makes inputs behave like true block-level elements
155
+ }
156
+
157
+
158
+
159
+ // Mixin for form field states
160
+ @mixin formFieldState($textColor: #555, $borderColor: #ccc, $backgroundColor: #f5f5f5) {
161
+ // Set the text color
162
+ .control-label,
163
+ .help-block,
164
+ .help-inline {
165
+ color: $textColor;
166
+ }
167
+ // Style inputs accordingly
168
+ .checkbox,
169
+ .radio,
170
+ input,
171
+ select,
172
+ textarea {
173
+ color: $textColor;
174
+ }
175
+ input,
176
+ select,
177
+ textarea {
178
+ border-color: $borderColor;
179
+ @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
180
+ &:focus {
181
+ border-color: darken($borderColor, 10%);
182
+ @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($borderColor, 20%));
183
+ }
184
+ }
185
+ // Give a small background color for input-prepend/-append
186
+ .input-prepend .add-on,
187
+ .input-append .add-on {
188
+ color: $textColor;
189
+ background-color: $backgroundColor;
190
+ border-color: $textColor;
191
+ }
192
+ }
193
+
194
+
195
+
196
+ // CSS3 PROPERTIES
197
+ // --------------------------------------------------
198
+
199
+ // Border Radius
200
+ @mixin border-radius($radius) {
201
+ -webkit-border-radius: $radius;
202
+ -moz-border-radius: $radius;
203
+ border-radius: $radius;
204
+ }
205
+
206
+ // Single Corner Border Radius
207
+ @mixin border-top-left-radius($radius) {
208
+ -webkit-border-top-left-radius: $radius;
209
+ -moz-border-radius-topleft: $radius;
210
+ border-top-left-radius: $radius;
211
+ }
212
+ @mixin border-top-right-radius($radius) {
213
+ -webkit-border-top-right-radius: $radius;
214
+ -moz-border-radius-topright: $radius;
215
+ border-top-right-radius: $radius;
216
+ }
217
+ @mixin border-bottom-right-radius($radius) {
218
+ -webkit-border-bottom-right-radius: $radius;
219
+ -moz-border-radius-bottomright: $radius;
220
+ border-bottom-right-radius: $radius;
221
+ }
222
+ @mixin border-bottom-left-radius($radius) {
223
+ -webkit-border-bottom-left-radius: $radius;
224
+ -moz-border-radius-bottomleft: $radius;
225
+ border-bottom-left-radius: $radius;
226
+ }
227
+
228
+ // Single Side Border Radius
229
+ @mixin border-top-radius($radius) {
230
+ @include border-top-right-radius($radius);
231
+ @include border-top-left-radius($radius);
232
+ }
233
+ @mixin border-right-radius($radius) {
234
+ @include border-top-right-radius($radius);
235
+ @include border-bottom-right-radius($radius);
236
+ }
237
+ @mixin border-bottom-radius($radius) {
238
+ @include border-bottom-right-radius($radius);
239
+ @include border-bottom-left-radius($radius);
240
+ }
241
+ @mixin border-left-radius($radius) {
242
+ @include border-top-left-radius($radius);
243
+ @include border-bottom-left-radius($radius);
244
+ }
245
+
246
+ // Drop shadows
247
+ @mixin box-shadow($shadow...) {
248
+ -webkit-box-shadow: $shadow;
249
+ -moz-box-shadow: $shadow;
250
+ box-shadow: $shadow;
251
+ }
252
+
253
+ // Transitions
254
+ @mixin transition($transition...) {
255
+ -webkit-transition: $transition;
256
+ -moz-transition: $transition;
257
+ -o-transition: $transition;
258
+ transition: $transition;
259
+ }
260
+ @mixin transition-delay($transition-delay) {
261
+ -webkit-transition-delay: $transition-delay;
262
+ -moz-transition-delay: $transition-delay;
263
+ -o-transition-delay: $transition-delay;
264
+ transition-delay: $transition-delay;
265
+ }
266
+ @mixin transition-duration($transition-duration) {
267
+ -webkit-transition-duration: $transition-duration;
268
+ -moz-transition-duration: $transition-duration;
269
+ -o-transition-duration: $transition-duration;
270
+ transition-duration: $transition-duration;
271
+ }
272
+
273
+ // Transformations
274
+ @mixin rotate($degrees) {
275
+ -webkit-transform: rotate($degrees);
276
+ -moz-transform: rotate($degrees);
277
+ -ms-transform: rotate($degrees);
278
+ -o-transform: rotate($degrees);
279
+ transform: rotate($degrees);
280
+ }
281
+ @mixin scale($ratio) {
282
+ -webkit-transform: scale($ratio);
283
+ -moz-transform: scale($ratio);
284
+ -ms-transform: scale($ratio);
285
+ -o-transform: scale($ratio);
286
+ transform: scale($ratio);
287
+ }
288
+ @mixin translate($x, $y) {
289
+ -webkit-transform: translate($x, $y);
290
+ -moz-transform: translate($x, $y);
291
+ -ms-transform: translate($x, $y);
292
+ -o-transform: translate($x, $y);
293
+ transform: translate($x, $y);
294
+ }
295
+ @mixin skew($x, $y) {
296
+ -webkit-transform: skew($x, $y);
297
+ -moz-transform: skew($x, $y);
298
+ -ms-transform: skewX($x) skewY($y); // See https://github.com/twitter/bootstrap/issues/4885
299
+ -o-transform: skew($x, $y);
300
+ transform: skew($x, $y);
301
+ -webkit-backface-visibility: hidden; // See https://github.com/twitter/bootstrap/issues/5319
302
+ }
303
+ @mixin translate3d($x, $y, $z) {
304
+ -webkit-transform: translate3d($x, $y, $z);
305
+ -moz-transform: translate3d($x, $y, $z);
306
+ -o-transform: translate3d($x, $y, $z);
307
+ transform: translate3d($x, $y, $z);
308
+ }
309
+
310
+ // Backface visibility
311
+ // Prevent browsers from flickering when using CSS 3D transforms.
312
+ // Default value is `visible`, but can be changed to `hidden
313
+ // See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
314
+ @mixin backface-visibility($visibility){
315
+ -webkit-backface-visibility: $visibility;
316
+ -moz-backface-visibility: $visibility;
317
+ backface-visibility: $visibility;
318
+ }
319
+
320
+ // Background clipping
321
+ // Heads up: FF 3.6 and under need "padding" instead of "padding-box"
322
+ @mixin background-clip($clip) {
323
+ -webkit-background-clip: $clip;
324
+ -moz-background-clip: $clip;
325
+ background-clip: $clip;
326
+ }
327
+
328
+ // Background sizing
329
+ @mixin background-size($size) {
330
+ -webkit-background-size: $size;
331
+ -moz-background-size: $size;
332
+ -o-background-size: $size;
333
+ background-size: $size;
334
+ }
335
+
336
+
337
+ // Box sizing
338
+ @mixin box-sizing($boxmodel) {
339
+ -webkit-box-sizing: $boxmodel;
340
+ -moz-box-sizing: $boxmodel;
341
+ box-sizing: $boxmodel;
342
+ }
343
+
344
+ // User select
345
+ // For selecting text on the page
346
+ @mixin user-select($select) {
347
+ -webkit-user-select: $select;
348
+ -moz-user-select: $select;
349
+ -ms-user-select: $select;
350
+ -o-user-select: $select;
351
+ user-select: $select;
352
+ }
353
+
354
+ // Resize anything
355
+ @mixin resizable($direction) {
356
+ resize: $direction; // Options: horizontal, vertical, both
357
+ overflow: auto; // Safari fix
358
+ }
359
+
360
+ // CSS3 Content Columns
361
+ @mixin content-columns($columnCount, $columnGap: $gridGutterWidth) {
362
+ -webkit-column-count: $columnCount;
363
+ -moz-column-count: $columnCount;
364
+ column-count: $columnCount;
365
+ -webkit-column-gap: $columnGap;
366
+ -moz-column-gap: $columnGap;
367
+ column-gap: $columnGap;
368
+ }
369
+
370
+ // Optional hyphenation
371
+ @mixin hyphens($mode: auto) {
372
+ word-wrap: break-word;
373
+ -webkit-hyphens: $mode;
374
+ -moz-hyphens: $mode;
375
+ -ms-hyphens: $mode;
376
+ -o-hyphens: $mode;
377
+ hyphens: $mode;
378
+ }
379
+
380
+ // Opacity
381
+ @mixin opacity($opacity) {
382
+ opacity: $opacity / 100;
383
+ filter: alpha(opacity=$opacity);
384
+ }
385
+
386
+
387
+
388
+ // BACKGROUNDS
389
+ // --------------------------------------------------
390
+
391
+ // Add an alphatransparency value to any background or border color (via Elyse Holladay)
392
+ @mixin translucent-background($color: $white, $alpha: 1) {
393
+ background-color: hsla(hue($color), saturation($color), lightness($color), $alpha);
394
+ }
395
+
396
+ @mixin translucent-border($color: $white, $alpha: 1) {
397
+ border-color: hsla(hue($color), saturation($color), lightness($color), $alpha);
398
+ @include background-clip(padding-box);
399
+ }
400
+
401
+ // Gradient Bar Colors for buttons and alerts
402
+ @mixin gradientBar($primaryColor, $secondaryColor, $textColor: #fff, $textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
403
+ color: $textColor;
404
+ text-shadow: $textShadow;
405
+ @include gradient-vertical($primaryColor, $secondaryColor);
406
+ border-color: $secondaryColor $secondaryColor darken($secondaryColor, 15%);
407
+ border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fade-in(rgba(0,0,0,.1), 0.15);
408
+ }
409
+
410
+ // Gradients
411
+ @mixin gradient-horizontal($startColor: #555, $endColor: #333) {
412
+ background-color: $endColor;
413
+ background-image: -moz-linear-gradient(left, $startColor, $endColor); // FF 3.6+
414
+ background-image: -webkit-gradient(linear, 0 0, 100% 0, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
415
+ background-image: -webkit-linear-gradient(left, $startColor, $endColor); // Safari 5.1+, Chrome 10+
416
+ background-image: -o-linear-gradient(left, $startColor, $endColor); // Opera 11.10
417
+ background-image: linear-gradient(to right, $startColor, $endColor); // Standard, IE10
418
+ background-repeat: repeat-x;
419
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=1); // IE9 and down
420
+ }
421
+ @mixin gradient-vertical($startColor: #555, $endColor: #333) {
422
+ background-color: mix($startColor, $endColor, 60%);
423
+ background-image: -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
424
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
425
+ background-image: -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
426
+ background-image: -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
427
+ background-image: linear-gradient(to bottom, $startColor, $endColor); // Standard, IE10
428
+ background-repeat: repeat-x;
429
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=0); // IE9 and down
430
+ }
431
+ @mixin gradient-directional($startColor: #555, $endColor: #333, $deg: 45deg) {
432
+ background-color: $endColor;
433
+ background-repeat: repeat-x;
434
+ background-image: -moz-linear-gradient($deg, $startColor, $endColor); // FF 3.6+
435
+ background-image: -webkit-linear-gradient($deg, $startColor, $endColor); // Safari 5.1+, Chrome 10+
436
+ background-image: -o-linear-gradient($deg, $startColor, $endColor); // Opera 11.10
437
+ background-image: linear-gradient($deg, $startColor, $endColor); // Standard, IE10
438
+ }
439
+ @mixin gradient-horizontal-three-colors($startColor: #00b3ee, $midColor: #7a43b6, $colorStop: 50%, $endColor: #c3325f) {
440
+ background-color: mix($midColor, $endColor, 80%);
441
+ background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from($startColor), color-stop($colorStop, $midColor), to($endColor));
442
+ background-image: -webkit-linear-gradient(left, $startColor, $midColor $colorStop, $endColor);
443
+ background-image: -moz-linear-gradient(left, $startColor, $midColor $colorStop, $endColor);
444
+ background-image: -o-linear-gradient(left, $startColor, $midColor $colorStop, $endColor);
445
+ background-image: linear-gradient(to right, $startColor, $midColor $colorStop, $endColor);
446
+ background-repeat: no-repeat;
447
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=0); // IE9 and down, gets no color-stop at all for proper fallback
448
+ }
449
+
450
+ @mixin gradient-vertical-three-colors($startColor: #00b3ee, $midColor: #7a43b6, $colorStop: 50%, $endColor: #c3325f) {
451
+ background-color: mix($midColor, $endColor, 80%);
452
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), color-stop($colorStop, $midColor), to($endColor));
453
+ background-image: -webkit-linear-gradient($startColor, $midColor $colorStop, $endColor);
454
+ background-image: -moz-linear-gradient(top, $startColor, $midColor $colorStop, $endColor);
455
+ background-image: -o-linear-gradient($startColor, $midColor $colorStop, $endColor);
456
+ background-image: linear-gradient($startColor, $midColor $colorStop, $endColor);
457
+ background-repeat: no-repeat;
458
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=0); // IE9 and down, gets no color-stop at all for proper fallback
459
+ }
460
+ @mixin gradient-radial($innerColor: #555, $outerColor: #333) {
461
+ background-color: $outerColor;
462
+ background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($innerColor), to($outerColor));
463
+ background-image: -webkit-radial-gradient(circle, $innerColor, $outerColor);
464
+ background-image: -moz-radial-gradient(circle, $innerColor, $outerColor);
465
+ background-image: -o-radial-gradient(circle, $innerColor, $outerColor);
466
+ background-repeat: no-repeat;
467
+ }
468
+ @mixin gradient-striped($color: #555, $angle: 45deg) {
469
+ background-color: $color;
470
+ background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
471
+ background-image: -webkit-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
472
+ background-image: -moz-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
473
+ background-image: -o-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
474
+ background-image: linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
475
+ }
476
+
477
+ // Reset filters for IE
478
+ @mixin reset-filter() {
479
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
480
+ }
481
+
482
+
483
+
484
+ // COMPONENT MIXINS
485
+ // --------------------------------------------------
486
+
487
+ // Horizontal dividers
488
+ // -------------------------
489
+ // Dividers (basically an hr) within dropdowns and nav lists
490
+ @mixin nav-divider($top: #e5e5e5, $bottom: $white) {
491
+ // IE7 needs a set width since we gave a height. Restricting just
492
+ // to IE7 to keep the 1px left/right space in other browsers.
493
+ // It is unclear where IE is getting the extra space that we need
494
+ // to negative-margin away, but so it goes.
495
+ *width: 100%;
496
+ height: 1px;
497
+ margin: (($baseLineHeight / 2) - 1) 1px; // 8px 1px
498
+ *margin: -5px 0 5px;
499
+ overflow: hidden;
500
+ background-color: $top;
501
+ border-bottom: 1px solid $bottom;
502
+ }
503
+
504
+ // Button backgrounds
505
+ // ------------------
506
+ @mixin buttonBackground($startColor, $endColor, $textColor: #fff, $textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
507
+ // gradientBar will set the background to a pleasing blend of these, to support IE<=9
508
+ @include gradientBar($startColor, $endColor, $textColor, $textShadow);
509
+ *background-color: $endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
510
+ @include reset-filter();
511
+
512
+ // in these cases the gradient won't cover the background, so we override
513
+ &:hover, &:focus, &:active, &.active, &.disabled, &[disabled] {
514
+ color: $textColor;
515
+ background-color: $endColor;
516
+ *background-color: darken($endColor, 5%);
517
+ }
518
+
519
+ // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
520
+ &:active,
521
+ &.active {
522
+ background-color: darken($endColor, 10%) \9;
523
+ }
524
+ }
525
+
526
+ // Navbar vertical align
527
+ // -------------------------
528
+ // Vertically center elements in the navbar.
529
+ // Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
530
+ @mixin navbarVerticalAlign($elementHeight) {
531
+ margin-top: ($navbarHeight - $elementHeight) / 2;
532
+ }
533
+
534
+
535
+
536
+ // Grid System
537
+ // -----------
538
+
539
+ // Centered container element
540
+ @mixin container-fixed() {
541
+ margin-right: auto;
542
+ margin-left: auto;
543
+ @include clearfix();
544
+ }
545
+
546
+ // Table columns
547
+ @mixin tableColumns($columnSpan: 1) {
548
+ float: none; // undo default grid column styles
549
+ width: (($gridColumnWidth) * $columnSpan) + ($gridGutterWidth * ($columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells
550
+ margin-left: 0; // undo default grid column styles
551
+ }
552
+
553
+ // Make a Grid
554
+ // Use .makeRow and .makeColumn to assign semantic layouts grid system behavior
555
+ @mixin makeRow() {
556
+ margin-left: $gridGutterWidth * -1;
557
+ @include clearfix();
558
+ }
559
+ @mixin makeColumn($columns: 1, $offset: 0) {
560
+ float: left;
561
+ margin-left: ($gridColumnWidth * $offset) + ($gridGutterWidth * ($offset - 1)) + ($gridGutterWidth * 2);
562
+ width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1));
563
+ }
564
+
565
+ // The Grid
566
+ @mixin grid-core($gridColumnWidth, $gridGutterWidth) {
567
+ .row {
568
+ margin-left: $gridGutterWidth * -1;
569
+ @include clearfix();
570
+ }
571
+
572
+ [class*="span"] {
573
+ float: left;
574
+ min-height: 1px; // prevent collapsing columns
575
+ margin-left: $gridGutterWidth;
576
+ }
577
+
578
+ // Set the container width, and override it for fixed navbars in media queries
579
+ .container,
580
+ .navbar-static-top .container,
581
+ .navbar-fixed-top .container,
582
+ .navbar-fixed-bottom .container {
583
+ @include grid-core-span($gridColumns, $gridColumnWidth, $gridGutterWidth);
584
+ }
585
+
586
+ // generate .spanX and .offsetX
587
+ @include grid-core-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth);
588
+ @include grid-core-offset-x($gridColumns, $gridColumnWidth, $gridGutterWidth);
589
+ }
590
+
591
+ @mixin grid-core-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth) {
592
+ @for $i from 1 through $gridColumns {
593
+ .span#{$i} { @include grid-core-span($i, $gridColumnWidth, $gridGutterWidth); }
594
+ }
595
+ }
596
+
597
+ @mixin grid-core-offset-x($gridColumns, $gridColumnWidth, $gridGutterWidth) {
598
+ @for $i from 1 through $gridColumns {
599
+ .offset#{$i} { @include grid-core-offset($i, $gridColumnWidth, $gridGutterWidth); }
600
+ }
601
+ }
602
+
603
+ @mixin grid-core-span($columns, $gridColumnWidth, $gridGutterWidth) {
604
+ width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1));
605
+ }
606
+
607
+ @mixin grid-core-offset($columns, $gridColumnWidth, $gridGutterWidth) {
608
+ margin-left: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns + 1));
609
+ }
610
+
611
+
612
+
613
+ @mixin grid-fluid($fluidGridColumnWidth, $fluidGridGutterWidth) {
614
+ .row-fluid {
615
+ width: 100%;
616
+ @include clearfix();
617
+ [class*="span"] {
618
+ @include input-block-level();
619
+ float: left;
620
+ margin-left: $fluidGridGutterWidth;
621
+ *margin-left: $fluidGridGutterWidth - (.5 / $gridRowWidth * 100px * 1%);
622
+ }
623
+ [class*="span"]:first-child {
624
+ margin-left: 0;
625
+ }
626
+
627
+ // Space grid-sized controls properly if multiple per line
628
+ .controls-row [class*="span"] + [class*="span"] {
629
+ margin-left: $fluidGridGutterWidth;
630
+ }
631
+
632
+ // generate .spanX and .offsetX
633
+ @include grid-fluid-span-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth);
634
+ @include grid-fluid-offset-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth);
635
+ }
636
+ }
637
+
638
+ @mixin grid-fluid-span-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
639
+ @for $i from 1 through $gridColumns {
640
+ .span#{$i} { @include grid-fluid-span($i, $fluidGridColumnWidth, $fluidGridGutterWidth); }
641
+ }
642
+ }
643
+
644
+ @mixin grid-fluid-offset-x($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
645
+ @for $i from 1 through $gridColumns {
646
+ .offset#{$i} { @include grid-fluid-offset($i, $fluidGridColumnWidth, $fluidGridGutterWidth); }
647
+ .offset#{$i}:first-child { @include grid-fluid-offset-first-child($i, $fluidGridColumnWidth, $fluidGridGutterWidth); }
648
+ }
649
+ }
650
+
651
+ @mixin grid-fluid-span($columns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
652
+ width: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1));
653
+ *width: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) - (.5 / $gridRowWidth * 100px * 1%);
654
+ }
655
+
656
+ @mixin grid-fluid-offset($columns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
657
+ margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) + ($fluidGridGutterWidth * 2);
658
+ *margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) - (.5 / $gridRowWidth * 100px * 1%) + ($fluidGridGutterWidth * 2) - (.5 / $gridRowWidth * 100px * 1%);
659
+ }
660
+
661
+ @mixin grid-fluid-offset-first-child($columns, $fluidGridColumnWidth, $fluidGridGutterWidth) {
662
+ margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) + ($fluidGridGutterWidth);
663
+ *margin-left: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)) - (.5 / $gridRowWidth * 100px * 1%) + $fluidGridGutterWidth - (.5 / $gridRowWidth * 100px * 1%);
664
+ }
665
+
666
+
667
+
668
+ @mixin grid-input($gridColumnWidth, $gridGutterWidth) {
669
+ input,
670
+ textarea,
671
+ .uneditable-input {
672
+ margin-left: 0; // override margin-left from core grid system
673
+ }
674
+
675
+ // Space grid-sized controls properly if multiple per line
676
+ .controls-row [class*="span"] + [class*="span"] {
677
+ margin-left: $gridGutterWidth;
678
+ }
679
+
680
+ // generate .spanX
681
+ @include grid-input-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth);
682
+ }
683
+
684
+ @mixin grid-input-span-x($gridColumns, $gridColumnWidth, $gridGutterWidth) {
685
+ @for $i from 1 through $gridColumns {
686
+ input.span#{$i},
687
+ textarea.span#{$i},
688
+ .uneditable-input.span#{$i} {
689
+ @include grid-input-span($i, $gridColumnWidth, $gridGutterWidth);
690
+ }
691
+ }
692
+ }
693
+
694
+ @mixin grid-input-span($columns, $gridColumnWidth, $gridGutterWidth) {
695
+ width: (($gridColumnWidth) * $columns) + ($gridGutterWidth * ($columns - 1)) - 14;
696
+ }