rapido-css 0.1.6 → 0.1.7
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +8 -8
- data/stylesheets/_default-styles.scss +109 -46
- data/stylesheets/_functions.scss +6 -6
- data/stylesheets/components/_buttons.scss +1 -2
- data/stylesheets/components/_captions.scss +2 -4
- data/stylesheets/components/_dropdowns.scss +4 -2
- data/stylesheets/components/_forms.scss +116 -30
- data/stylesheets/components/_labels.scss +1 -1
- data/stylesheets/components/_modals.scss +1 -1
- data/stylesheets/components/_navs.scss +7 -15
- data/stylesheets/components/_overlay.scss +81 -0
- data/stylesheets/components/_pager.scss +1 -1
- data/stylesheets/components/_pagination.scss +1 -1
- data/stylesheets/components/_sliders.scss +3 -3
- data/stylesheets/components/_tables.scss +1 -1
- data/stylesheets/components/_tabs.scss +2 -3
- data/stylesheets/components/_tooltip.scss +89 -0
- data/stylesheets/components/_type.scss +13 -11
- data/stylesheets/rapido.scss +2 -0
- data/stylesheets/settings/_base.scss +6 -6
- data/stylesheets/settings/_colors.scss +48 -6
- data/stylesheets/settings/_components.scss +25 -26
- data/stylesheets/settings/_dimensions.scss +34 -16
- data/stylesheets/settings/_effects.scss +13 -11
- data/stylesheets/utilities/_animations.scss +5 -5
- data/stylesheets/utilities/_debug.scss +2 -2
- data/stylesheets/utilities/_helper-classes.scss +8 -11
- data/stylesheets/utilities/_mixins.scss +25 -25
- metadata +4 -2
@@ -2,7 +2,7 @@
|
|
2
2
|
|
3
3
|
Type
|
4
4
|
|
5
|
-
Styleguide
|
5
|
+
Styleguide 22
|
6
6
|
|
7
7
|
*/
|
8
8
|
|
@@ -36,7 +36,7 @@ body {
|
|
36
36
|
|
37
37
|
img {
|
38
38
|
max-width: 100%;
|
39
|
-
|
39
|
+
@include inline-block;
|
40
40
|
}
|
41
41
|
|
42
42
|
a, button, textarea, input { outline: none; }
|
@@ -59,11 +59,13 @@ a {
|
|
59
59
|
// Selection color
|
60
60
|
|
61
61
|
::selection {
|
62
|
-
|
62
|
+
color: $selection-color;
|
63
|
+
background: $selection-background;
|
63
64
|
}
|
64
65
|
|
65
66
|
::-moz-selection {
|
66
|
-
|
67
|
+
color: $selection-color;
|
68
|
+
background: $selection-background;
|
67
69
|
}
|
68
70
|
|
69
71
|
|
@@ -76,7 +78,7 @@ Markup:
|
|
76
78
|
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec id elit non mi porta gravida at eget metus.</p>
|
77
79
|
<small><p>Tight pants next level keffiyeh. Photo booth beard raw denim letterpress vegan messenger bag stumptown.</small>
|
78
80
|
|
79
|
-
Styleguide
|
81
|
+
Styleguide 22.1
|
80
82
|
|
81
83
|
*/
|
82
84
|
|
@@ -103,7 +105,7 @@ Markup:
|
|
103
105
|
<h5>h5. This is a small header. h1.</h5>
|
104
106
|
<h6>h6. This is a tiny header. h1.</h6>
|
105
107
|
|
106
|
-
Styleguide
|
108
|
+
Styleguide 22.2
|
107
109
|
|
108
110
|
*/
|
109
111
|
|
@@ -170,7 +172,7 @@ Markup:
|
|
170
172
|
<li>Ordered list item</li>
|
171
173
|
</ol>
|
172
174
|
|
173
|
-
Styleguide
|
175
|
+
Styleguide 22.3
|
174
176
|
|
175
177
|
*/
|
176
178
|
|
@@ -221,7 +223,7 @@ Markup:
|
|
221
223
|
<dd>A geologist’s hammer, rock hammer, rock pick or geological pick is a hammer used for splitting and breaking rocks.</dd>
|
222
224
|
</dl>
|
223
225
|
|
224
|
-
Styleguide
|
226
|
+
Styleguide 22.4
|
225
227
|
|
226
228
|
*/
|
227
229
|
|
@@ -242,7 +244,7 @@ Markup:
|
|
242
244
|
<dd>A geologist’s hammer, rock hammer, rock pick or geological pick is a hammer used for splitting and breaking rocks.</dd>
|
243
245
|
</dl>
|
244
246
|
|
245
|
-
Styleguide
|
247
|
+
Styleguide 22.4.1
|
246
248
|
|
247
249
|
*/
|
248
250
|
|
@@ -265,7 +267,7 @@ Horizontal line
|
|
265
267
|
|
266
268
|
Markup: <hr />
|
267
269
|
|
268
|
-
Styleguide
|
270
|
+
Styleguide 22.5
|
269
271
|
|
270
272
|
*/
|
271
273
|
|
@@ -297,7 +299,7 @@ Markup:
|
|
297
299
|
<small><cite>Rock Hammer</cite></small>
|
298
300
|
</blockquote>
|
299
301
|
|
300
|
-
Styleguide
|
302
|
+
Styleguide 22.6
|
301
303
|
|
302
304
|
*/
|
303
305
|
|
data/stylesheets/rapido.scss
CHANGED
@@ -49,8 +49,10 @@
|
|
49
49
|
@import "components/captions";
|
50
50
|
@import "components/grids";
|
51
51
|
@import "components/labels";
|
52
|
+
@import "components/overlay";
|
52
53
|
@import "components/pager";
|
53
54
|
@import "components/pagination";
|
55
|
+
@import "components/tooltip";
|
54
56
|
|
55
57
|
// Default styles
|
56
58
|
|
@@ -2,7 +2,7 @@
|
|
2
2
|
|
3
3
|
Base Settings
|
4
4
|
|
5
|
-
Styleguide
|
5
|
+
Styleguide 28
|
6
6
|
|
7
7
|
*/
|
8
8
|
|
@@ -14,7 +14,7 @@ Debug Mode
|
|
14
14
|
$debug-outlines: false # Enable debug outlines mode
|
15
15
|
$default-styles: true # Use default styles in _default-styles.scss
|
16
16
|
|
17
|
-
Styleguide
|
17
|
+
Styleguide 28.1
|
18
18
|
|
19
19
|
*/
|
20
20
|
|
@@ -36,7 +36,7 @@ on `palm` (smartphone) change the base size to 16px, it will be automatically co
|
|
36
36
|
|
37
37
|
$responsive-font-size: lap-and-up $base-font-size, palm 16px
|
38
38
|
|
39
|
-
Styleguide
|
39
|
+
Styleguide 28.2
|
40
40
|
|
41
41
|
*/
|
42
42
|
|
@@ -58,7 +58,7 @@ Font families
|
|
58
58
|
$base-font-family: $font-sans # Default font family for body text
|
59
59
|
$titles-font-family: $font-sans # Default font family for titles
|
60
60
|
|
61
|
-
Styleguide
|
61
|
+
Styleguide 28.3
|
62
62
|
|
63
63
|
*/
|
64
64
|
|
@@ -83,7 +83,7 @@ Enable or disable specific broweser prefixes used by Compass mixins.
|
|
83
83
|
$experimental-support-for-khtml: false
|
84
84
|
|
85
85
|
|
86
|
-
Styleguide
|
86
|
+
Styleguide 28.4
|
87
87
|
|
88
88
|
*/
|
89
89
|
|
@@ -104,7 +104,7 @@ To convert `PX` to `EM` using the `$base-font-size` as font size.
|
|
104
104
|
|
105
105
|
width: em(20px);
|
106
106
|
|
107
|
-
Styleguide
|
107
|
+
Styleguide 27.1
|
108
108
|
|
109
109
|
*/
|
110
110
|
|
@@ -12,7 +12,22 @@ Used for scaffolding
|
|
12
12
|
$grayLighter: lighten($black, 95)
|
13
13
|
$white: #fff
|
14
14
|
|
15
|
-
|
15
|
+
# Better defaults from https://github.com/mrmrs/colors
|
16
|
+
$aqua: #7FDBFF
|
17
|
+
$blue: #0074D9
|
18
|
+
$navy: #001F3F
|
19
|
+
$teal: #39CCCC
|
20
|
+
$green: #2ECC40
|
21
|
+
$olive: #3D9970
|
22
|
+
$lime: #01FF70
|
23
|
+
$yellow: #FFDC00
|
24
|
+
$orange: #FF851B
|
25
|
+
$red: #FF4136
|
26
|
+
$fuchsia: #F012BE
|
27
|
+
$purple: #B10DC9
|
28
|
+
$maroon: #85144B
|
29
|
+
|
30
|
+
Styleguide 29
|
16
31
|
|
17
32
|
*/
|
18
33
|
|
@@ -24,6 +39,20 @@ $grayLight: lighten($black, 85);
|
|
24
39
|
$grayLighter: lighten($black, 95);
|
25
40
|
$white: lighten($black, 100);
|
26
41
|
|
42
|
+
$aqua: #7FDBFF;
|
43
|
+
$blue: #0074D9;
|
44
|
+
$navy: #001F3F;
|
45
|
+
$teal: #39CCCC;
|
46
|
+
$green: #2ECC40;
|
47
|
+
$olive: #3D9970;
|
48
|
+
$lime: #01FF70;
|
49
|
+
$yellow: #FFDC00;
|
50
|
+
$orange: #FF851B;
|
51
|
+
$red: #FF4136;
|
52
|
+
$fuchsia: #F012BE;
|
53
|
+
$purple: #B10DC9;
|
54
|
+
$maroon: #85144B;
|
55
|
+
|
27
56
|
/*
|
28
57
|
|
29
58
|
Default colors
|
@@ -34,16 +63,29 @@ Default colors
|
|
34
63
|
$link-color: #0066cc
|
35
64
|
$link-color-hover: darken($link-color, 10%)
|
36
65
|
|
37
|
-
|
66
|
+
$placeholder-color: $gray
|
67
|
+
|
68
|
+
$selection-color: $white
|
69
|
+
$selection-bacground: $gray
|
70
|
+
|
71
|
+
$tooltip-color: $white
|
72
|
+
$tooltip-background: rgba(0,0,0,.75)
|
73
|
+
|
74
|
+
Styleguide 29.1
|
38
75
|
|
39
76
|
*/
|
40
77
|
|
41
|
-
$body-color:
|
42
|
-
$text-color:
|
78
|
+
$body-color: $white !default;
|
79
|
+
$text-color: $grayDarker !default;
|
43
80
|
|
44
|
-
$link-color:
|
81
|
+
$link-color: $blue !default;
|
45
82
|
$link-color-hover: darken($link-color, 10) !default;
|
46
83
|
|
47
84
|
$placeholder-color: $gray !default;
|
48
|
-
|
85
|
+
|
86
|
+
$selection-color: $white !default;
|
87
|
+
$selection-background: $teal !default;
|
88
|
+
|
89
|
+
$tooltip-color: $white !default;
|
90
|
+
$tooltip-background: rgba(0,0,0,.75) !default;
|
49
91
|
|
@@ -11,32 +11,35 @@ Enable or disable components, so you can have in the css only what you need.
|
|
11
11
|
$captions: true # components/_captions.scss
|
12
12
|
$close: true # components/_close.scss
|
13
13
|
$dropdowns: true # components/_dropdowns.scss
|
14
|
-
$forms: true # components/_forms.scss
|
15
14
|
$forms-aligned: true # components/_forms.scss
|
16
15
|
$forms-append: true # components/_forms.scss
|
17
16
|
$forms-grid: true # components/_forms.scss
|
18
17
|
$forms-inline: true # components/_forms.scss
|
19
|
-
$
|
18
|
+
$forms: true # components/_forms.scss
|
20
19
|
$grids-helpers: true # components/_grids.scss
|
20
|
+
$grids: true # components/_grids.scss
|
21
21
|
$labels: true # components/_labels.scss
|
22
|
-
$modal: true # components/_modal.scss
|
23
22
|
$modal-buttons: true # components/_modal.scss
|
24
23
|
$modal-thumbs: true # components/_modal.scss
|
25
|
-
$
|
24
|
+
$modal: true # components/_modal.scss
|
26
25
|
$navs: true # components/_navs.scss
|
26
|
+
$offcanvas: true # components/_off-canvas.scss
|
27
|
+
$overlays: true # components/_overlay.scss
|
27
28
|
$pager: true # components/_pager.scss
|
28
29
|
$pagination: true # components/_pagination.scss
|
29
30
|
$slider: true # components/_slider.scss
|
30
31
|
$sprites: true # components/_sprites.scss
|
31
32
|
$tables: true # components/_tables.scss
|
32
33
|
$tabs: true # components/_tabs.scss
|
34
|
+
$tooltips: true # components/_tooltip.scss
|
33
35
|
|
34
36
|
$width-helper-classes: true # "Elements width" helper class
|
35
37
|
|
36
|
-
Styleguide
|
38
|
+
Styleguide 30
|
37
39
|
|
38
40
|
*/
|
39
41
|
|
42
|
+
|
40
43
|
$alerts: true !default;
|
41
44
|
$breadcrumbs: true !default;
|
42
45
|
$button-groups: true !default;
|
@@ -44,30 +47,28 @@ $buttons: true !default;
|
|
44
47
|
$captions: true !default;
|
45
48
|
$close: true !default;
|
46
49
|
$dropdowns: true !default;
|
47
|
-
|
50
|
+
$forms-aligned: true !default;
|
51
|
+
$forms-append: true !default;
|
52
|
+
$forms-grid: true !default;
|
53
|
+
$forms-inline: true !default;
|
48
54
|
$forms: true !default;
|
49
|
-
$forms-append: true !default;
|
50
|
-
$forms-grid: true !default;
|
51
|
-
$forms-aligned: true !default;
|
52
|
-
$forms-inline: true !default;
|
53
|
-
|
54
|
-
$grids: true !default;
|
55
55
|
$grids-helpers: true !default;
|
56
|
-
|
56
|
+
$grids: true !default;
|
57
57
|
$labels: true !default;
|
58
|
-
$
|
58
|
+
$modal-buttons: true !default;
|
59
|
+
$modal-thumbs: true !default;
|
60
|
+
$modal: true !default;
|
59
61
|
$navs: true !default;
|
62
|
+
$offcanvas: true !default;
|
63
|
+
$overlays: true !default;
|
60
64
|
$pager: true !default;
|
61
65
|
$pagination: true !default;
|
66
|
+
$slider: true !default;
|
67
|
+
$sprites: true !default;
|
62
68
|
$tables: true !default;
|
63
|
-
|
64
69
|
$tabs: true !default;
|
65
|
-
$
|
66
|
-
$modal: true !default;
|
67
|
-
$modal-buttons: true !default;
|
68
|
-
$modal-thumbs: true !default;
|
70
|
+
$tooltips: true !default;
|
69
71
|
|
70
|
-
$sprites: true !default;
|
71
72
|
$width-helper-classes: true !default;
|
72
73
|
|
73
74
|
/*
|
@@ -77,7 +78,7 @@ Sprites
|
|
77
78
|
$s-sprite-dimensions: true;
|
78
79
|
$s-layout: smart;
|
79
80
|
|
80
|
-
Styleguide
|
81
|
+
Styleguide 30.1
|
81
82
|
|
82
83
|
*/
|
83
84
|
|
@@ -93,8 +94,7 @@ Icon Fonts ready to use with the mixin `icon-font`.
|
|
93
94
|
Font files are not required, is used the [We Love Icon Fonts](http://weloveiconfonts.com/) CDN.
|
94
95
|
|
95
96
|
|
96
|
-
$use-fontawesome:
|
97
|
-
|
97
|
+
$use-fontawesome: false # http://fortawesome.github.io/Font-Awesome/
|
98
98
|
$use-brandico: false # http://fontello.github.io/brandico.font/demo.html
|
99
99
|
$use-entypo: false # http://www.entypo.com/
|
100
100
|
$use-fontelico: false # https://github.com/fontello/fontelico.font
|
@@ -103,12 +103,11 @@ Font files are not required, is used the [We Love Icon Fonts](http://weloveiconf
|
|
103
103
|
$use-typicons: false # http://typicons.com/
|
104
104
|
$use-zocial: false # http://zocial.smcllns.com/
|
105
105
|
|
106
|
-
Styleguide
|
106
|
+
Styleguide 30.2
|
107
107
|
|
108
108
|
*/
|
109
109
|
|
110
|
-
$use-fontawesome:
|
111
|
-
|
110
|
+
$use-fontawesome: false !default;
|
112
111
|
$use-brandico: false !default;
|
113
112
|
$use-entypo: false !default;
|
114
113
|
$use-fontelico: false !default;
|
@@ -5,14 +5,13 @@ Base Dimensions
|
|
5
5
|
$base-border-radius: 4px # Border radius used as a standard on all elements.
|
6
6
|
$horizontal-offset: 180px # Labels width in horizontal forms.
|
7
7
|
|
8
|
-
Styleguide
|
8
|
+
Styleguide 31
|
9
9
|
|
10
10
|
*/
|
11
11
|
|
12
12
|
|
13
13
|
$base-border-radius: 4px !default;
|
14
14
|
$horizontal-offset: 180px !default;
|
15
|
-
$dropdowns-with: 160px !default;
|
16
15
|
|
17
16
|
/*
|
18
17
|
|
@@ -35,7 +34,7 @@ Font sizes you can used with the compass mixin `adjust-font-size-to()`. Naming c
|
|
35
34
|
$smaller-size: $base-font-size * .7 # 10px
|
36
35
|
$smallest-size: $base-font-size * .5 # 7px
|
37
36
|
|
38
|
-
Styleguide
|
37
|
+
Styleguide 31.1
|
39
38
|
|
40
39
|
*/
|
41
40
|
|
@@ -78,7 +77,7 @@ These values mean: n times the base line-height.
|
|
78
77
|
$h5-line-height: 1.5
|
79
78
|
$h6-line-height: 1.5
|
80
79
|
|
81
|
-
Styleguide
|
80
|
+
Styleguide 31.1.1
|
82
81
|
|
83
82
|
*/
|
84
83
|
|
@@ -102,7 +101,7 @@ Base padding and margins used in the forms.
|
|
102
101
|
$input-padding-side: 10px # Base side padding
|
103
102
|
$checkbox-padding-left: 20px # Side padding used for checkboxes and radios
|
104
103
|
|
105
|
-
Styleguide
|
104
|
+
Styleguide 31.2
|
106
105
|
|
107
106
|
*/
|
108
107
|
|
@@ -149,8 +148,10 @@ Components
|
|
149
148
|
$tables-padding: $input-padding # Tables padding
|
150
149
|
$tabs-content-padding: $input-padding # Tabs padding
|
151
150
|
$tabs-tab-padding: $input-padding # Tabs padding
|
151
|
+
$tooltips-padding: $input-padding # Tooltips padding
|
152
152
|
|
153
|
-
|
153
|
+
|
154
|
+
Styleguide 31.3
|
154
155
|
|
155
156
|
*/
|
156
157
|
|
@@ -176,6 +177,7 @@ $pills-padding: .15em .35em
|
|
176
177
|
$tables-padding: $input-padding !default;
|
177
178
|
$tabs-content-padding: $input-padding !default;
|
178
179
|
$tabs-tab-padding: $input-padding !default;
|
180
|
+
$tooltips-padding: $input-padding !default;
|
179
181
|
|
180
182
|
|
181
183
|
/*
|
@@ -185,14 +187,30 @@ Sizes
|
|
185
187
|
$loader-ico-size: 44px # Icon size of the loader used with some componets
|
186
188
|
$modal-btn-size: em(30px) # Size of buttons used with the modals
|
187
189
|
$slider-btn-size: em(30px) # Size of buttons used with the sliders
|
190
|
+
$tooltip-triangle-size: em(15px) # Size the tooltip's triangle
|
188
191
|
|
189
|
-
Styleguide
|
192
|
+
Styleguide 31.4
|
190
193
|
|
191
194
|
*/
|
192
195
|
|
193
196
|
$loader-ico-size: 44px !default;
|
194
197
|
$modal-btn-size: em(30px) !default;
|
195
198
|
$slider-btn-size: em(30px) !default;
|
199
|
+
$tooltip-triangle-size: em(14px) !default;
|
200
|
+
|
201
|
+
/*
|
202
|
+
|
203
|
+
Widths
|
204
|
+
|
205
|
+
$dropdowns-width: 160px # max-width of dropdowns
|
206
|
+
$tooltips-width: 200px # max-width of tooltips
|
207
|
+
|
208
|
+
Styleguide 31.5
|
209
|
+
|
210
|
+
*/
|
211
|
+
|
212
|
+
$dropdowns-width: 160px !default;
|
213
|
+
$tooltips-width: 200px !default;
|
196
214
|
|
197
215
|
|
198
216
|
/*
|
@@ -201,14 +219,14 @@ Heights
|
|
201
219
|
|
202
220
|
Some elements need to have a max-height specified for smoother animations, like dropdowns:
|
203
221
|
|
204
|
-
$dropdowns-height:
|
222
|
+
$dropdowns-height: 600px
|
205
223
|
|
206
|
-
Styleguide
|
224
|
+
Styleguide 31.6
|
207
225
|
|
208
226
|
*/
|
209
227
|
|
210
228
|
|
211
|
-
$dropdowns-height:
|
229
|
+
$dropdowns-height: 600px !default;
|
212
230
|
|
213
231
|
/*
|
214
232
|
|
@@ -216,11 +234,11 @@ Media Queries
|
|
216
234
|
|
217
235
|
Set the width of the three steps of the layout.
|
218
236
|
|
219
|
-
$lap-start: 481px
|
220
|
-
$desk-start: 768px
|
221
|
-
$desk-end: 1080px
|
237
|
+
$lap-start: 481px # Max width of smartphone
|
238
|
+
$desk-start: 768px # Max width for tablet
|
239
|
+
$desk-end: 1080px # Max width for desktop
|
222
240
|
|
223
|
-
Styleguide
|
241
|
+
Styleguide 31.7
|
224
242
|
|
225
243
|
*/
|
226
244
|
|
@@ -243,7 +261,7 @@ Default settings for susy grid. More info: [Susy](http://susy.oddbird.net/).
|
|
243
261
|
$gutter-width: 30px # Gutter width
|
244
262
|
$container-style: fluid # Grid style
|
245
263
|
|
246
|
-
Styleguide
|
264
|
+
Styleguide 31.8
|
247
265
|
|
248
266
|
*/
|
249
267
|
|
@@ -285,7 +303,7 @@ Default settings for overlay components, taken from Bootstrap.
|
|
285
303
|
$zindex-slider: 1040 # Sliders
|
286
304
|
$zindex-modal: 1050 # Modals
|
287
305
|
|
288
|
-
Styleguide
|
306
|
+
Styleguide 31.9
|
289
307
|
|
290
308
|
*/
|
291
309
|
|
@@ -6,34 +6,35 @@ These are the default settings for all animations and transitions within the fra
|
|
6
6
|
|
7
7
|
By default all animations but fadeIn and fadeOut are disabled, use the ```$animations``` list to enable/disable them.
|
8
8
|
|
9
|
-
$animations:
|
9
|
+
$animations: fadeIn, fadeOut, fadeInDown, fadeOutUp
|
10
10
|
|
11
11
|
If true it generate a placeholder class for every animation with the default settings to use as an ````@extend```.
|
12
12
|
|
13
|
-
$animations-classes:
|
13
|
+
$animations-classes: true
|
14
14
|
|
15
15
|
Base settings for animations
|
16
16
|
|
17
|
-
$animations-duration:
|
18
|
-
$animations-delay:
|
19
|
-
$animations-function:
|
20
|
-
$animations-mode:
|
17
|
+
$animations-duration: .50s # Duration
|
18
|
+
$animations-delay: 0s # Start delay
|
19
|
+
$animations-function: ease-out # Easing
|
20
|
+
$animations-mode: both # animation-fill-mode
|
21
21
|
|
22
22
|
For transitions you can use other settings for duration and easing, by default the use the same settings as the animations.
|
23
23
|
|
24
|
-
$default-transition-duration:
|
25
|
-
$default-transition-function:
|
24
|
+
$default-transition-duration: .15s
|
25
|
+
$default-transition-function: $animations-function
|
26
26
|
|
27
27
|
Durations specifics for some modules.
|
28
28
|
|
29
29
|
$caption-animations-duration: .50s
|
30
|
+
$offcanvas-animations-duration: .40s
|
31
|
+
$tooltip-transition-duration: .25s
|
30
32
|
|
31
|
-
|
32
|
-
Styleguide 21.1
|
33
|
+
Styleguide 24.1
|
33
34
|
|
34
35
|
*/
|
35
36
|
|
36
|
-
$animations: fadeIn, fadeOut
|
37
|
+
$animations: fadeIn, fadeOut, fadeInDown, fadeOutUp !default;
|
37
38
|
$animations-classes: true !default;
|
38
39
|
|
39
40
|
$animations-duration: .50s !default;
|
@@ -46,3 +47,4 @@ $default-transition-function: toBezier($animations-function)
|
|
46
47
|
|
47
48
|
$caption-animations-duration: .50s !default;
|
48
49
|
$offcanvas-animations-duration: .40s !default;
|
50
|
+
$tooltip-transition-duration: .25s !default;
|
@@ -12,7 +12,7 @@ All the animations in [theCSSguru](https://twitter.com/theCSSguru)'s [Animate mi
|
|
12
12
|
* **Rotating entrances:** rotateIn, rotateInDownLeft, rotateInDownRight, rotateInUpLeft, rotateInUpRight
|
13
13
|
* **Rotating exits:** rotateOut, rotateOutDownLeft, rotateOutDownRight, rotateOutUpLeft, rotateOutUpRight
|
14
14
|
|
15
|
-
Styleguide
|
15
|
+
Styleguide 24
|
16
16
|
|
17
17
|
*/
|
18
18
|
|
@@ -119,7 +119,7 @@ Example:
|
|
119
119
|
|
120
120
|
@extend .fadeIn;
|
121
121
|
|
122
|
-
Styleguide
|
122
|
+
Styleguide 24.3
|
123
123
|
|
124
124
|
*/
|
125
125
|
|
@@ -143,7 +143,7 @@ Example:
|
|
143
143
|
|
144
144
|
@extend .delay-50;
|
145
145
|
|
146
|
-
Styleguide
|
146
|
+
Styleguide 24.4
|
147
147
|
|
148
148
|
*/
|
149
149
|
|
@@ -180,7 +180,7 @@ Example:
|
|
180
180
|
</section>
|
181
181
|
|
182
182
|
|
183
|
-
Styleguide
|
183
|
+
Styleguide 24.5
|
184
184
|
|
185
185
|
*/
|
186
186
|
|
@@ -195,7 +195,7 @@ Animation mixin
|
|
195
195
|
Also available is an "animate" mixin, for more information see the Mixins
|
196
196
|
section.
|
197
197
|
|
198
|
-
Styleguide
|
198
|
+
Styleguide 24.6
|
199
199
|
|
200
200
|
*/
|
201
201
|
|
@@ -8,7 +8,7 @@ and finding errors. Taken form [Inuit](https://github.com/csswizardry/inuit.css)
|
|
8
8
|
|
9
9
|
Enable it with `$debug-html: true;`.
|
10
10
|
|
11
|
-
Styleguide
|
11
|
+
Styleguide 23
|
12
12
|
|
13
13
|
*/
|
14
14
|
|
@@ -81,7 +81,7 @@ Taken form [Pesticide](https://github.com/mrmrs/pesticide).
|
|
81
81
|
|
82
82
|
Enable it with `$debug-outlines: true;`.
|
83
83
|
|
84
|
-
Styleguide
|
84
|
+
Styleguide 23.1
|
85
85
|
|
86
86
|
*/
|
87
87
|
|
@@ -4,7 +4,7 @@ Helper Classes
|
|
4
4
|
|
5
5
|
There are provided some helper classes usually used with `@extend` for applying effects or common styles.
|
6
6
|
|
7
|
-
Styleguide
|
7
|
+
Styleguide 25
|
8
8
|
|
9
9
|
*/
|
10
10
|
|
@@ -20,7 +20,7 @@ Simple divider class used in some components (like dropdowns).
|
|
20
20
|
|
21
21
|
.divider
|
22
22
|
|
23
|
-
Styleguide
|
23
|
+
Styleguide 25.1
|
24
24
|
|
25
25
|
*/
|
26
26
|
|
@@ -54,7 +54,7 @@ Same a `.wrapper` but with fixed width.
|
|
54
54
|
.fixed-wrapper
|
55
55
|
.fw
|
56
56
|
|
57
|
-
Styleguide
|
57
|
+
Styleguide 25.2
|
58
58
|
|
59
59
|
*/
|
60
60
|
|
@@ -95,7 +95,7 @@ Corrispond to:
|
|
95
95
|
|
96
96
|
width: 50% !important;
|
97
97
|
|
98
|
-
Styleguide
|
98
|
+
Styleguide 25.3
|
99
99
|
|
100
100
|
*/
|
101
101
|
|
@@ -124,7 +124,7 @@ Some common classes for fixing the typography, to be used sparingly.
|
|
124
124
|
.text-right # text-align: right
|
125
125
|
.text-center # text-align: center
|
126
126
|
|
127
|
-
Styleguide
|
127
|
+
Styleguide 25.4
|
128
128
|
|
129
129
|
*/
|
130
130
|
|
@@ -146,21 +146,18 @@ Simple class used for spriting.
|
|
146
146
|
|
147
147
|
.s
|
148
148
|
|
149
|
-
Styleguide
|
149
|
+
Styleguide 25.5
|
150
150
|
|
151
151
|
*/
|
152
152
|
|
153
153
|
.s {
|
154
154
|
@include transition(none);
|
155
155
|
content: "";
|
156
|
-
|
156
|
+
@include inline-block;
|
157
157
|
font-style:normal;
|
158
158
|
overflow:hidden;
|
159
159
|
text-align:center;
|
160
160
|
text-indent:-9999px;
|
161
|
-
vertical-align:middle;
|
162
|
-
zoom:1;
|
163
|
-
|
164
161
|
}
|
165
162
|
|
166
163
|
/*
|
@@ -176,7 +173,7 @@ All the text replacement classes from from [html5boilerplate](http://html5boiler
|
|
176
173
|
.visuallyhidden
|
177
174
|
.invisible
|
178
175
|
|
179
|
-
Styleguide
|
176
|
+
Styleguide 25.6
|
180
177
|
|
181
178
|
*/
|
182
179
|
|