faw_icon 0.7.4 → 0.8.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/Gemfile.lock +1 -1
- data/README.md +10 -4
- data/faw_icon.gemspec +1 -1
- data/lib/faw_icon/helper.rb +12 -1
- data/lib/faw_icon/version.rb +1 -1
- metadata +3 -3
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 8dd810aea2dee37ab375e6609acd66af5d9fdb26ca005f194038909bbea8573a
|
4
|
+
data.tar.gz: 4b405f078816b80fa09fa45f1daf80b7a41e994eb56b3cb686529a2b9e25b863
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: fd4f7df5c71723babe994ac893c54465104047c896460d6fdb16b558b80b290065a497c1f5752d0fb8ba6671e311337f7c3306594ebc53a4e15fe99dc1c763f0
|
7
|
+
data.tar.gz: bbc8191ea0b25e9cda795dd08a91084e6e8b13a00209837cb7bccebb6080853f824d45b794b4eeacd744ba1b110034fbd146d33feffcdb546f339b0bcd2c7d64
|
data/Gemfile.lock
CHANGED
data/README.md
CHANGED
@@ -34,8 +34,6 @@ application.scss
|
|
34
34
|
|
35
35
|
@import "fa-svg-with-js";
|
36
36
|
|
37
|
-
Then copy the `fontawesome/advanced-options/metadata/icons.json` in `app/assets/javascripts/icons.json`
|
38
|
-
|
39
37
|
## Configuration
|
40
38
|
The below options are also available for further customization
|
41
39
|
|
@@ -44,7 +42,7 @@ The below options are also available for further customization
|
|
44
42
|
| icons_path | app/assets/javascripts/icons.json |
|
45
43
|
| raw_svg_path | vendor/fa5/raw-svg |
|
46
44
|
| svg_sprites_path | public/fa5/svg-sprites |
|
47
|
-
| source_type | json (json, raw, sprite)
|
45
|
+
| source_type | json (json, raw, sprite, js) |
|
48
46
|
| icon_not_found | `<svg>...</svg>` |
|
49
47
|
| default_family_prefix | fa |
|
50
48
|
| default_replacement_class | svg-inline--fa |
|
@@ -61,16 +59,18 @@ end
|
|
61
59
|
```
|
62
60
|
|
63
61
|
The configuration option `source_type` was added to address the performance hit from loading large json files
|
64
|
-
from the PRO collection and introduces
|
62
|
+
from the PRO collection and introduces several ways to include icons in the application.
|
65
63
|
|
66
64
|
1. `json` load a json file, traverse and find the icon
|
67
65
|
2. `raw` load a single svg file from the filesystem
|
68
66
|
3. `sprite` load an svg sprite and target the icon by using svg fragment identifiers
|
67
|
+
4. `js` load one or more .js files according to the recommended way described at [svg-with-js](https://fontawesome.com/how-to-use/svg-with-js)
|
69
68
|
|
70
69
|
They all have pros and cons so choose the one that is right for you.
|
71
70
|
|
72
71
|
`json` a single file that contains everything however it will have a noticeable impact on performance when used with
|
73
72
|
the PRO collection because of the file size but not so much with the free one or a reduced set.
|
73
|
+
In order to use copy the `fontawesome/advanced-options/metadata/icons.json` in `app/assets/javascripts/icons.json`
|
74
74
|
|
75
75
|
`raw` requires to push in your codebase all 2.986 icons unless they are hosted in a CDN, AWS or just a different repo.
|
76
76
|
|
@@ -80,9 +80,15 @@ which makes them available for anyone to download whereas the `raw` ones are 'hi
|
|
80
80
|
Read more about svg sprites in the [docs](https://fontawesome.com/how-to-use/svg-sprites)
|
81
81
|
and [browser support](https://fontawesome.com/how-to-use/svg-sprites#browser-support)
|
82
82
|
|
83
|
+
`js` uses the recommended way from Font-Awesome however it introduces a rendering issue relating to turbolinks
|
84
|
+
[more info](https://github.com/FortAwesome/Font-Awesome/issues/11924)
|
85
|
+
|
83
86
|
However the paths to the icons can be configured and as long the parent folder with the style name i.e. `solid`, `regular`
|
84
87
|
and so on remains the same feel free to place anywhere you like and if possible share your solution !
|
85
88
|
|
89
|
+
It is best not to mix the `source_type` configurations if you decide to switch between two types make sure to keep only the
|
90
|
+
assets relating to that `source_type` in order to avoid manifestations of unexpected behavior.
|
91
|
+
|
86
92
|
At the same time feel free to create a pull request if you have another idea on how to include them
|
87
93
|
or create an issue requesting a missing feature.
|
88
94
|
|
data/faw_icon.gemspec
CHANGED
@@ -8,7 +8,7 @@ Gem::Specification.new do |spec|
|
|
8
8
|
spec.authors = ['alexwebgr']
|
9
9
|
spec.email = ['email@alex-web.gr']
|
10
10
|
|
11
|
-
spec.summary = %q{A simple helper for Font-Awesome 5 using raw SVG}
|
11
|
+
spec.summary = %q{A simple helper for Font-Awesome 5 using raw SVG and SVG-with-JS}
|
12
12
|
spec.homepage = "https://github.com/alexwebgr/faw_icon"
|
13
13
|
spec.license = "MIT"
|
14
14
|
|
data/lib/faw_icon/helper.rb
CHANGED
@@ -8,13 +8,15 @@ module FawIcon
|
|
8
8
|
style = 'brands' if style == 'brand'
|
9
9
|
fa_prefix = FawIcon.configuration.default_family_prefix
|
10
10
|
|
11
|
-
html_props[:class] = [fa_style(style), "#{fa_prefix}-#{name}"
|
11
|
+
html_props[:class] = [fa_style(style), "#{fa_prefix}-#{name}"]
|
12
|
+
html_props[:class] << FawIcon.configuration.default_replacement_class unless FawIcon.configuration.source_type == 'js'
|
12
13
|
html_props[:class] << "#{fa_prefix}-#{options[:size]}" if options[:size]
|
13
14
|
html_props[:class] << "#{fa_prefix}-fw" if options[:fixed_width]
|
14
15
|
html_props[:class] << "#{fa_prefix}-spin" if options[:spin]
|
15
16
|
html_props[:class] << options[:extra_class] if options[:extra_class]
|
16
17
|
html_props[:transform] = options[:transform] if options[:transform]
|
17
18
|
html_props[:mask] = options[:mask] if options[:mask]
|
19
|
+
html_props[:source_type] = FawIcon.configuration.source_type
|
18
20
|
|
19
21
|
case FawIcon.configuration.source_type
|
20
22
|
when 'json'
|
@@ -23,6 +25,8 @@ module FawIcon
|
|
23
25
|
by_raw(style, name, html_props)
|
24
26
|
when 'sprite'
|
25
27
|
by_sprite(style, name, html_props)
|
28
|
+
when 'js'
|
29
|
+
by_js(html_props)
|
26
30
|
end
|
27
31
|
end
|
28
32
|
|
@@ -55,12 +59,19 @@ module FawIcon
|
|
55
59
|
fa_tag(svg, html_props)
|
56
60
|
end
|
57
61
|
|
62
|
+
def by_js(html_props)
|
63
|
+
doc = REXML::Document.new('<i> </i>')
|
64
|
+
|
65
|
+
fa_tag(doc.root, html_props)
|
66
|
+
end
|
67
|
+
|
58
68
|
def fa_tag(svg = nil, html_props)
|
59
69
|
svg = svg_not_found if svg.nil?
|
60
70
|
|
61
71
|
svg.attributes['class'] = html_props[:class].join(' ')
|
62
72
|
svg.attributes['data-fa-transform'] = html_props[:transform] if html_props[:transform]
|
63
73
|
svg.attributes['data-fa-mask'] = html_props[:mask] if html_props[:mask]
|
74
|
+
svg.attributes['data-source-type'] = html_props[:source_type] if html_props[:source_type]
|
64
75
|
|
65
76
|
svg.to_s.html_safe
|
66
77
|
end
|
data/lib/faw_icon/version.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: faw_icon
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.8.4
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- alexwebgr
|
8
8
|
autorequire:
|
9
9
|
bindir: exe
|
10
10
|
cert_chain: []
|
11
|
-
date: 2018-06-
|
11
|
+
date: 2018-06-05 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|
@@ -96,5 +96,5 @@ rubyforge_project:
|
|
96
96
|
rubygems_version: 2.7.6
|
97
97
|
signing_key:
|
98
98
|
specification_version: 4
|
99
|
-
summary: A simple helper for Font-Awesome 5 using raw SVG
|
99
|
+
summary: A simple helper for Font-Awesome 5 using raw SVG and SVG-with-JS
|
100
100
|
test_files: []
|