middleman-inline_svg 0.1.1 → 0.1.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.
Files changed (8) hide show
  1. checksums.yaml +4 -4
  2. data/LICENSE.md +21 -0
  3. data/README.md +122 -0
  4. data/lib/middleman-inline_svg/inline_svg.rb +6 -8
  5. data/lib/middleman-inline_svg/middleman-inline_svg.rb +11 -3
  6. data/middleman-inline_svg.gemspec +1 -1
  7. data/test/middleman-inline_svg/inline_svg_test.rb +4 -4
  8. metadata +3 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 2b1a85d31921e16243ef81d9922f15d7d473977c486a672b724b0cf2cd96b7a6
4
- data.tar.gz: d405a91fc7d9738e8e24eb347233b5018918cf75949808835284c57b5632fbfb
3
+ metadata.gz: fc7f910f04d36f40f840fe8763c4928479d1b813524474126db64d06b9206bcd
4
+ data.tar.gz: 60d2fefe630776965dad8d7c054cde4e21f12b5726690fe2e98d776af401399c
5
5
  SHA512:
6
- metadata.gz: 25cac6fc7106c5ba23dfbea1f775b082cd6475270570ee6b23d44ff9485c22250a32fa203ba15f3e68ca09e15d783c72ee24f0833607fe3f763f996e731a38cd
7
- data.tar.gz: 28d907dca651358cb5a507f18da4cd0c72fc3c387ac6fbc2a86193fc3545488d0ae4b118aaf33e5517e4c69be157c7ad0fe98c37d49b58790206ec6b5a41316a
6
+ metadata.gz: 8f05e76a64e501344404bb71812e51883d23a28c514582587ddc4252fc6bdd28e5183e4ff75a56d2e4a5a4372d5d305cfc9bd8db26e6dc17b82250e2490daed6
7
+ data.tar.gz: c8350aedb7f092f1a187a06b9a4ba554ccd01bb2b8f30742d824cf1e74f77dbe0cedc8614513638013de2391c4219b403696f30a3e1722c944cdba50e898874d
data/LICENSE.md ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright © 2017 Daniel Barber, Tyson Gach and thoughtbot, inc.
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
data/README.md CHANGED
@@ -2,3 +2,125 @@
2
2
 
3
3
  [![CircleCI](https://circleci.com/gh/thoughtbot/middleman-inline_svg.svg?style=svg)](https://circleci.com/gh/thoughtbot/middleman-inline_svg)
4
4
 
5
+ A [Middleman] extension that enables the inlining of SVG's. This gives us the
6
+ ability to style those SVG's using standard CSS.
7
+
8
+ ## Installation
9
+
10
+ 1. Add middleman-inline_svg to your `Gemfile`:
11
+
12
+ ```ruby
13
+ gem "middleman-inline_svg"
14
+ ```
15
+
16
+ 1. Install the gem:
17
+
18
+ ```bash
19
+ bundle install
20
+ ```
21
+
22
+ 1. Activate the extension in `config.rb`:
23
+
24
+ ```ruby
25
+ activate :inline_svg
26
+ ```
27
+
28
+ ## Usage
29
+
30
+ `middleman-inline_svg` provides an `inline_svg` helper that you can use in your
31
+ templates. Using it will inline your SVG markup directly into the HTML enabling
32
+ you to style it with CSS.
33
+
34
+ Given the following SVG file named `ruby.svg`:
35
+
36
+ ```xml
37
+ <?xml version="1.0" encoding="UTF-8"?>
38
+ <svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
39
+ <g id="ruby" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
40
+ <!-- ... -->
41
+ </g>
42
+ </svg>
43
+ ```
44
+
45
+ And the following code in a Middleman template:
46
+
47
+ ```erb
48
+ <a>
49
+ <%= inline_svg "ruby.svg" %> Ruby
50
+ </a>
51
+ ```
52
+
53
+ Middleman will output the following:
54
+
55
+ ```html
56
+ <a>
57
+ <svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
58
+ <g id="ruby" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
59
+ <!-- ... -->
60
+ </g>
61
+ </svg>
62
+ Ruby
63
+ </a>
64
+ ```
65
+
66
+ It's possible to specify a title for the SVG. And any other options passed will
67
+ be rendered as attributes on the `<svg/>` element. Adding a title to your SVG
68
+ will improve accessibility.
69
+
70
+ ```erb
71
+ <a>
72
+ <%= inline_svg "ruby.svg",
73
+ title: "Ruby logo",
74
+ class: "ruby-logo",
75
+ role: "img" %>
76
+ Ruby
77
+ </a>
78
+ ```
79
+
80
+ ```html
81
+ <a>
82
+ <svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="ruby-logo" role="img">
83
+ <title>Ruby logo</title>
84
+ <g id="ruby" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
85
+ <!-- ... -->
86
+ </g>
87
+ </svg>
88
+ Ruby
89
+ </a>
90
+ ```
91
+
92
+ Underscores are translated into hyphens in the output.
93
+
94
+ ```erb
95
+ <a>
96
+ <%= inline_svg "ruby.svg",
97
+ title: "Ruby logo",
98
+ class: "ruby-logo",
99
+ aria_hidden: true %>
100
+ Ruby
101
+ </a>
102
+ ```
103
+
104
+ ```html
105
+ <a>
106
+ <svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true">
107
+ <g id="ruby" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
108
+ <!-- ... -->
109
+ </g>
110
+ </svg>
111
+ Ruby
112
+ </a>
113
+ ```
114
+
115
+ ## Configuration
116
+
117
+ You can configure the default attributes/title in the Middleman `config.rb` file
118
+ when the extension is activated:
119
+
120
+ ```ruby
121
+ activate :inline_svg do |config|
122
+ config.defaults = {
123
+ role: img
124
+ }
125
+ end
126
+ ```
data/lib/middleman-inline_svg/inline_svg.rb CHANGED
@@ -1,16 +1,16 @@
1
1
  require "nokogiri"
2
2
 
3
3
  class InlineSVG
4
- attr_reader :file_name, :options, :title
4
+ attr_reader :file, :options, :title
5
5
 
6
- def initialize(file_name, options = {})
7
- @file_name = file_name
6
+ def initialize(file, options = {})
7
+ @file = file
8
8
  @title = options.delete(:title)
9
9
  @options = options
10
10
  end
11
11
 
12
12
  def to_html
13
- doc = asset_doc(file_name)
13
+ doc = asset_doc(file)
14
14
  svg = doc.at_css("svg")
15
15
 
16
16
  if title
@@ -34,9 +34,7 @@ class InlineSVG
34
34
  svg.prepend_child(title_node)
35
35
  end
36
36
 
37
- def asset_doc(file_name)
38
- File.open(file_name) do |f|
39
- ::Nokogiri::XML(f)
40
- end
37
+ def asset_doc(file)
38
+ ::Nokogiri::XML(file)
41
39
  end
42
40
  end
data/lib/middleman-inline_svg/middleman-inline_svg.rb CHANGED
@@ -3,17 +3,25 @@ require "middleman-inline_svg/inline_svg"
3
3
  class MiddlemanInlineSVG < ::Middleman::Extension
4
4
  expose_to_template :inline_svg
5
5
 
6
+ option :defaults, {}, "Default options for the svg"
7
+
6
8
  def initialize(app, options_hash = {}, &block)
7
9
  super
8
10
  end
9
11
 
10
- def inline_svg(file_name, options = {})
11
- InlineSVG.new(asset_file(file_name), options).to_html
12
+ def inline_svg(file_name, opts = {})
13
+ opts = options.defaults.merge(opts)
14
+
15
+ InlineSVG.new(asset_file(file_name), opts).to_html
12
16
  end
13
17
 
14
18
  private
15
19
 
16
20
  def asset_file(file_name)
17
- File.join(app.config[:source], app.config[:images_dir], file_name)
21
+ File.open(File.join(file_path, file_name))
22
+ end
23
+
24
+ def file_path
25
+ File.join(app.config[:source], app.config[:images_dir])
18
26
  end
19
27
  end
data/middleman-inline_svg.gemspec CHANGED
@@ -4,7 +4,7 @@ $:.push File.expand_path("lib", __dir__)
4
4
 
5
5
  Gem::Specification.new do |s|
6
6
  s.name = "middleman-inline_svg"
7
- s.version = "0.1.1"
7
+ s.version = "0.1.2"
8
8
  s.platform = Gem::Platform::RUBY
9
9
  s.authors = ["Daniel Barber", "Tyson Gach"]
10
10
  s.email = ["github@danbarber.me", "tyson@thoughtbot.com"]
data/test/middleman-inline_svg/inline_svg_test.rb CHANGED
@@ -5,7 +5,7 @@ require_relative "../../lib/middleman-inline_svg/inline_svg"
5
5
  class TestInlineSVG < Minitest::Test
6
6
  def test_it_adds_a_title
7
7
  new_svg = InlineSVG.new(
8
- "test/fixtures/circle.svg",
8
+ File.open("test/fixtures/circle.svg"),
9
9
  title: "Circle",
10
10
  ).to_html
11
11
 
@@ -20,7 +20,7 @@ class TestInlineSVG < Minitest::Test
20
20
 
21
21
  def test_it_adds_a_class
22
22
  new_svg = InlineSVG.new(
23
- "test/fixtures/circle.svg",
23
+ File.open("test/fixtures/circle.svg"),
24
24
  class: "circle",
25
25
  ).to_html
26
26
 
@@ -35,7 +35,7 @@ class TestInlineSVG < Minitest::Test
35
35
 
36
36
  def test_it_adds_multiple_attributes
37
37
  new_svg = InlineSVG.new(
38
- "test/fixtures/circle.svg",
38
+ File.open("test/fixtures/circle.svg"),
39
39
  class: "circle",
40
40
  role: "img",
41
41
  id: "circle",
@@ -52,7 +52,7 @@ class TestInlineSVG < Minitest::Test
52
52
 
53
53
  def test_it_transforms_attribute_names
54
54
  new_svg = InlineSVG.new(
55
- "test/fixtures/circle.svg",
55
+ File.open("test/fixtures/circle.svg"),
56
56
  aria_hidden: true,
57
57
  ).to_html
58
58
 
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: middleman-inline_svg
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.1
4
+ version: 0.1.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - Daniel Barber
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2018-04-10 00:00:00.000000000 Z
12
+ date: 2018-04-30 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: middleman-core
@@ -50,6 +50,7 @@ files:
50
50
  - ".circleci/config.yml"
51
51
  - ".gitignore"
52
52
  - Gemfile
53
+ - LICENSE.md
53
54
  - README.md
54
55
  - Rakefile
55
56
  - features/support/env.rb