sassc-inline-svg 0.0.1 → 0.0.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 +4 -4
- data/.gitignore +5 -0
- data/.rspec +3 -0
- data/README.md +21 -7
- data/lib/sassc-inline-svg.rb +19 -10
- data/lib/sassc-inline-svg/version.rb +1 -1
- data/sassc-inline-svg.gemspec +3 -0
- data/spec/sassc-inline-svg/functions_spec.rb +79 -0
- data/spec/sassc-inline-svg/version_spec.rb +8 -0
- data/spec/spec_helper.rb +20 -0
- data/spec/support/files/encoded_svg.txt +1 -0
- data/spec/support/files/encoded_svg_with_options.txt +1 -0
- data/spec/support/files/example.svg +25 -0
- metadata +38 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 45fab522fafd72280e5c32a70f46201cf31cb3936c931b73e53609e6b81f68ab
|
4
|
+
data.tar.gz: ec172364ac155f64c36c922859493e7228790fb3bf12b6db55fc6954cdc497b3
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 48d62ecf4fa8c9e1ae0602b408954a5727971379863b5a3ed56a46a03c25a24d33088214d5020aca707c98b257907dbcd2859c98d2b2c988a92d54d3a81aa01a
|
7
|
+
data.tar.gz: bd9631d10eac751d06bc82c46d7a529a75d1f58285b580824bf06fb6ce009c12465d58f2e8875d6ac21b29d2676dac1288b70a2076d69d3b71fe56378dd95e1d
|
data/.rspec
ADDED
data/README.md
CHANGED
@@ -1,12 +1,26 @@
|
|
1
|
-
|
1
|
+
# sassс-inline-svg
|
2
|
+
|
3
|
+
[](https://badge.fury.io/rb/sassc-inline-svg)
|
4
|
+
|
5
|
+
Inline url-encoded SVG with Sassc. Optional variable string replacement included!
|
6
|
+
|
7
|
+
Inspired by https://github.com/franzheidl/sass-inline-svg
|
8
|
+
|
9
|
+
## Installation
|
10
|
+
|
11
|
+
gem install sassc-inline-svg
|
12
|
+
|
13
|
+
Add this line to your application's Gemfile:
|
14
|
+
|
15
|
+
gem 'sassc-inline-svg'
|
16
|
+
|
2
17
|
## Usage
|
3
|
-
|
18
|
+
|
19
|
+
Sassc-inline-svg adds a `inline_svg` function you can use with Sass. It url-encodes the contents of the specified file and inlines it in your CSS (Url-encoded SVG is about 30% smaller than base64).
|
20
|
+
|
21
|
+
|
22
|
+
```css
|
4
23
|
.block {
|
5
24
|
background: #0e4573 inline_svg('example.svg', (fillcolor: '#23b3e8')) no-repeat;
|
6
25
|
}
|
7
26
|
```
|
8
|
-
## Installing gem
|
9
|
-
Add to your Gemfile:
|
10
|
-
```ruby
|
11
|
-
gem 'sassc-inline-svg'
|
12
|
-
```
|
data/lib/sassc-inline-svg.rb
CHANGED
@@ -7,22 +7,17 @@ require 'cgi'
|
|
7
7
|
module SassC::InlineSVG
|
8
8
|
module Functions
|
9
9
|
def inline_svg(path, options = nil)
|
10
|
-
sprockets_context.depend_on_asset(path.value)
|
11
10
|
svg = read_file(path.value.strip)
|
12
|
-
|
13
|
-
SassC::Script::Value::String.new(
|
11
|
+
svg = replace_options(svg, options)
|
12
|
+
SassC::Script::Value::String.new(encode_url(svg))
|
14
13
|
end
|
15
14
|
|
16
15
|
private
|
17
16
|
|
18
|
-
def encoded_url(svg)
|
19
|
-
encoded = CGI::escape(svg).gsub("+", "%20")
|
20
|
-
"url('data:image/svg+xml;charset=utf-8," + encoded + "')"
|
21
|
-
end
|
22
|
-
|
23
17
|
def read_file(path)
|
24
|
-
if defined?(Rails)
|
25
|
-
|
18
|
+
if defined?(Rails) && Rails.application
|
19
|
+
source = Rails.application.assets || ::Sprockets::Railtie.build_environment(Rails.application)
|
20
|
+
asset = source.find_asset(path)
|
26
21
|
raise "File not found or cannot be read (Sprockets): #{path}" if asset.nil?
|
27
22
|
|
28
23
|
return asset.to_s
|
@@ -31,6 +26,20 @@ module SassC::InlineSVG
|
|
31
26
|
|
32
27
|
File.open(path, 'rb') { |f| f.read }.strip
|
33
28
|
end
|
29
|
+
|
30
|
+
def replace_options(svg, options)
|
31
|
+
return svg if options.nil?
|
32
|
+
|
33
|
+
options.value.each_pair do |k, v|
|
34
|
+
svg.gsub!(k.value, v.value) if svg.include?(k.value)
|
35
|
+
end
|
36
|
+
svg
|
37
|
+
end
|
38
|
+
|
39
|
+
def encode_url(svg)
|
40
|
+
encoded = CGI::escape(svg).gsub("+", "%20")
|
41
|
+
"url('data:image/svg+xml;charset=utf-8," + encoded + "')"
|
42
|
+
end
|
34
43
|
end
|
35
44
|
end
|
36
45
|
|
data/sassc-inline-svg.gemspec
CHANGED
@@ -0,0 +1,79 @@
|
|
1
|
+
# encoding: UTF-8
|
2
|
+
# frozen_string_literal: true
|
3
|
+
|
4
|
+
RSpec.describe 'Functions' do
|
5
|
+
let(:dummy_class) { Class.new { extend SassC::InlineSVG::Functions } }
|
6
|
+
let(:options) { nil }
|
7
|
+
let(:path) { OpenStruct.new(value: file_path) }
|
8
|
+
|
9
|
+
subject { dummy_class.inline_svg(path, options) }
|
10
|
+
|
11
|
+
context 'when is this app without rails' do
|
12
|
+
context 'when the file is found' do
|
13
|
+
let(:file_path) { 'spec/support/files/example.svg' }
|
14
|
+
|
15
|
+
context 'without options' do
|
16
|
+
it 'returns encoded url' do
|
17
|
+
expect(subject.value).to eq(File.read('spec/support/files/encoded_svg.txt'))
|
18
|
+
end
|
19
|
+
end
|
20
|
+
|
21
|
+
context 'with options' do
|
22
|
+
let(:options) { OpenStruct.new(value: { OpenStruct.new(value: 'fillcolor') => OpenStruct.new(value: '#0e4573')}) }
|
23
|
+
|
24
|
+
it 'returns encoded url' do
|
25
|
+
expect(subject.value).to eq(File.read('spec/support/files/encoded_svg_with_options.txt'))
|
26
|
+
end
|
27
|
+
end
|
28
|
+
end
|
29
|
+
|
30
|
+
context 'when the file is not found' do
|
31
|
+
let(:file_path) { 'example.svg' }
|
32
|
+
|
33
|
+
context 'when is this app without rails' do
|
34
|
+
it 'returns encoded url' do
|
35
|
+
expect { subject.value }.to raise_error('File not found or cannot be read (native): example.svg')
|
36
|
+
end
|
37
|
+
end
|
38
|
+
end
|
39
|
+
end
|
40
|
+
|
41
|
+
context 'when is this a rails app' do
|
42
|
+
before do
|
43
|
+
stub_const 'Rails', OpenStruct.new(application: OpenStruct.new(assets: Class.new))
|
44
|
+
allow(Rails.application.assets).to receive(:find_asset) { File.read(file_path) }
|
45
|
+
end
|
46
|
+
|
47
|
+
context 'when the file is found' do
|
48
|
+
let(:file_path) { 'spec/support/files/example.svg' }
|
49
|
+
|
50
|
+
context 'without options' do
|
51
|
+
it 'returns encoded url' do
|
52
|
+
expect(subject.value).to eq(File.read('spec/support/files/encoded_svg.txt'))
|
53
|
+
end
|
54
|
+
end
|
55
|
+
|
56
|
+
context 'with options' do
|
57
|
+
let(:options) { OpenStruct.new(value: { OpenStruct.new(value: 'fillcolor') => OpenStruct.new(value: '#0e4573')}) }
|
58
|
+
|
59
|
+
it 'returns encoded url' do
|
60
|
+
expect(subject.value).to eq(File.read('spec/support/files/encoded_svg_with_options.txt'))
|
61
|
+
end
|
62
|
+
end
|
63
|
+
end
|
64
|
+
|
65
|
+
context 'when the file is not found' do
|
66
|
+
let(:file_path) { 'example.svg' }
|
67
|
+
|
68
|
+
before do
|
69
|
+
allow(Rails.application.assets).to receive(:find_asset) { nil }
|
70
|
+
end
|
71
|
+
|
72
|
+
context 'when is this app without rails' do
|
73
|
+
it 'returns encoded url' do
|
74
|
+
expect { subject.value }.to raise_error('File not found or cannot be read (Sprockets): example.svg')
|
75
|
+
end
|
76
|
+
end
|
77
|
+
end
|
78
|
+
end
|
79
|
+
end
|
data/spec/spec_helper.rb
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
# encoding: UTF-8
|
2
|
+
# frozen_string_literal: true
|
3
|
+
|
4
|
+
require 'bundler/setup'
|
5
|
+
require 'sassc-inline-svg'
|
6
|
+
|
7
|
+
require 'simplecov'
|
8
|
+
SimpleCov.start
|
9
|
+
|
10
|
+
RSpec.configure do |config|
|
11
|
+
# Disable RSpec exposing methods globally on `Module` and `main`
|
12
|
+
config.disable_monkey_patching!
|
13
|
+
|
14
|
+
config.filter_run focus: true
|
15
|
+
config.run_all_when_everything_filtered = true
|
16
|
+
|
17
|
+
config.expect_with :rspec do |c|
|
18
|
+
c.syntax = :expect
|
19
|
+
end
|
20
|
+
end
|
@@ -0,0 +1 @@
|
|
1
|
+
url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%2235%2025%2030%2050%22%20version%3D%221.1%22%3E%0A%20%20%3Cg%20fill%3D%22fillcolor%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M67.5251263%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C68.8919613%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2071.1080387%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2072.4748737%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C73.8417088%2C61.1080387%0A%20%20%20%20%20%20%20%20%20%20%20%20%2073.8417088%2C58.8919613%0A%20%20%20%20%20%20%20%20%20%20%20%20%2072.4748737%2C57.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L52.4748737%2C37.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C51.1080387%2C36.1582912%0A%20%20%20%20%20%20%20%20%20%20%20%20%2048.8919613%2C36.1582912%0A%20%20%20%20%20%20%20%20%20%20%20%20%2047.5251263%2C37.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L27.5251263%2C57.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C26.1582912%2C58.8919613%0A%20%20%20%20%20%20%20%20%20%20%20%20%2026.1582912%2C61.1080387%0A%20%20%20%20%20%20%20%20%20%20%20%20%2027.5251263%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C28.8919613%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2031.1080387%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2032.4748737%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L50.0095722%2C44.9401752%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L67.5251263%2C62.4748737%20Z%22%0A%20%20%20%20%20%20%20%20%20%20transform%3D%22translate%2850.000000%2C%2050.000000%29%20rotate%28-90.000000%29%20translate%28-50.000000%2C%20-50.000000%29%20%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E')
|
@@ -0,0 +1 @@
|
|
1
|
+
url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%2235%2025%2030%2050%22%20version%3D%221.1%22%3E%0A%20%20%3Cg%20fill%3D%22%230e4573%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M67.5251263%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C68.8919613%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2071.1080387%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2072.4748737%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C73.8417088%2C61.1080387%0A%20%20%20%20%20%20%20%20%20%20%20%20%2073.8417088%2C58.8919613%0A%20%20%20%20%20%20%20%20%20%20%20%20%2072.4748737%2C57.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L52.4748737%2C37.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C51.1080387%2C36.1582912%0A%20%20%20%20%20%20%20%20%20%20%20%20%2048.8919613%2C36.1582912%0A%20%20%20%20%20%20%20%20%20%20%20%20%2047.5251263%2C37.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L27.5251263%2C57.5251263%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C26.1582912%2C58.8919613%0A%20%20%20%20%20%20%20%20%20%20%20%20%2026.1582912%2C61.1080387%0A%20%20%20%20%20%20%20%20%20%20%20%20%2027.5251263%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20C28.8919613%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2031.1080387%2C63.8417088%0A%20%20%20%20%20%20%20%20%20%20%20%20%2032.4748737%2C62.4748737%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L50.0095722%2C44.9401752%0A%20%20%20%20%20%20%20%20%20%20%20%20%20L67.5251263%2C62.4748737%20Z%22%0A%20%20%20%20%20%20%20%20%20%20transform%3D%22translate%2850.000000%2C%2050.000000%29%20rotate%28-90.000000%29%20translate%28-50.000000%2C%20-50.000000%29%20%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E')
|
@@ -0,0 +1,25 @@
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="35 25 30 50" version="1.1">
|
2
|
+
<g fill="fillcolor">
|
3
|
+
<path d="M67.5251263,62.4748737
|
4
|
+
C68.8919613,63.8417088
|
5
|
+
71.1080387,63.8417088
|
6
|
+
72.4748737,62.4748737
|
7
|
+
C73.8417088,61.1080387
|
8
|
+
73.8417088,58.8919613
|
9
|
+
72.4748737,57.5251263
|
10
|
+
L52.4748737,37.5251263
|
11
|
+
C51.1080387,36.1582912
|
12
|
+
48.8919613,36.1582912
|
13
|
+
47.5251263,37.5251263
|
14
|
+
L27.5251263,57.5251263
|
15
|
+
C26.1582912,58.8919613
|
16
|
+
26.1582912,61.1080387
|
17
|
+
27.5251263,62.4748737
|
18
|
+
C28.8919613,63.8417088
|
19
|
+
31.1080387,63.8417088
|
20
|
+
32.4748737,62.4748737
|
21
|
+
L50.0095722,44.9401752
|
22
|
+
L67.5251263,62.4748737 Z"
|
23
|
+
transform="translate(50.000000, 50.000000) rotate(-90.000000) translate(-50.000000, -50.000000) "/>
|
24
|
+
</g>
|
25
|
+
</svg>
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: sassc-inline-svg
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.2
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Dmitry Leonov
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2020-10-
|
11
|
+
date: 2020-10-26 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: sassc-rails
|
@@ -24,17 +24,53 @@ dependencies:
|
|
24
24
|
- - "~>"
|
25
25
|
- !ruby/object:Gem::Version
|
26
26
|
version: '2.0'
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: rspec
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - "~>"
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: '3.0'
|
34
|
+
type: :development
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - "~>"
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: '3.0'
|
41
|
+
- !ruby/object:Gem::Dependency
|
42
|
+
name: simplecov
|
43
|
+
requirement: !ruby/object:Gem::Requirement
|
44
|
+
requirements:
|
45
|
+
- - "~>"
|
46
|
+
- !ruby/object:Gem::Version
|
47
|
+
version: '0.19'
|
48
|
+
type: :development
|
49
|
+
prerelease: false
|
50
|
+
version_requirements: !ruby/object:Gem::Requirement
|
51
|
+
requirements:
|
52
|
+
- - "~>"
|
53
|
+
- !ruby/object:Gem::Version
|
54
|
+
version: '0.19'
|
27
55
|
description: Adds inline_svg as a Sass function.
|
28
56
|
email: ordm67@gmail.com
|
29
57
|
executables: []
|
30
58
|
extensions: []
|
31
59
|
extra_rdoc_files: []
|
32
60
|
files:
|
61
|
+
- ".gitignore"
|
62
|
+
- ".rspec"
|
33
63
|
- Gemfile
|
34
64
|
- README.md
|
35
65
|
- lib/sassc-inline-svg.rb
|
36
66
|
- lib/sassc-inline-svg/version.rb
|
37
67
|
- sassc-inline-svg.gemspec
|
68
|
+
- spec/sassc-inline-svg/functions_spec.rb
|
69
|
+
- spec/sassc-inline-svg/version_spec.rb
|
70
|
+
- spec/spec_helper.rb
|
71
|
+
- spec/support/files/encoded_svg.txt
|
72
|
+
- spec/support/files/encoded_svg_with_options.txt
|
73
|
+
- spec/support/files/example.svg
|
38
74
|
homepage: https://github.com/OrdinaryMagic/sassc-inline-svg
|
39
75
|
licenses:
|
40
76
|
- MIT
|