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/components/_modals.scss CHANGED
@@ -1,4 +1,4 @@
1
- /* ====================================================================================================================
1
+ /*
2
2
 
3
3
  Modals
4
4
 
@@ -16,231 +16,225 @@ Markup:
16
16
  });
17
17
  </script>
18
18
 
19
- Styleguide 11.
19
+ Styleguide 11
20
20
 
21
- ==================================================================================================================== */
21
+ */
22
22
 
23
23
  .modal { display: none; }
24
24
 
25
25
  @if $modal {
26
26
 
27
27
  // Resets
28
- // --------------------------------------------------------------------------------------------------------------------
29
-
30
- %modal-reset {
31
- padding: 0;
32
- margin: 0;
33
- border: 0;
34
- vertical-align: top;
35
- list-style-type: none;
36
- }
37
-
38
- .fancybox-wrap,
39
- .fancybox-wrap iframe,
40
- .fancybox-wrap object,
41
- .fancybox-skin,
42
- .fancybox-outer,
43
- .fancybox-inner,
44
- .fancybox-image,
45
- .fancybox-nav span,
46
- .fancybox-tmp {
47
- @extend %modal-reset;
48
- }
28
+
29
+ %modal-reset {
30
+ padding: 0;
31
+ margin: 0;
32
+ border: 0;
33
+ vertical-align: top;
34
+ list-style-type: none;
35
+ }
36
+
37
+ .fancybox-wrap,
38
+ .fancybox-wrap iframe,
39
+ .fancybox-wrap object,
40
+ .fancybox-skin,
41
+ .fancybox-outer,
42
+ .fancybox-inner,
43
+ .fancybox-image,
44
+ .fancybox-nav span,
45
+ .fancybox-tmp {
46
+ @extend %modal-reset;
47
+ }
49
48
 
50
49
  // Container
51
- // --------------------------------------------------------------------------------------------------------------------
52
-
53
- // Overlay | 1st level
54
- .fancybox-overlay {
55
- @extend %modal__overlay !optional;
56
- @include position(absolute, 0px 0 0 0px);
57
- display: none;
58
- overflow: hidden;
59
- z-index: ($zindex-modal - 1);
60
-
61
- &.fancybox-overlay-fixed {
62
- @include position(fixed, 0 0px 0px 0 );
63
- }
64
-
65
- // Wrap | 2nd Level
66
- .fancybox-wrap {
67
- @include position(absolute, 0px 0 0 0px);
68
- z-index: $zindex-modal;
69
-
70
- &.fancybox-opened { z-index: ($zindex-modal + 1); }
71
-
72
- // for Iframes
73
- &.fancybox-type-iframe .fancybox-inner {
74
- -webkit-overflow-scrolling: touch;
75
- }
76
-
77
- // for Iframes, Inline and Ajax
78
- &.fancybox-type-inline,
79
- &.fancybox-type-iframe,
80
- &.fancybox-type-ajax {
81
-
82
- .fancybox-close {
83
- @extend %modal__close--alt !optional;
84
- }
85
- }
86
-
87
- // Skin | 3rd Level
88
- .fancybox-skin {
89
- @extend %modal__skin !optional;
90
- position: relative;
91
- padding: 0 !important;
92
-
93
- // Outer | 4th Level
94
- .fancybox-outer {
95
- position: relative;
96
-
97
- // Inner | 5th Level
98
- .fancybox-inner {
99
- position: relative;
100
- overflow: hidden;
101
-
102
- > div { padding: rhythm(1); }
103
-
104
- } // 5thst
105
- } // 4th
106
- } // 3rd
107
- } // 2nd
108
- } // 1st
50
+
51
+ // Overlay | 1st level
52
+ .fancybox-overlay {
53
+ @extend %modal__overlay !optional;
54
+ @include position(absolute, 0px 0 0 0px);
55
+ display: none;
56
+ overflow: hidden;
57
+ z-index: ($zindex-modal - 1);
58
+
59
+ &.fancybox-overlay-fixed {
60
+ @include position(fixed, 0 0px 0px 0 );
61
+ }
62
+
63
+ // Wrap | 2nd Level
64
+ .fancybox-wrap {
65
+ @include position(absolute, 0px 0 0 0px);
66
+ z-index: $zindex-modal;
67
+
68
+ &.fancybox-opened { z-index: ($zindex-modal + 1); }
69
+
70
+ // for Iframes
71
+ &.fancybox-type-iframe .fancybox-inner {
72
+ -webkit-overflow-scrolling: touch;
73
+ }
74
+
75
+ // for Iframes, Inline and Ajax
76
+ &.fancybox-type-inline,
77
+ &.fancybox-type-iframe,
78
+ &.fancybox-type-ajax {
79
+
80
+ .fancybox-close {
81
+ @extend %modal__close--alt !optional;
82
+ }
83
+ }
84
+
85
+ // Skin | 3rd Level
86
+ .fancybox-skin {
87
+ @extend %modal__skin !optional;
88
+ position: relative;
89
+ padding: 0 !important;
90
+
91
+ // Outer | 4th Level
92
+ .fancybox-outer {
93
+ position: relative;
94
+
95
+ // Inner | 5th Level
96
+ .fancybox-inner {
97
+ position: relative;
98
+ overflow: hidden;
99
+
100
+ > div { padding: rhythm(1); }
101
+
102
+ } // 5thst
103
+ } // 4th
104
+ } // 3rd
105
+ } // 2nd
106
+ } // 1st
109
107
 
110
108
 
111
109
  // Backtground temp
112
- // --------------------------------------------------------------------------------------------------------------------
113
110
 
114
- .fancybox-tmp {
115
- @include position(absolute, -9999px 0 0 -9999px);
116
- visibility: hidden;
117
- max-width: 99999px;
118
- max-height: 99999px;
119
- overflow: visible !important;
120
- }
111
+ .fancybox-tmp {
112
+ @include position(absolute, -9999px 0 0 -9999px);
113
+ visibility: hidden;
114
+ max-width: 99999px;
115
+ max-height: 99999px;
116
+ overflow: visible !important;
117
+ }
121
118
 
122
- .fancybox-lock { overflow: hidden; }
119
+ .fancybox-lock { overflow: hidden; }
123
120
 
124
- .fancybox-lock .fancybox-overlay {
125
- overflow: auto;
126
- overflow-y: scroll;
127
- }
121
+ .fancybox-lock .fancybox-overlay {
122
+ overflow: auto;
123
+ overflow-y: scroll;
124
+ }
128
125
 
129
126
 
130
127
  // Content
131
- // --------------------------------------------------------------------------------------------------------------------
132
128
 
133
- .fancybox-error {
134
- margin: 0;
135
- padding: $modals-error-padding;
136
- white-space: nowrap;
137
- }
129
+ .fancybox-error {
130
+ margin: 0;
131
+ padding: $modals-error-padding;
132
+ white-space: nowrap;
133
+ }
138
134
 
139
- .fancybox-image,
140
- .fancybox-iframe {
141
- display: block;
142
- @include square(100%);
143
- }
135
+ .fancybox-image,
136
+ .fancybox-iframe {
137
+ display: block;
138
+ @include square(100%);
139
+ }
144
140
 
145
- .fancybox-image {
146
- max-width: 100%;
147
- max-height: 100%;
148
- // @include border-radius($base-border-radius);
149
- }
141
+ .fancybox-image {
142
+ max-width: 100%;
143
+ max-height: 100%;
144
+ // @include border-radius($base-border-radius);
145
+ }
150
146
 
151
147
 
152
- #fancybox-loading {
153
- @include position(fixed, 50% 0 0 50%);
154
- @extend %modal__loading !optional;
155
- cursor: pointer;
156
- z-index: $zindex-modal +4;
157
- }
148
+ #fancybox-loading {
149
+ @include position(fixed, 50% 0 0 50%);
150
+ @extend %modal__loading !optional;
151
+ cursor: pointer;
152
+ z-index: $zindex-modal +4;
153
+ }
158
154
 
159
155
 
160
156
  // Buttons and Navigation
161
- // --------------------------------------------------------------------------------------------------------------------
162
-
163
- .fancybox-close {
164
- @extend %modal__btn !optional;
165
- @extend %modal__close !optional;
166
- // @include border-radius($base-border-radius);
167
- z-index: ($zindex-modal + 3);
168
- }
169
-
170
- .fancybox-nav {
171
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
172
- @include position(absolute, 0px 0 0 0);
173
- @include size(100%, 40%);
174
- z-index: ($zindex-modal + 2);
175
-
176
- span {
177
- @extend %modal__btn !optional;
178
- @extend %modal__nav !optional;
179
- @include position(absolute, 50% 0 0 0);
180
- @include opacity(0);
181
- z-index: ($zindex-modal + 2);
182
- }
183
-
184
- &:hover span { @include opacity(1); }
185
-
186
- &.fancybox-prev {
187
- left: 0;
188
- span { left: 0; }
189
- }
190
-
191
- &.fancybox-next {
192
- right: 0;
193
- span { right: 0; }
194
- }
195
- }
157
+
158
+ .fancybox-close {
159
+ @extend %modal__btn !optional;
160
+ @extend %modal__close !optional;
161
+ // @include border-radius($base-border-radius);
162
+ z-index: ($zindex-modal + 3);
163
+ }
164
+
165
+ .fancybox-nav {
166
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
167
+ @include position(absolute, 0px 0 0 0);
168
+ @include size(100%, 40%);
169
+ z-index: ($zindex-modal + 2);
170
+
171
+ span {
172
+ @extend %modal__btn !optional;
173
+ @extend %modal__nav !optional;
174
+ @include position(absolute, 50% 0 0 0);
175
+ @include opacity(0);
176
+ z-index: ($zindex-modal + 2);
177
+ }
178
+
179
+ &:hover span { @include opacity(1); }
180
+
181
+ &.fancybox-prev {
182
+ left: 0;
183
+ span { left: 0; }
184
+ }
185
+
186
+ &.fancybox-next {
187
+ right: 0;
188
+ span { right: 0; }
189
+ }
190
+ }
196
191
 
197
192
 
198
193
  // Titles
199
- // --------------------------------------------------------------------------------------------------------------------
200
-
201
- .fancybox-title {
202
- visibility: hidden;
203
- position: relative;
204
- text-shadow: none;
205
- z-index: ($zindex-modal + 3);
206
- }
207
-
208
- .fancybox-opened .fancybox-title {
209
- visibility: visible;
210
- }
211
-
212
- .fancybox-title-float-wrap {
213
- @include position(absolute, 0 50% 0px 0);
214
- margin-bottom: em(-35px);
215
- text-align: center;
216
- z-index: ($zindex-modal + 3);
217
-
218
- .child {
219
- @include alpha-color(#000, .8, background);
220
- @include border-radius($base-border-radius);
221
- display: inline-block;
222
- margin-right: -100%;
223
- padding: em(2px) em($input-padding-side);
224
- color: #FFF;
225
- font-weight: bold;
226
- white-space: nowrap;
227
- }
228
- }
229
-
230
- .fancybox-title-outside-wrap {
231
- position: relative;
232
- margin-top: em($input-padding-top);
233
- color: #fff;
234
- }
235
-
236
- .fancybox-title-over-wrap {
237
- @include position(absolute, 0 0 0px 0px);
238
- @extend %modal__caption !optional;
239
- }
240
-
241
- }
242
-
243
- /* --------------------------------------------------------------------------------------------------------------------
194
+
195
+ .fancybox-title {
196
+ visibility: hidden;
197
+ position: relative;
198
+ text-shadow: none;
199
+ z-index: ($zindex-modal + 3);
200
+ }
201
+
202
+ .fancybox-opened .fancybox-title {
203
+ visibility: visible;
204
+ }
205
+
206
+ .fancybox-title-float-wrap {
207
+ @include position(absolute, 0 50% 0px 0);
208
+ margin-bottom: em(-35px);
209
+ text-align: center;
210
+ z-index: ($zindex-modal + 3);
211
+
212
+ .child {
213
+ @include alpha-color(#000, .8, background);
214
+ @include border-radius($base-border-radius);
215
+ display: inline-block;
216
+ margin-right: -100%;
217
+ padding: em(2px) em($input-padding-side);
218
+ color: #FFF;
219
+ font-weight: bold;
220
+ white-space: nowrap;
221
+ }
222
+ }
223
+
224
+ .fancybox-title-outside-wrap {
225
+ position: relative;
226
+ margin-top: em($input-padding-top);
227
+ color: #fff;
228
+ }
229
+
230
+ .fancybox-title-over-wrap {
231
+ @include position(absolute, 0 0 0px 0px);
232
+ @extend %modal__caption !optional;
233
+ }
234
+
235
+ }
236
+
237
+ /*
244
238
 
245
239
  Modal Buttons
246
240
 
@@ -270,37 +264,37 @@ Markup:
270
264
 
271
265
  Styleguide 11.1
272
266
 
273
- -------------------------------------------------------------------------------------------------------------------- */
267
+ */
274
268
 
275
269
  @if $modal-buttons {
276
270
 
277
- #fancybox-buttons {
278
- @include position(fixed, 0 0 0 0px);
279
- width: 100%;
280
- z-index: ($zindex-modal + 3);
281
- &.top { top: em(10px); }
282
- &.bottom { bottom: em(10px); }
283
-
284
- ul {
285
- @extend %modal__btnbar-size !optional;
286
- display: block;
287
- list-style: none;
288
- margin: 0 auto;
289
- li {
290
- float: left;
291
- margin: 0;
292
- a {
293
- @extend %modal__btn !optional;
294
- position: relative;
295
- &:hover { @include opacity(1); }
296
- &:after { @include position(absolute, 0px 0px 0 0px); }
297
- }
298
- }
299
- }
300
- }
271
+ #fancybox-buttons {
272
+ @include position(fixed, 0 0 0 0px);
273
+ width: 100%;
274
+ z-index: ($zindex-modal + 3);
275
+ &.top { top: em(10px); }
276
+ &.bottom { bottom: em(10px); }
277
+
278
+ ul {
279
+ @extend %modal__btnbar-size !optional;
280
+ display: block;
281
+ list-style: none;
282
+ margin: 0 auto;
283
+ li {
284
+ float: left;
285
+ margin: 0;
286
+ a {
287
+ @extend %modal__btn !optional;
288
+ position: relative;
289
+ &:hover { @include opacity(1); }
290
+ &:after { @include position(absolute, 0px 0px 0 0px); }
291
+ }
292
+ }
293
+ }
294
+ }
301
295
  }
302
296
 
303
- /* --------------------------------------------------------------------------------------------------------------------
297
+ /*
304
298
 
305
299
  Modal Thumbs
306
300
 
@@ -334,38 +328,38 @@ Markup:
334
328
 
335
329
  Styleguide 11.2
336
330
 
337
- -------------------------------------------------------------------------------------------------------------------- */
331
+ */
338
332
 
339
333
  @if $modal-thumbs {
340
334
 
341
- #fancybox-thumbs {
342
- @include position(fixed, 0 0 0 0px);
343
- overflow: hidden;
344
- width: 100%;
345
- z-index: ($zindex-modal + 3);
335
+ #fancybox-thumbs {
336
+ @include position(fixed, 0 0 0 0px);
337
+ overflow: hidden;
338
+ width: 100%;
339
+ z-index: ($zindex-modal + 3);
346
340
 
347
- &.bottom { bottom: em(10px); }
348
- &.top { top: em(10px); }
341
+ &.bottom { bottom: em(10px); }
342
+ &.top { top: em(10px); }
349
343
 
350
- ul {
351
- @extend %modal-reset;
352
- position: relative;
344
+ ul {
345
+ @extend %modal-reset;
346
+ position: relative;
353
347
 
354
- li {
355
- float: left;
356
- margin-right: em(4px);
357
- @include opacity(.5);
348
+ li {
349
+ float: left;
350
+ margin-right: em(4px);
351
+ @include opacity(.5);
358
352
 
359
- &:hover { @include opacity(.75); }
360
- &.active { @include opacity(1); }
353
+ &:hover { @include opacity(.75); }
354
+ &.active { @include opacity(1); }
361
355
 
362
- a {
363
- display: block;
364
- overflow: hidden;
365
- text-align: center;
366
- }
356
+ a {
357
+ display: block;
358
+ overflow: hidden;
359
+ text-align: center;
360
+ }
367
361
 
368
- }
369
- }
370
- }
362
+ }
363
+ }
364
+ }
371
365
  }