boxmodel-rails 0.0.2 → 0.0.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +5 -3
- data/lib/boxmodel/rails/version.rb +1 -1
- data/vendor/assets/stylesheets/boxmodel.css.sass +18 -16
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: a1ab360ba5324a82f8a4f634d63d8ccb536f4a36
|
4
|
+
data.tar.gz: 0c7ce044be7f2d73457276f55378d50f38a70719
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: dc6d3dff385b731f3dfec7d999897dab4e00e790bea820ce50218fda48133f6c3318489e930235e47707e07277777a522ba75c4c579c14d06845bbad4ecd7f8c
|
7
|
+
data.tar.gz: bc0bdfb3a181feffd501477df90512e85a54b86dd7369bcf9cf2ee55bd1bc789f097eb7b1133ce67e090a77a075a0fa0c9c64f4f1e8ac81caeac9b50b1500626
|
data/README.md
CHANGED
@@ -25,8 +25,9 @@ Or install it yourself as:
|
|
25
25
|
In you CSS manifest file add the following line:
|
26
26
|
|
27
27
|
```scss
|
28
|
-
$step:
|
29
|
-
$
|
28
|
+
$step: 1;
|
29
|
+
$minValue: -10;
|
30
|
+
$maxValue: 10;
|
30
31
|
@import 'boxmodel';
|
31
32
|
```
|
32
33
|
|
@@ -44,7 +45,7 @@ The gem creates four types of classes:
|
|
44
45
|
3. two way classes - e.g. `.m-v-5`, `.p-h-5`
|
45
46
|
4. four way classes - e.g. `m-5`, `p-5`
|
46
47
|
|
47
|
-
#### Naming
|
48
|
+
#### Naming conventions
|
48
49
|
|
49
50
|
The naming conventions for this shortcuts are as follows:
|
50
51
|
|
@@ -63,6 +64,7 @@ So for example:
|
|
63
64
|
|
64
65
|
- `.m-5` - `margin: 5px;`
|
65
66
|
- `.m-b-10` - `margin-bottom: 10px;`
|
67
|
+
- `.m-l--7` - `margin-left: -7px;`
|
66
68
|
- `.m-v-10` - `margin-top: 10px; margin-bottom: 10px;`
|
67
69
|
|
68
70
|
----
|
@@ -62,8 +62,9 @@ $maxValue: 40 !default
|
|
62
62
|
// Four way classes
|
63
63
|
.m-#{$val}
|
64
64
|
margin: $val * 1px !important
|
65
|
-
|
66
|
-
|
65
|
+
@if $val >= 0
|
66
|
+
.p-#{$val}
|
67
|
+
padding: $val * 1px !important
|
67
68
|
// One way classes
|
68
69
|
.m-t-#{$val}
|
69
70
|
margin-top: $val * 1px !important
|
@@ -79,17 +80,18 @@ $maxValue: 40 !default
|
|
79
80
|
.m-v-#{$val}
|
80
81
|
margin-top: $val * 1px !important
|
81
82
|
margin-bottom: $val * 1px !important
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
83
|
+
@if $val >= 0
|
84
|
+
.p-t-#{$val}
|
85
|
+
padding-top: $val * 1px !important
|
86
|
+
.p-b-#{$val}
|
87
|
+
padding-bottom: $val * 1px !important
|
88
|
+
.p-r-#{$val}
|
89
|
+
padding-right: $val * 1px !important
|
90
|
+
.p-l-#{$val}
|
91
|
+
padding-left: $val * 1px !important
|
92
|
+
.p-h-#{$val}
|
93
|
+
padding-left: $val * 1px !important
|
94
|
+
padding-right: $val * 1px !important
|
95
|
+
.p-v-#{$val}
|
96
|
+
padding-top: $val * 1px !important
|
97
|
+
padding-bottom: $val * 1px !important
|