support-for 1.0.1 → 1.0.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +50 -45
- data/package.json +1 -1
- data/support-for.gemspec +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 544b324c92e02ee62af2ef312160106a829f15c5
|
4
|
+
data.tar.gz: 5192e66c991ca863bd94f6046afafcdfd68b573a
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 04ad519e630730be88ef99aba76f8b157c9a59d128b03e0584290ddbaad6a0d220bc044053e4484f24d4c7037e1a259130e20f83e8064cf7eabf732b8e3f247d
|
7
|
+
data.tar.gz: c87eeb3bc7dda033e83b5ff64b3fe45a81f9b72edf266bcd3d10425707e4db3bfb403a5684062744b36ce0d3c0ec811f86f370d83ca2d524fd474d27a663e20f
|
data/README.md
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
# support-for
|
2
2
|
|
3
|
-
The
|
3
|
+
The **support-for** module allows Sass authors to conditionally add support for specific browser versions to their Sass module or Sass partials.
|
4
4
|
|
5
5
|
[Autoprefixer](https://github.com/postcss/autoprefixer) is great for conditionally adding vendor prefixes, but sometimes you need more extensive CSS for specific versions of browsers. For example, adding px fallbacks to rem units when you need IE 8 support.
|
6
6
|
|
@@ -10,52 +10,52 @@ Here are some example usages:
|
|
10
10
|
|
11
11
|
1. The Sass author only wants to support Safari 8 and later (and no other browsers) because he is an asshole.
|
12
12
|
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
13
|
+
```scss
|
14
|
+
$support-for: (
|
15
|
+
safari: 8,
|
16
|
+
'*': null, // null means "no support" and is the
|
17
|
+
// default value for any browser not
|
18
|
+
// specified in $support-for
|
19
|
+
);
|
20
|
+
|
21
|
+
// Normalize-scss uses support-for to conditionally
|
22
|
+
// output CSS for old and new browsers.
|
23
|
+
@import "normalize";
|
24
|
+
```
|
25
25
|
|
26
26
|
2. The Sass author wants to support the 4 most recent versions of all browsers which she can do by setting the wildcard browser, `'*'`. She also has to support IE 6 and later because the client hates her.
|
27
27
|
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
28
|
+
```scss
|
29
|
+
$support-for: (
|
30
|
+
'*': -4,
|
31
|
+
ie: 6,
|
32
|
+
);
|
33
33
|
|
34
|
-
|
35
|
-
|
34
|
+
@import "normalize";
|
35
|
+
```
|
36
36
|
|
37
37
|
3. The Sass author is working for a government client and every browser version has a specific version specified in the contract.
|
38
38
|
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
39
|
+
```scss
|
40
|
+
$support-for: (
|
41
|
+
chrome: 29,
|
42
|
+
edge: 20,
|
43
|
+
firefox: 26,
|
44
|
+
ie: 8,
|
45
|
+
opera: 14,
|
46
|
+
safari: 5,
|
47
|
+
);
|
48
|
+
|
49
|
+
@import "normalize";
|
50
|
+
```
|
51
51
|
|
52
52
|
### Update your Sass partials to use `support-for()`
|
53
53
|
|
54
|
-
If a Sass module tells you that it uses
|
54
|
+
If a Sass module tells you that it uses **support-for**, you just need to override the default value of the `$support-for` variable before you import that module. See the examples above to see some of your options.
|
55
55
|
|
56
56
|
If, however, you want to conditionally include Sass in the stylesheets you author, you can update your Sass code to wrap those lines of Sass with an `@if` block that uses the `support-for()` function.
|
57
57
|
|
58
|
-
```
|
58
|
+
```scss
|
59
59
|
@mixin my-sweet-sweet-mixin($cocoa: lots) {
|
60
60
|
border-radius: 100%;
|
61
61
|
|
@@ -71,35 +71,40 @@ If you later drop support for IE 10 (someday!), you just need to update the
|
|
71
71
|
`$support-for` variable and your code will stop outputting the IE-10-specific
|
72
72
|
CSS.
|
73
73
|
|
74
|
-
## Updating your module to use
|
74
|
+
## Updating your module to use support-for
|
75
75
|
|
76
|
-
If you are a Sass module author wanting to use
|
77
|
-
quite easy to add it.
|
76
|
+
If you are a Sass module author wanting to use **support-for** in your module, it's
|
77
|
+
quite easy to add it as a dependency.
|
78
78
|
|
79
79
|
### Ruby Sass
|
80
80
|
|
81
81
|
Alter your `my-module.gemspec` file:
|
82
82
|
|
83
83
|
1. Find the line for your module's Sass dependency. It should look similar to this:
|
84
|
-
|
85
|
-
|
86
|
-
|
84
|
+
|
85
|
+
```ruby
|
86
|
+
spec.add_runtime_dependency('sass', '~> 3.3')
|
87
|
+
```
|
88
|
+
|
87
89
|
2. Just after that line, add this:
|
88
|
-
|
89
|
-
|
90
|
-
|
90
|
+
|
91
|
+
```ruby
|
92
|
+
spec.add_runtime_dependency('support-for', '~> 1.0')
|
93
|
+
```
|
91
94
|
|
92
95
|
### NPM (and node-sass)
|
93
96
|
|
94
97
|
Add your dependency with the following command:
|
95
|
-
|
98
|
+
|
99
|
+
```bash
|
96
100
|
npm install --save support-for
|
97
101
|
```
|
98
102
|
|
99
103
|
### Bower
|
100
104
|
|
101
105
|
Add your dependency with the following command:
|
102
|
-
|
106
|
+
|
107
|
+
```bash
|
103
108
|
bower install --save support-for
|
104
109
|
```
|
105
110
|
|
data/package.json
CHANGED
data/support-for.gemspec
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: support-for
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.
|
4
|
+
version: 1.0.2
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- John Albin Wilkins
|
@@ -57,7 +57,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
57
57
|
- !ruby/object:Gem::Version
|
58
58
|
version: '0'
|
59
59
|
requirements: []
|
60
|
-
rubyforge_project: 1.0.
|
60
|
+
rubyforge_project: 1.0.2
|
61
61
|
rubygems_version: 2.4.8
|
62
62
|
signing_key:
|
63
63
|
specification_version: 4
|