rapido-css 0.1.7 → 0.1.8

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.
checksums.yaml CHANGED
@@ -1,15 +1,15 @@
1
1
  ---
2
2
  !binary "U0hBMQ==":
3
3
  metadata.gz: !binary |-
4
- ZjVhNGVlMDFlZDU1OTc4YWUyYTk5N2ZjOWVhYTAyNDEzMTNmNmE1Zg==
4
+ NDE5ZTQ5ODQwNTg0MDE3N2ZjNzRkOWZlYTcwZTk5NWYxYmVmYzMyOA==
5
5
  data.tar.gz: !binary |-
6
- NzViNTBmNWU3YzNiY2M1YjQ3NjVjYThkOTEzYTgzOWI1NmYxNTQ5YQ==
6
+ NzlkNjYwZjczZjVhYzAxZWJlNDQ3NmFlMjg0NTI1NTgzNzQ4YjFlZQ==
7
7
  SHA512:
8
8
  metadata.gz: !binary |-
9
- MDNiZTE2ZTI1NjFlZGQ0OGMzMTUyZmE5YWQwMmU0YWYyMTEyOGQwYmMwYWY0
10
- YzM3NjgxNmY0NDg2NGQ2YWIyMjU1MjNlMGJkY2YzMTMzZmQxN2ZhMWMzNGMy
11
- YTAzYjJkYmUwMDE0NWFiZjIwMDc0N2MzM2U1NTQ0Njc0NWE5Yzc=
9
+ YmMxOTU0Nzk2OGNiZjRmZjY4MzVjMDNiMmUyYmYyNzJkMzNlMGU2MzVlMDIz
10
+ OWRjOTQwNWM0MzI0ODI0MzUzNGJmODE0NjcyOTdhZDQzYjMzYzk4M2M3Yjhi
11
+ MjViMDIyZGM4ZGQ3NTE2MTQ1OTFjOTUxZGE1YzkxNDNlNTUyYWQ=
12
12
  data.tar.gz: !binary |-
13
- ZTYwYmZhMGNjNDU0OTQxYjk0ZWQ4NGZhZTA1MGYyMzc5MTcyMzcxZDFhMDNl
14
- MDhiODZhYzQ0ODg3MTVlZjRiZWMyNDVlOGE0NmEwNmNiMzMzMTVlZWMwYWJh
15
- ZGIxMDgxYzQzMmUzNDM5YmIzOWY5YzkwZTBlN2VlYmJiOGFhZGY=
13
+ OTNiNDRjMWU3MTA5NDdmNDc3YzIxN2Y3ZTdlODI1ZWZhZThkYTUwNDZmZDli
14
+ NWI2ZDlkZjY4ZGUxY2YxNmQ2YTU1YjJhZGI2YjNhM2Q4Y2M1MDNiMDljMTll
15
+ MGI0ZjRiMmM2MTc0MzJiZWJiNDI4YzBiNmQ3YjcwNWE3OGE0NTQ=
data/README.md CHANGED
@@ -2,7 +2,9 @@
2
2
 
3
3
  An easy and quick [**Sass**](http://sass-lang.com/) + [**Compass**](http://compass-style.org/) + [**Susy**](http://susy.oddbird.net/) + [**OOCSS**](http://oocss.org/) + [**BEM**](http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/) prototyping framework.
4
4
 
5
- [![Gem Version](https://badge.fury.io/rb/rapido-css.png)](http://badge.fury.io/rb/rapido-css) [![Bower version](https://badge.fury.io/bo/rapido.png)](http://badge.fury.io/bo/rapido)
5
+ [![Gem Version](https://badge.fury.io/rb/rapido-css.png)](http://badge.fury.io/rb/rapido-css)
6
+ [![Bower version](https://badge.fury.io/bo/rapido.png)](http://badge.fury.io/bo/rapido)
7
+ [![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/raffone/rapido/trend.png)](https://bitdeli.com/free "Bitdeli Badge")
6
8
 
7
9
  ## Features
8
10
 
@@ -30,3 +32,4 @@ A complete documentation of what is currently available can be found here: [Rapi
30
32
  ## License
31
33
 
32
34
  MIT License (MIT)
35
+
data/lib/rapido-css.rb CHANGED
@@ -1,5 +1,6 @@
1
1
  require 'compass'
2
2
  require 'susy'
3
+ require 'sass-media_query_combiner'
3
4
 
4
5
  extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
5
6
  Compass::Frameworks.register('rapido-css', :path => extension_path)
@@ -437,12 +437,12 @@ Styleguide 32.12
437
437
 
438
438
  %modal__btn {
439
439
  @extend %btn--scripts;
440
- @include square($modal-btn-size);
441
- line-height: $modal-btn-size;
440
+ @include square(em($modal-btn-size));
441
+ line-height: em($modal-btn-size);
442
442
  }
443
443
 
444
444
  %modal__close {
445
- $offset: -$modal-btn-size;
445
+ $offset: neg(em($modal-btn-size));
446
446
  @include position(absolute, $offset .5em 0 0);
447
447
  color: #CCCCCC;
448
448
  &:hover {
@@ -451,7 +451,7 @@ Styleguide 32.12
451
451
  }
452
452
 
453
453
  %modal__btnbar-size {
454
- @include size($modal-btn-size, $modal-btn-size * 5);
454
+ @include size(em($modal-btn-size), em($modal-btn-size) * 5);
455
455
  }
456
456
 
457
457
  // Other styles
@@ -466,7 +466,7 @@ Styleguide 32.12
466
466
 
467
467
  }
468
468
 
469
- %modal__nav { margin-top: (0 - ($modal-btn-size / 2)); }
469
+ %modal__nav { margin-top: (0 - (em($modal-btn-size) / 2)); }
470
470
 
471
471
  %modal__caption { @extend %caption; }
472
472
 
@@ -499,9 +499,9 @@ Styleguide 32.13
499
499
  // Buttons
500
500
  %slider__btn {
501
501
  @extend %btn--scripts;
502
- @include square($slider-btn-size);
503
- line-height: $slider-btn-size;
504
- margin-top: -($slider-btn-size / 2);
502
+ @include square(em($slider-btn-size));
503
+ line-height: em($slider-btn-size);
504
+ margin-top: neg((em($slider-btn-size) / 2));
505
505
 
506
506
  &.bx-prev i:after { content: "<" }
507
507
  &.bx-next i:after { content: ">" }
@@ -601,7 +601,7 @@ Styleguide 32.16
601
601
 
602
602
  %nav--offcanvas {
603
603
  background-color: $grayDark;
604
- padding: $wrapper-padding;
604
+ padding: em($wrapper-padding);
605
605
  color: $white;
606
606
 
607
607
  a {
@@ -410,13 +410,13 @@ Markup:
410
410
  </div>
411
411
  <script type="text/javascript">
412
412
  $(document).ready(function() {
413
- $('.form__controls').rapido_Suggest();
413
+ $.rapido_Suggest();
414
414
  });
415
415
  </script>
416
416
 
417
417
  Include this js after including rapido.js.
418
418
 
419
- $('.form').rapido_Overlay();
419
+ $.rapido_Suggest();
420
420
 
421
421
  **Options** (with default values):
422
422
 
@@ -434,6 +434,7 @@ Styleguide 8.6
434
434
  overflow: hidden;
435
435
  position: absolute;
436
436
  z-index: 5;
437
+ padding: $input-padding;
437
438
 
438
439
  &.open {
439
440
  max-height: $dropdowns-height;
@@ -446,7 +447,6 @@ Styleguide 8.6
446
447
  ul {
447
448
  margin: 0;
448
449
  list-style: none;
449
- padding: $input-padding;
450
450
  }
451
451
  }
452
452
 
@@ -32,6 +32,46 @@ Styleguide 19
32
32
 
33
33
  @if $tooltips {
34
34
 
35
+ [data-tooltip-position="top"] + .tooltip {
36
+ @include translate(0, -.50em);
37
+ &:after {
38
+ @include triangle(em($tooltip-triangle-size), $tooltip-background, down);
39
+ left: 50%;
40
+ margin-left: (neg(em($tooltip-triangle-size)) / 2);
41
+ bottom: neg(em($tooltip-triangle-size));
42
+ }
43
+ }
44
+
45
+ [data-tooltip-position="bottom"] + .tooltip {
46
+ @include translate(0, .50em);
47
+ &:after {
48
+ @include triangle(em($tooltip-triangle-size), $tooltip-background, up);
49
+ left: 50%;
50
+ margin-left: (neg(em($tooltip-triangle-size)) / 2);
51
+ top: neg(em($tooltip-triangle-size));
52
+ }
53
+ }
54
+
55
+ [data-tooltip-position="left"] + .tooltip {
56
+ @include translate(-.50em, 0);
57
+ &:after {
58
+ @include triangle(em($tooltip-triangle-size), $tooltip-background, right);
59
+ right: neg(em($tooltip-triangle-size));
60
+ top: 50%;
61
+ margin-top: (neg(em($tooltip-triangle-size)) / 2);
62
+ }
63
+ }
64
+
65
+ [data-tooltip-position="right"] + .tooltip {
66
+ @include translate(.50em, 0);
67
+ &:after {
68
+ @include triangle(em($tooltip-triangle-size), $tooltip-background, left);
69
+ left: neg(em($tooltip-triangle-size));
70
+ top: 50%;
71
+ margin-top: (neg(em($tooltip-triangle-size)) / 2);
72
+ }
73
+ }
74
+
35
75
  .tooltip {
36
76
  @extend %tooltip !optional;
37
77
  @include border-radius();
@@ -46,6 +86,7 @@ Styleguide 19
46
86
 
47
87
  &.open {
48
88
  @include opacity(1);
89
+ @include translate(0,0);
49
90
  max-height: $dropdowns-height;
50
91
  visibility: visible;
51
92
  }
@@ -58,32 +99,5 @@ Styleguide 19
58
99
 
59
100
  }
60
101
 
61
- [data-tooltip-position="top"] + .tooltip:after {
62
- @include triangle($tooltip-triangle-size, $tooltip-background, down);
63
- left: 50%;
64
- margin-left: (neg($tooltip-triangle-size) / 2);
65
- bottom: neg($tooltip-triangle-size);
66
- }
67
-
68
- [data-tooltip-position="bottom"] + .tooltip:after {
69
- @include triangle($tooltip-triangle-size, $tooltip-background, up);
70
- left: 50%;
71
- margin-left: (neg($tooltip-triangle-size) / 2);
72
- top: neg($tooltip-triangle-size);
73
- }
74
-
75
- [data-tooltip-position="left"] + .tooltip:after {
76
- @include triangle($tooltip-triangle-size, $tooltip-background, right);
77
- right: neg($tooltip-triangle-size);
78
- top: 50%;
79
- margin-top: (neg($tooltip-triangle-size) / 2);
80
- }
81
-
82
- [data-tooltip-position="right"] + .tooltip:after {
83
- @include triangle($tooltip-triangle-size, $tooltip-background, left);
84
- left: neg($tooltip-triangle-size);
85
- top: 50%;
86
- margin-top: (neg($tooltip-triangle-size) / 2);
87
- }
88
102
 
89
103
  }
@@ -126,7 +126,7 @@ Padding specific to every component you can use to overwrite the base padding.
126
126
 
127
127
  Helper classes
128
128
 
129
- $wrapper-padding: em(20px) # Side padding used with .w and .wrapper
129
+ $wrapper-padding: 20px # Side padding used with .w and .wrapper
130
130
 
131
131
  Buttons
132
132
 
@@ -157,7 +157,7 @@ Styleguide 31.3
157
157
 
158
158
 
159
159
  // Helper classes
160
- $wrapper-padding: em(20px) !default;
160
+ $wrapper-padding: 20px !default;
161
161
 
162
162
  // Buttons
163
163
  $btn-padding: $input-padding !default;
@@ -185,18 +185,18 @@ $tooltips-padding: $input-padding
185
185
  Sizes
186
186
 
187
187
  $loader-ico-size: 44px # Icon size of the loader used with some componets
188
- $modal-btn-size: em(30px) # Size of buttons used with the modals
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
+ $modal-btn-size: 30px # Size of buttons used with the modals
189
+ $slider-btn-size: 30px # Size of buttons used with the sliders
190
+ $tooltip-triangle-size: 15px # Size the tooltip's triangle
191
191
 
192
192
  Styleguide 31.4
193
193
 
194
194
  */
195
195
 
196
196
  $loader-ico-size: 44px !default;
197
- $modal-btn-size: em(30px) !default;
198
- $slider-btn-size: em(30px) !default;
199
- $tooltip-triangle-size: em(14px) !default;
197
+ $modal-btn-size: 30px !default;
198
+ $slider-btn-size: 30px !default;
199
+ $tooltip-triangle-size: 14px !default;
200
200
 
201
201
  /*
202
202
 
@@ -256,10 +256,10 @@ Grid (Susy)
256
256
 
257
257
  Default settings for susy grid. More info: [Susy](http://susy.oddbird.net/).
258
258
 
259
- $total-columns: 12 # Number of columns
260
- $column-width: 50px # Columns width
261
- $gutter-width: 30px # Gutter width
262
- $container-style: fluid # Grid style
259
+ $total-columns: 12 # Number of columns
260
+ $column-width: 50px # Columns width
261
+ $gutter-width: 30px # Gutter width
262
+ $container-style: fluid # Grid style
263
263
 
264
264
  Styleguide 31.8
265
265
 
@@ -275,10 +275,10 @@ $container-style: fluid
275
275
 
276
276
  Off-Canvas Options
277
277
 
278
- $offcanvas-width: 300px # Width of the sidebar
279
- $offcanvas-direction: left # On what side appear
280
- $offcanvas-dim: true # Dim over the content on open
281
- $offcanvas-effect: slide # cover, reveal, push, slide
278
+ $offcanvas-width: 300px # Width of the sidebar
279
+ $offcanvas-direction: left # On what side appear
280
+ $offcanvas-dim: true # Dim over the content on open
281
+ $offcanvas-effect: slide # cover, reveal, push, slide
282
282
 
283
283
  Styleguide 15.1
284
284
 
@@ -296,12 +296,12 @@ Z-index
296
296
 
297
297
  Default settings for overlay components, taken from Bootstrap.
298
298
 
299
- $zindex-offcanvas: 990 # OffCanvas
300
- $zindex-dropdown: 1000 # Dropdowns
301
- $zindex-popover: 1010 # Popovers
302
- $zindex-tooltip: 1030 # Tooltips
303
- $zindex-slider: 1040 # Sliders
304
- $zindex-modal: 1050 # Modals
299
+ $zindex-offcanvas: 990 # OffCanvas
300
+ $zindex-dropdown: 1000 # Dropdowns
301
+ $zindex-popover: 1010 # Popovers
302
+ $zindex-tooltip: 1030 # Tooltips
303
+ $zindex-slider: 1040 # Sliders
304
+ $zindex-modal: 1050 # Modals
305
305
 
306
306
  Styleguide 31.9
307
307
 
@@ -28,7 +28,7 @@ Durations specifics for some modules.
28
28
 
29
29
  $caption-animations-duration: .50s
30
30
  $offcanvas-animations-duration: .40s
31
- $tooltip-transition-duration: .25s
31
+ $tooltip-transition-duration: .30s
32
32
 
33
33
  Styleguide 24.1
34
34
 
@@ -47,4 +47,4 @@ $default-transition-function: toBezier($animations-function)
47
47
 
48
48
  $caption-animations-duration: .50s !default;
49
49
  $offcanvas-animations-duration: .40s !default;
50
- $tooltip-transition-duration: .25s !default;
50
+ $tooltip-transition-duration: .30s !default;
@@ -62,8 +62,8 @@ Styleguide 25.2
62
62
  @extend .clearfix;
63
63
  margin: 0 auto;
64
64
  max-width: $desk-end;
65
- padding-left: $wrapper-padding;
66
- padding-right: $wrapper-padding;
65
+ padding-left: em($wrapper-padding);
66
+ padding-right: em($wrapper-padding);
67
67
  }
68
68
 
69
69
  .fixed-wrapper, .fw {
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: rapido-css
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.7
4
+ version: 0.1.8
5
5
  platform: ruby
6
6
  authors:
7
7
  - Raffaele Rasini
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2014-01-29 00:00:00.000000000 Z
11
+ date: 2014-01-31 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: susy
@@ -24,6 +24,20 @@ dependencies:
24
24
  - - ! '>='
25
25
  - !ruby/object:Gem::Version
26
26
  version: 1.0.8
27
+ - !ruby/object:Gem::Dependency
28
+ name: sass-media_query_combiner
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - ! '>='
32
+ - !ruby/object:Gem::Version
33
+ version: 0.0.6
34
+ type: :runtime
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - ! '>='
39
+ - !ruby/object:Gem::Version
40
+ version: 0.0.6
27
41
  description: An easy and quick Sass + Compass + Susy + OOCSS + BEM prototyping framework.
28
42
  email: raffaele.rasini@gmail.com
29
43
  executables: []