rapido-css 0.1.1 → 0.1.2

Sign up to get free protection for your applications and to get access to all the features.
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