compass-placeholders 1.0.0.rc.1 → 1.0.0.rc.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.
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
|
-
|