rapido-css 0.1.1 → 0.1.2

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.
Files changed (46) hide show
  1. data/stylesheets/_default-styles.scss +352 -352
  2. data/stylesheets/_functions.scss +77 -50
  3. data/stylesheets/_susy.scss +15 -12
  4. data/stylesheets/components/_alerts.scss +21 -21
  5. data/stylesheets/components/_breadcrumbs.scss +15 -15
  6. data/stylesheets/components/_button-groups.scss +51 -53
  7. data/stylesheets/components/_buttons.scss +94 -97
  8. data/stylesheets/components/_captions.scss +45 -45
  9. data/stylesheets/components/_close.scss +27 -27
  10. data/stylesheets/components/_dropdowns.scss +121 -121
  11. data/stylesheets/components/_forms.scss +246 -248
  12. data/stylesheets/components/_grids.scss +35 -35
  13. data/stylesheets/components/_labels.scss +38 -38
  14. data/stylesheets/components/_modals.scss +242 -248
  15. data/stylesheets/components/_navs.scss +86 -91
  16. data/stylesheets/components/_pager.scss +53 -53
  17. data/stylesheets/components/_pagination.scss +83 -85
  18. data/stylesheets/components/_responsive-navs.scss +84 -84
  19. data/stylesheets/components/_sliders.scss +54 -58
  20. data/stylesheets/components/_tables.scss +69 -74
  21. data/stylesheets/components/_tabs.scss +54 -54
  22. data/stylesheets/components/_type.scss +134 -140
  23. data/stylesheets/{_rapido.scss → rapido.scss} +0 -8
  24. data/stylesheets/settings/_base.scss +23 -23
  25. data/stylesheets/settings/_colors.scss +13 -13
  26. data/stylesheets/settings/_components.scss +43 -42
  27. data/stylesheets/settings/_dimensions.scss +91 -91
  28. data/stylesheets/settings/_effects.scss +28 -14
  29. data/stylesheets/susy/{_susy_background.scss → _background.scss} +0 -0
  30. data/stylesheets/susy/{_susy_functions.scss → _functions.scss} +0 -0
  31. data/stylesheets/susy/{_susy_grid.scss → _grid.scss} +0 -0
  32. data/stylesheets/susy/{_susy_isolation.scss → _isolation.scss} +1 -0
  33. data/stylesheets/susy/{_susy_margin.scss → _margin.scss} +0 -0
  34. data/stylesheets/susy/{_susy_media.scss → _media.scss} +0 -0
  35. data/stylesheets/susy/{_susy_padding.scss → _padding.scss} +0 -0
  36. data/stylesheets/susy/{_susy_settings.scss → _settings.scss} +0 -0
  37. data/stylesheets/susy/{_susy_support.scss → _support.scss} +0 -0
  38. data/stylesheets/susy/{_susy_units.scss → _units.scss} +0 -0
  39. data/stylesheets/utilities/_animations.scss +638 -597
  40. data/stylesheets/utilities/_debug.scss +43 -43
  41. data/stylesheets/utilities/_helper-classes.scss +70 -54
  42. data/stylesheets/utilities/_icon-fonts.scss +90 -90
  43. data/stylesheets/utilities/_mixins.scss +390 -357
  44. metadata +20 -17
  45. checksums.yaml +0 -15
  46. data/stylesheets/config.rb +0 -8
data/stylesheets/settings/_components.scss CHANGED
@@ -1,4 +1,4 @@
1
- /* ====================================================================================================================
1
+ /*
2
2
 
3
3
  Base Components
4
4
 
@@ -35,63 +35,64 @@ Enable or disable components, so you can have in the css only what you need.
35
35
 
36
36
  Styleguide 27
37
37
 
38
- ==================================================================================================================== */
38
+ */
39
39
 
40
- $alerts: true !default;
41
- $breadcrumbs: true !default;
42
- $button-groups: true !default;
43
- $buttons: true !default;
44
- $captions: true !default;
45
- $close: true !default;
46
- $dropdowns: true !default;
40
+ $alerts: true !default;
41
+ $breadcrumbs: true !default;
42
+ $button-groups: true !default;
43
+ $buttons: true !default;
44
+ $captions: true !default;
45
+ $close: true !default;
46
+ $dropdowns: true !default;
47
47
 
48
- $forms: true !default;
49
- $forms-append: true !default;
50
- $forms-grid: true !default;
51
- $forms-aligned: true !default;
52
- $forms-inline: true !default;
48
+ $forms: true !default;
49
+ $forms-append: true !default;
50
+ $forms-grid: true !default;
51
+ $forms-aligned: true !default;
52
+ $forms-inline: true !default;
53
53
 
54
54
  $grids: true !default;
55
- $grids-helpers: true !default;
55
+ $grids-helpers: true !default;
56
56
 
57
- $labels: true !default;
58
- $navs-responsive: true !default;
59
- $navs: true !default;
60
- $pager: true !default;
61
- $pagination: true !default;
62
- $tables: true !default;
57
+ $labels: true !default;
58
+ $navs-responsive: true !default;
59
+ $navs: true !default;
60
+ $pager: true !default;
61
+ $pagination: true !default;
62
+ $tables: true !default;
63
63
 
64
- $tabs: true !default;
65
- $slider: true !default;
66
- $modal: true !default;
67
- $modal-buttons: true !default;
68
- $modal-thumbs: true !default;
64
+ $tabs: true !default;
65
+ $slider: true !default;
66
+ $modal: true !default;
67
+ $modal-buttons: true !default;
68
+ $modal-thumbs: true !default;
69
69
 
70
- $sprites: true !default;
71
- $width-helper-classes: true !default;
70
+ $sprites: true !default;
71
+ $width-helper-classes: true !default;
72
72
 
73
- /* --------------------------------------------------------------------------------------------------------------------
73
+ /*
74
74
 
75
75
  Sprites
76
76
 
77
77
  $s-sprite-dimensions: true;
78
78
  $s-layout: smart;
79
79
 
80
- Styleguide 22.5
80
+ Styleguide 27.1
81
81
 
82
- -------------------------------------------------------------------------------------------------------------------- */
82
+ */
83
83
 
84
84
  $s-sprite-dimensions: true !default;
85
85
  $s-layout: smart !default;
86
86
 
87
87
 
88
- /* --------------------------------------------------------------------------------------------------------------------
88
+ /*
89
89
 
90
90
  Icon Fonts
91
91
 
92
92
  Icon Fonts ready to use with the mixin `icon-font`.
93
93
  Font files are not required, is used the [We Love Icon Fonts](http://weloveiconfonts.com/) CDN.
94
94
 
95
+
95
96
  $use-fontawesome: true # http://fortawesome.github.io/Font-Awesome/
96
97
 
97
98
  $use-brandico: false # http://fontello.github.io/brandico.font/demo.html
@@ -102,16 +103,16 @@ Font files are not required, is used the [We Love Icon Fonts](http://weloveiconf
102
103
  $use-typicons: false # http://typicons.com/
103
104
  $use-zocial: false # http://zocial.smcllns.com/
104
105
 
105
- Styleguide 27.1
106
+ Styleguide 27.2
106
107
 
107
- -------------------------------------------------------------------------------------------------------------------- */
108
+ */
108
109
 
109
- $use-fontawesome: true !default;
110
+ $use-fontawesome: true !default;
110
111
 
111
- $use-brandico: false !default;
112
- $use-entypo: false !default;
113
- $use-fontelico: false !default;
114
- $use-maki: false !default;
115
- $use-openweb-icons: false !default;
116
- $use-typicons: false !default;
117
- $use-zocial: false !default;
112
+ $use-brandico: false !default;
113
+ $use-entypo: false !default;
114
+ $use-fontelico: false !default;
115
+ $use-maki: false !default;
116
+ $use-openweb-icons: false !default;
117
+ $use-typicons: false !default;
118
+ $use-zocial: false !default;
data/stylesheets/settings/_dimensions.scss CHANGED
@@ -1,4 +1,4 @@
1
- /* ====================================================================================================================
1
+ /*
2
2
 
3
3
  Base Dimensions
4
4
 
@@ -7,14 +7,14 @@ Base Dimensions
7
7
 
8
8
  Styleguide 28
9
9
 
10
- ==================================================================================================================== */
10
+ */
11
11
 
12
12
 
13
- $base-border-radius: 4px !default;
14
- $horizontal-offset: 180px !default;
15
- $dropdowns-with: 160px !default;
13
+ $base-border-radius: 4px !default;
14
+ $horizontal-offset: 180px !default;
15
+ $dropdowns-with: 160px !default;
16
16
 
17
- /* --------------------------------------------------------------------------------------------------------------------
17
+ /*
18
18
 
19
19
  Text Size
20
20
 
@@ -36,27 +36,27 @@ Font sizes you can used with the compass mixin `adjust-font-size-to()`. Naming c
36
36
 
37
37
  Styleguide 28.1
38
38
 
39
- -------------------------------------------------------------------------------------------------------------------- */
39
+ */
40
40
 
41
- $giga-size: $base-font-size * 7 !default;
42
- $mega-size: $base-font-size * 5 !default;
43
- $kilo-size: $base-font-size * 3.5 !default;
41
+ $giga-size: $base-font-size * 7 !default;
42
+ $mega-size: $base-font-size * 5 !default;
43
+ $kilo-size: $base-font-size * 3.5 !default;
44
44
 
45
- $h1-size: $base-font-size * 2.5 !default;
46
- $h2-size: $base-font-size * 2 !default;
47
- $h3-size: $base-font-size * 1.85 !default;
48
- $h4-size: $base-font-size * 1.5 !default;
49
- $h5-size: $base-font-size * 1.25 !default;
50
- $h6-size: $base-font-size * 1 !default;
45
+ $h1-size: $base-font-size * 2.5 !default;
46
+ $h2-size: $base-font-size * 2 !default;
47
+ $h3-size: $base-font-size * 1.85 !default;
48
+ $h4-size: $base-font-size * 1.5 !default;
49
+ $h5-size: $base-font-size * 1.25 !default;
50
+ $h6-size: $base-font-size * 1 !default;
51
51
 
52
- $milli-size: $base-font-size * .85 !default;
53
- $micro-size: $base-font-size * .7 !default;
52
+ $milli-size: $base-font-size * .85 !default;
53
+ $micro-size: $base-font-size * .7 !default;
54
54
 
55
55
  $small-size: $milli-size !default;
56
56
  $smaller-size: $micro-size !default;
57
57
 
58
58
 
59
- /* --------------------------------------------------------------------------------------------------------------------
59
+ /*
60
60
 
61
61
  Line-Height
62
62
 
@@ -74,16 +74,16 @@ These values mean: X times the base line-height.
74
74
 
75
75
  Styleguide 28.1.1
76
76
 
77
- -------------------------------------------------------------------------------------------------------------------- */
77
+ */
78
78
 
79
- $h1-line-height: 2 !default;
80
- $h2-line-height: 2 !default;
81
- $h3-line-height: 2 !default;
82
- $h4-line-height: 1.5 !default;
83
- $h5-line-height: 1.5 !default;
84
- $h6-line-height: 1.5 !default;
79
+ $h1-line-height: 2 !default;
80
+ $h2-line-height: 2 !default;
81
+ $h3-line-height: 2 !default;
82
+ $h4-line-height: 1.5 !default;
83
+ $h5-line-height: 1.5 !default;
84
+ $h6-line-height: 1.5 !default;
85
85
 
86
- /* --------------------------------------------------------------------------------------------------------------------
86
+ /*
87
87
 
88
88
  Forms
89
89
 
@@ -98,22 +98,22 @@ Base padding and margins used in the forms.
98
98
 
99
99
  Styleguide 28.2
100
100
 
101
- -------------------------------------------------------------------------------------------------------------------- */
101
+ */
102
102
 
103
- $control-margin-bottom: $base-line-height !default;
104
- $label-margin-bottom: 10px !default;
105
- $input-border: 1px !default;
106
- $input-padding-top: 10px !default;
107
- $input-padding-side: 10px !default;
108
- $checkbox-padding-left: 20px !default;
103
+ $control-margin-bottom: $base-line-height !default;
104
+ $label-margin-bottom: 10px !default;
105
+ $input-border: 1px !default;
106
+ $input-padding-top: 10px !default;
107
+ $input-padding-side: 10px !default;
108
+ $checkbox-padding-left: 20px !default;
109
109
 
110
110
  // Do · not · edit
111
- $input-padding: em($input-padding-top) em($input-padding-side) ;
112
- $input-height: em($base-font-size + ($input-padding-top * 2) + ($input-border * 2)) ;
113
- $control-min-height: em($base-line-height + $label-margin-bottom) + $input-height - em(5px) ;
111
+ $input-padding: em($input-padding-top) em($input-padding-side) ;
112
+ $input-height: em($base-font-size + ($input-padding-top * 2) + ($input-border * 2)) ;
113
+ $control-min-height: em($base-line-height + $label-margin-bottom) + $input-height - em(5px) ;
114
114
 
115
115
 
116
- /* --------------------------------------------------------------------------------------------------------------------
116
+ /*
117
117
 
118
118
  Paddings
119
119
 
@@ -146,33 +146,33 @@ Components
146
146
 
147
147
  Styleguide 28.3
148
148
 
149
- -------------------------------------------------------------------------------------------------------------------- */
149
+ */
150
150
 
151
151
 
152
152
  // Helper classes
153
- $wrapper-padding: em(20px) !default;
153
+ $wrapper-padding: em(20px) !default;
154
154
 
155
155
  // Buttons
156
- $btn-padding: $input-padding !default;
157
- $btn-large-padding: em($input-padding-top * 1) em($input-padding-side * 1.5) !default;
158
- $btn-small-padding: em($input-padding-top * .5) em($input-padding-side * .8) !default;
159
- $btn-mini-padding: em($input-padding-top * .1) em($input-padding-side * .6) !default;
156
+ $btn-padding: $input-padding !default;
157
+ $btn-large-padding: em($input-padding-top * 1) em($input-padding-side * 1.5) !default;
158
+ $btn-small-padding: em($input-padding-top * .5) em($input-padding-side * .8) !default;
159
+ $btn-mini-padding: em($input-padding-top * .1) em($input-padding-side * .6) !default;
160
160
 
161
161
  // Components
162
- $alerts-padding: $input-padding !default;
163
- $captions-padding: $input-padding !default;
164
- $dropdowns-padding: $input-padding !default;
165
- $modals-error-padding: $input-padding !default;
166
- $navs-padding: $input-padding !default;
167
- $pager-padding: $input-padding !default;
168
- $pagination-padding: $input-padding !default;
169
- $pills-padding: .15em .35em !default;
170
- $tables-padding: $input-padding !default;
171
- $tabs-content-padding: $input-padding !default;
172
- $tabs-tab-padding: $input-padding !default;
162
+ $alerts-padding: $input-padding !default;
163
+ $captions-padding: $input-padding !default;
164
+ $dropdowns-padding: $input-padding !default;
165
+ $modals-error-padding: $input-padding !default;
166
+ $navs-padding: $input-padding !default;
167
+ $pager-padding: $input-padding !default;
168
+ $pagination-padding: $input-padding !default;
169
+ $pills-padding: .15em .35em !default;
170
+ $tables-padding: $input-padding !default;
171
+ $tabs-content-padding: $input-padding !default;
172
+ $tabs-tab-padding: $input-padding !default;
173
173
 
174
174
 
175
- /* --------------------------------------------------------------------------------------------------------------------
175
+ /*
176
176
 
177
177
  Sizes
178
178
 
@@ -182,14 +182,14 @@ Sizes
182
182
 
183
183
  Styleguide 28.4
184
184
 
185
- -------------------------------------------------------------------------------------------------------------------- */
185
+ */
186
186
 
187
- $loader-ico-size: 44px !default;
188
- $modal-btn-size: em(30px) !default;
189
- $slider-btn-size: em(30px) !default;
187
+ $loader-ico-size: 44px !default;
188
+ $modal-btn-size: em(30px) !default;
189
+ $slider-btn-size: em(30px) !default;
190
190
 
191
191
 
192
- /* --------------------------------------------------------------------------------------------------------------------
192
+ /*
193
193
 
194
194
  Heights
195
195
 
@@ -199,12 +199,12 @@ Some elements need to have a max-height specified for smoother animations, like
199
199
 
200
200
  Styleguide 28.5
201
201
 
202
- -------------------------------------------------------------------------------------------------------------------- */
202
+ */
203
203
 
204
204
 
205
- $dropdowns-height: em(600px) !default;
205
+ $dropdowns-height: em(600px) !default;
206
206
 
207
- /* --------------------------------------------------------------------------------------------------------------------
207
+ /*
208
208
 
209
209
  Media Queries
210
210
 
@@ -216,17 +216,17 @@ Set the width of the three steps of the layout.
216
216
 
217
217
  Styleguide 28.6
218
218
 
219
- -------------------------------------------------------------------------------------------------------------------- */
219
+ */
220
220
 
221
221
 
222
- $lap-start: 481px !default;
223
- $desk-start: 768px !default;
224
- $desk-end: 1080px !default;
222
+ $lap-start: 481px !default;
223
+ $desk-start: 768px !default;
224
+ $desk-end: 1080px !default;
225
225
 
226
- $palm-end: $lap-start - 1px;
227
- $lap-end: $desk-start - 1px;
226
+ $palm-end: $lap-start - 1px;
227
+ $lap-end: $desk-start - 1px;
228
228
 
229
- /* --------------------------------------------------------------------------------------------------------------------
229
+ /*
230
230
 
231
231
  Grid (Susy)
232
232
 
@@ -239,15 +239,15 @@ Default settings for susy grid. More info: [Susy](http://susy.oddbird.net/).
239
239
 
240
240
  Styleguide 28.7
241
241
 
242
- -------------------------------------------------------------------------------------------------------------------- */
242
+ */
243
243
 
244
244
 
245
- $total-columns: 12 !default;
246
- $column-width: 50px !default;
247
- $gutter-width: 30px !default;
248
- $container-style: fluid !default;
245
+ $total-columns: 12 !default;
246
+ $column-width: 50px !default;
247
+ $gutter-width: 30px !default;
248
+ $container-style: fluid !default;
249
249
 
250
- /* --------------------------------------------------------------------------------------------------------------------
250
+ /*
251
251
 
252
252
  Nav Responsive Options
253
253
 
@@ -261,17 +261,17 @@ Nav Responsive Options
261
261
 
262
262
  Styleguide 28.8
263
263
 
264
- -------------------------------------------------------------------------------------------------------------------- */
264
+ */
265
265
 
266
- $navs-responsive-breakpoint: palm !default;
267
- $navs-responsive-type: slide !default;
268
- $navs-responsive-dropdown-pos: right !default;
269
- $navs-responsive-offset: 70% !default;
266
+ $navs-responsive-breakpoint: palm !default;
267
+ $navs-responsive-type: slide !default;
268
+ $navs-responsive-dropdown-pos: right !default;
269
+ $navs-responsive-offset: 70% !default;
270
270
 
271
- $navs-responsive-outside-wrapper: '.external-wrapper' !default;
272
- $navs-responsive-inside-wrapper: '.internal-wrapper' !default;
271
+ $navs-responsive-outside-wrapper: '.external-wrapper' !default;
272
+ $navs-responsive-inside-wrapper: '.internal-wrapper' !default;
273
273
 
274
- /* --------------------------------------------------------------------------------------------------------------------
274
+ /*
275
275
 
276
276
  Z-index
277
277
 
@@ -285,11 +285,11 @@ Default settings for overlay components, taken from Bootstrap.
285
285
 
286
286
  Styleguide 28.9
287
287
 
288
- -------------------------------------------------------------------------------------------------------------------- */
288
+ */
289
289
 
290
290
 
291
- $zindex-dropdown: 1000 !default;
292
- $zindex-popover: 1010 !default;
293
- $zindex-tooltip: 1030 !default;
294
- $zindex-slider: 1040 !default;
295
- $zindex-modal: 1050 !default;
291
+ $zindex-dropdown: 1000 !default;
292
+ $zindex-popover: 1010 !default;
293
+ $zindex-tooltip: 1030 !default;
294
+ $zindex-slider: 1040 !default;
295
+ $zindex-modal: 1050 !default;
data/stylesheets/settings/_effects.scss CHANGED
@@ -1,26 +1,40 @@
1
- // Effects
2
- //
1
+ /*
3
2
 
3
+ Settings
4
4
 
5
+ These are the default settings for all animations and transitions within the framework.
5
6
 
6
- // ANIMATIONS w/ @include animate(...)
7
- //
7
+ By default all animations but fadeIn and fadeOut are disabled, use the ```$animations``` list to enable/disable them.
8
8
 
9
+ $animations: fadeIn, fadeOut
9
10
 
11
+ If true it generate a placeholder class for every animation with the default settings to use as an ````@extend```.
10
12
 
11
- $animations: fadeIn, fadeOut !default;
12
- $animations-classes: true !default;
13
+ $animations-classes: true
13
14
 
14
- $animations-duration: .15s !default;
15
- $animations-delay: 0s !default;
16
- $animations-function: ease-out !default;
17
- $animations-mode: both !default;
15
+ Base settings for animations
18
16
 
17
+ $animations-duration: .15s # Duration
18
+ $animations-delay: 0s # Start delay
19
+ $animations-function: ease-out # Easing
20
+ $animations-mode: both # animation-fill-mode
19
21
 
20
- // Transitions w/ @include transition(...)
21
- //
22
+ For transitions you can use other settings for duration and easing, by default the use the same settings as the animations.
22
23
 
24
+ $default-transition-duration: $animations-duration
25
+ $default-transition-function: $animations-function
23
26
 
27
+ Styleguide 20.1
24
28
 
25
- $default-transition-duration: $animations-duration !default;
26
- $default-transition-function: toBezier($animations-function) !default;
29
+ */
30
+
31
+ $animations: fadeIn, fadeOut !default;
32
+ $animations-classes: true !default;
33
+
34
+ $animations-duration: .15s !default;
35
+ $animations-delay: null !default;
36
+ $animations-function: ease-out !default;
37
+ $animations-mode: both !default;
38
+
39
+ $default-transition-duration: $animations-duration !default;
40
+ $default-transition-function: toBezier($animations-function) !default;
data/stylesheets/susy/{_susy_grid.scss → _grid.scss} RENAMED
File without changes
data/stylesheets/susy/{_susy_isolation.scss → _isolation.scss} RENAMED
@@ -42,6 +42,7 @@
42
42
  &:#{format-nth($nth,$selector)} {
43
43
  margin-#{$from}: space($location - 1, $context, $style);
44
44
  @if $location == 1 { clear: $from; }
45
+ @else { clear: none; }
45
46
 
46
47
  $location: $location + $columns;
47
48
  @if $location > $context { $location: 1; }
data/stylesheets/susy/{_susy_media.scss → _media.scss} RENAMED
File without changes
data/stylesheets/susy/{_susy_units.scss → _units.scss} RENAMED
File without changes