compass-placeholders 1.0.0.rc.1 → 1.0.0.rc.2
Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: b102d3a0aaad2bb59638fa2c9ea4be3a192c3bb5
|
4
|
+
data.tar.gz: ca727ca7effbf3f9c9c1a9126424df1f6351a8e8
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 42c3373274c38874e1f30d09a63f31f74d36d9b9a699f1754932e730782ccb366d2658ee5f32f8d351ede285a390d58344a7da23b51b5bc654b56ba0122be97d
|
7
|
+
data.tar.gz: 8876ec9ad5d67c2e922ef340e02882321ece6bdcf627bc7ecda3ac29d78476aed9421a61890f9629a1832602e514fd33bec0b28b013cb11bf5ad4e4c159d59dc
|
data/README.md
CHANGED
@@ -12,6 +12,8 @@ Example: hover-link
|
|
12
12
|
|
13
13
|
Traditional way via [Compass](http://compass-style.org/):
|
14
14
|
|
15
|
+
@import "compass";
|
16
|
+
|
15
17
|
a.first-link {
|
16
18
|
@include hover-link;
|
17
19
|
}
|
@@ -42,6 +44,9 @@ Result:
|
|
42
44
|
|
43
45
|
Optimized way via **Compass Placeholders:**
|
44
46
|
|
47
|
+
@import "compass";
|
48
|
+
@import "compass-placeholders";
|
49
|
+
|
45
50
|
a.first-link {
|
46
51
|
@extend %hover-link;
|
47
52
|
}
|
@@ -62,6 +67,8 @@ Result (DRY – don’t repeat yourself):
|
|
62
67
|
text-decoration: underline;
|
63
68
|
}
|
64
69
|
|
70
|
+
(Be shure
|
71
|
+
|
65
72
|
|
66
73
|
Compass CSS3 Placeholders
|
67
74
|
-------------------------
|
@@ -229,6 +236,28 @@ Non Compass-related Placeholders
|
|
229
236
|
* `@extend %cursor-pointer;`
|
230
237
|
|
231
238
|
|
239
|
+
Setup
|
240
|
+
-----
|
241
|
+
|
242
|
+
First install the gems and create a project:
|
243
|
+
|
244
|
+
gem install compass
|
245
|
+
gem install compass-placeholders --pre
|
246
|
+
compass create my-project
|
247
|
+
|
248
|
+
Second add to your my-project/**compass.rb**:
|
249
|
+
|
250
|
+
require "compass-placeholders"
|
251
|
+
|
252
|
+
Third import _Compass-Placeholders_ after _Compass_ in your Sass/SCSS
|
253
|
+
file:
|
254
|
+
|
255
|
+
@import "compass";
|
256
|
+
@import "compass-placeholders";
|
257
|
+
|
258
|
+
// now you can use `@extend %hover-link` etc.
|
259
|
+
|
260
|
+
|
232
261
|
Copyright
|
233
262
|
---------
|
234
263
|
|
data/sassmanifest.json
ADDED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: compass-placeholders
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.0.rc.
|
4
|
+
version: 1.0.0.rc.2
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Nico Hagenburger
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2013-10-
|
11
|
+
date: 2013-10-15 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: compass
|
@@ -41,6 +41,7 @@ files:
|
|
41
41
|
- compass-placeholders.gemspec
|
42
42
|
- lib/compass-placeholders.rb
|
43
43
|
- lib/compass-placeholders/version.rb
|
44
|
+
- sassmanifest.json
|
44
45
|
- stylesheets/_compass-placeholders.scss
|
45
46
|
- stylesheets/compass-placeholders/_css3.scss
|
46
47
|
- stylesheets/compass-placeholders/_typography.scss
|
@@ -52,7 +53,6 @@ files:
|
|
52
53
|
- stylesheets/compass-placeholders/css3/_border-radius.scss
|
53
54
|
- stylesheets/compass-placeholders/css3/_box-shadow.scss
|
54
55
|
- stylesheets/compass-placeholders/css3/_box-sizing.scss
|
55
|
-
- stylesheets/compass-placeholders/css3/_box.scss
|
56
56
|
- stylesheets/compass-placeholders/css3/_opacity.scss
|
57
57
|
- stylesheets/compass-placeholders/css3/_transform-style.scss
|
58
58
|
- stylesheets/compass-placeholders/css3/_user-select.scss
|
@@ -72,7 +72,6 @@ files:
|
|
72
72
|
- test/integration/css3/border-radius.scss.test
|
73
73
|
- test/integration/css3/box-shadow.scss.test
|
74
74
|
- test/integration/css3/box-sizing.scss.test
|
75
|
-
- test/integration/css3/box.scss.test
|
76
75
|
- test/integration/css3/opacity.scss.test
|
77
76
|
- test/integration/css3/transform-style.scss.test
|
78
77
|
- test/integration/css3/user-select.scss.test
|
@@ -118,7 +117,6 @@ test_files:
|
|
118
117
|
- test/integration/css3/border-radius.scss.test
|
119
118
|
- test/integration/css3/box-shadow.scss.test
|
120
119
|
- test/integration/css3/box-sizing.scss.test
|
121
|
-
- test/integration/css3/box.scss.test
|
122
120
|
- test/integration/css3/opacity.scss.test
|
123
121
|
- test/integration/css3/transform-style.scss.test
|
124
122
|
- test/integration/css3/user-select.scss.test
|
@@ -1,45 +0,0 @@
|
|
1
|
-
%display-box {
|
2
|
-
@include display-box;
|
3
|
-
}
|
4
|
-
|
5
|
-
$box-orient-placeholders: horizontal, vertical, inline-axis, block-axis,
|
6
|
-
inherit !default;
|
7
|
-
|
8
|
-
@each $property in $box-orient-placeholders {
|
9
|
-
%box-orient-#{$property} {
|
10
|
-
@include box-orient($property);
|
11
|
-
}
|
12
|
-
}
|
13
|
-
|
14
|
-
$box-align-placeholders: start, end, center, baseline, stretch !default;
|
15
|
-
|
16
|
-
@each $property in $box-align-placeholders {
|
17
|
-
%box-align-#{$property} {
|
18
|
-
@include box-align($property);
|
19
|
-
}
|
20
|
-
}
|
21
|
-
|
22
|
-
$box-direction-placeholders: normal, reverse, inherit !default;
|
23
|
-
|
24
|
-
@each $property in $box-direction-placeholders {
|
25
|
-
%box-direction-#{$property} {
|
26
|
-
@include box-direction($property);
|
27
|
-
}
|
28
|
-
}
|
29
|
-
|
30
|
-
$box-lines-placeholders: single, multiple !default;
|
31
|
-
|
32
|
-
@each $property in $box-lines-placeholders {
|
33
|
-
%box-lines-#{$property} {
|
34
|
-
@include box-lines($property);
|
35
|
-
}
|
36
|
-
}
|
37
|
-
|
38
|
-
$box-pack-placeholders: start, end, center, justify !default;
|
39
|
-
|
40
|
-
@each $property in $box-pack-placeholders {
|
41
|
-
%box-pack-#{$property} {
|
42
|
-
@include box-pack($property);
|
43
|
-
}
|
44
|
-
}
|
45
|
-
|
@@ -1,37 +0,0 @@
|
|
1
|
-
@import "compass-placeholders";
|
2
|
-
|
3
|
-
#test {
|
4
|
-
@extend %display-box;
|
5
|
-
@extend %box-orient-horizontal;
|
6
|
-
@extend %box-align-start;
|
7
|
-
@extend %box-direction-normal;
|
8
|
-
@extend %box-lines-single;
|
9
|
-
@extend %box-pack-start;
|
10
|
-
}
|
11
|
-
|
12
|
-
===
|
13
|
-
|
14
|
-
#test {
|
15
|
-
display: box;
|
16
|
-
}
|
17
|
-
|
18
|
-
#test {
|
19
|
-
box-orient: horizontal;
|
20
|
-
}
|
21
|
-
|
22
|
-
#test {
|
23
|
-
box-align: start;
|
24
|
-
}
|
25
|
-
|
26
|
-
#test {
|
27
|
-
box-direction: normal;
|
28
|
-
}
|
29
|
-
|
30
|
-
#test {
|
31
|
-
box-lines: single;
|
32
|
-
}
|
33
|
-
|
34
|
-
#test {
|
35
|
-
box-pack: start;
|
36
|
-
}
|
37
|
-
|