fa_rails 0.1.19 → 0.1.24

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a81bde1565370f75213aca86e1c432726e01abd3728b6b5b03c6945071ef4129
-  data.tar.gz: 2438f2c1a9a9e904baebf0dcea5cb9717671bea5b435a1e2a48981dd50c9cadd
+  metadata.gz: 69c12667e2d247c861e7c71c731f6b8f32af38d347df7a923263ffba1d3c2cef
+  data.tar.gz: a3b77f362a60c92ec5ef2184d1e8b46dbd9dd99dcd6c6cf7095bfc65bd3b3a14
 SHA512:
-  metadata.gz: 9827cf41bc93a5f7a5cbbb053c4c3a98c506dc0484a6688dcdab49396220ebf24c98ec4c5e90b93d60a1545811a8f7d36c04b2f91f43dddd17d93f3fb0dbe989
-  data.tar.gz: 397edebc13362c58052348c122fe95543059bbea1f7de183a4388182f6ce0ba003064522db82100a89218b933781e55a159418d64bb0f1c51480d7e60e2acb41
+  metadata.gz: d275d6951f206dedc9a22589825a16063af2f68ca93b85a9b6264182885a3e04356bf7fed1e6677800d7a6137c4bf8c5d95cda9d5280f8591ebd99c2915a4539
+  data.tar.gz: 20e364aa0cacf00c866c1a129bfb391407e55158564255ebc068bd558cc24d02ee1c7c7d3f3428c5a5016ed0719ef055da421d36408623a49109e0264a101e3e

data/.ruby-version

@@ -0,0 +1 @@
+2.5.1

data/.travis.yml

@@ -8,6 +8,8 @@ notifications:
   email:
     on_success: change
     on_failure: always
+before_install:
+  - gem install bundler -v '< 2'
 before_script:
   - curl -L https://codeclimate.com/downloads/test-reporter/test-reporter-latest-linux-amd64 > ./cc-test-reporter
   - chmod +x ./cc-test-reporter

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    fa_rails (0.1.18)
+    fa_rails (0.1.24)
 
 GEM
   remote: https://rubygems.org/
@@ -9,7 +9,7 @@ GEM
     diff-lcs (1.3)
     docile (1.3.1)
     json (2.1.0)
-    rake (12.3.1)
+    rake (12.3.3)
     rspec (3.7.0)
       rspec-core (~> 3.7.0)
       rspec-expectations (~> 3.7.0)

data/README.md

@@ -29,29 +29,41 @@ corresponding locations in your app, and ensure you correctly include all files.
 
 ### FontAwesome CDN
 
-Go to the FontAwesome
-[How to Use](https://fontawesome.com/how-to-use/on-the-web/setup/getting-started?using=web-fonts-with-css)
-page and copy the appropriate CDN link tag.
+You can also link into the FontAwesome CDN, in either of two ways:
 
-You can also `include FA`, then use the built-in helper method in your layout:
+#### Version-Specific Link
+
+You can use this helper method in your layout:
 
 ```ruby
 FA::Link.new(version: 'v5.3.1', integrity: 'sha384-some-key-here').safe
 ```
 
-#### Free
+Or, go to the FontAwesome
+[How to Use](https://fontawesome.com/how-to-use/on-the-web/setup/getting-started?using=web-fonts-with-css)
+page and copy the appropriate CDN link tag.
+
+**Be sure to also register each domain that will use this CDN link.**
+
+##### Free
 
 ```html
 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-some-key-here" crossorigin="anonymous">
 ```
 
-#### Pro
+##### Pro
 
 ```html
 <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-some-key-here" crossorigin="anonymous">
 ```
 
-**Be sure to also register each domain that will use this CDN link.**
+#### Kit Link
+
+Use this helper method in your layout:
+
+```ruby
+FA::Link.kit('kit-id')
+```
 
 ## Usage
 
@@ -90,6 +102,7 @@ options #=> Hash
   size: Integer # Stepped scaling factor
 
   css: String # Arbitrary CSS classes, space-delimited
+  raw_css: Hash # Arbitrary raw CSS, as a hash of attributes and values
   fa: String # Arbitrary FA classes, space-delimited – each is automatically prefixed with `fa-`
   title: String #=> Tooltip text
   grow: Integer #=> Transform value – amount to grow by
@@ -114,6 +127,7 @@ options #=> Hash
   position: Symbol # Indicator of which corner to display on – one of [:tr, :tl, :br, :bl]
 
   css: String # Arbitrary CSS classes, space-delimited
+  raw_css: Hash # Arbitrary raw CSS, as a hash of attributes and values
   fa: String # Arbitrary FA classes, space-delimited – each is automatically prefixed with `fa-`
   title: String #=> Tooltip text
   grow: Integer #=> Transform value – amount to grow by
@@ -143,24 +157,39 @@ css #=> String – arbitrary CSS classes, space-delimited, applied to the layer
 ```ruby
 # Fixed-width lock icon
 FA::Icon.p('lock', fa: 'fw')
-#=> "<i class='fas fa-fw fa-lock fa-1x' data-fa-transform='' title=''></i>"
+#=> "<i class='fas fa-fw fa-lock fa-1x' style='' data-fa-transform='' title=''></i>"
+
+# Duotone fire-alt icon with swapped opacity
+FA::Icon.p('fire-alt', fa: 'swap-opacity')
+#=> "<i class='fas fa-swap-opacity fa-fire-alt fa-1x' style='' data-fa-transform='' title=''></i>"
+
+# Duotone fire-alt icon with specified opacities
+FA::Icon.p('fire-alt', style: :duotone, raw_css: { '--fa-primary-opacity' => '0.6', '--fa-secondary-opacity' => '0.4' })
+#=> "<i class='fad fa-fire-alt fa-1x' style='--fa-primary-opacity: 0.4; --fa-secondary-opacity: 0.6;' data-fa-transform='' title=''></i>"
+
+# You can also use this simplified configuration option for adding styles
+#   This is reforatted and merged into :raw_css
+#   Accepts either snake_case symbols or spear-case strings as keys, and strings or symbols as values
+#   This is the easiest way to add primary/secondary styles for duotone icons
+FA::Icon.p('fire-alt', style: :duotone, fa_styles: { primary_opacity: '0.6', secondary_opacity: '0.4', primary_color: :green, secondary_color: '#DD2200' })
+#=> "<i class='fad fa-fire-alt fa-1x' style='--fa-primary-opacity: 0.6; --fa-secondary-opacity: 0.4; --fa-primary-color: green; --fa-secondary-color: #DD2200;' data-fa-transform='' title=''></i>"
 
 # Counter span, with value 5
 FA::Span.p('counter', 5)
-#=> "<span class='fa-layers-counter ' data-fa-transform=''>5</span>"
+#=> "<span class='fa-layers-counter ' style='' data-fa-transform=''>5</span>"
 
 # Gray envelope icon with red exclamation mark overlayed, with tooltip 'Invalid email address'
 FA::Layer.p([{ name: 'envelope', options: { css: :gray } }, { name: 'exclamation', options: { css: :red } }], title: 'Invalid email address')
 #=> "<span class='icon fa-layers fa-stack fa-fw ' title='Invalid email address'>" \
-#   "<i class='fas fa-stack-1x gray fa-envelope fa-1x' data-fa-transform='grow-0' title='Invalid email address'></i>" \
-#   "<i class='fas fa-stack-1x red fa-exclamation fa-1x' data-fa-transform='grow-0' title='Invalid email address'></i>" \
+#   "<i class='fas fa-stack-1x gray fa-envelope fa-1x' style='' data-fa-transform='grow-0' title='Invalid email address'></i>" \
+#   "<i class='fas fa-stack-1x red fa-exclamation fa-1x' style='' data-fa-transform='grow-0' title='Invalid email address'></i>" \
 #   "</span>"
 
 # Blue envelope with red counter on the top left corner, with value 7
 FA::Layer.p([{ name: 'envelope', options: { css: :blue } }, { name: 'counter', text: 7, options: { css: :red, position: :tl } }])
 #=> "<span class='icon fa-layers fa-stack fa-fw ' title=''>" \
-#   "<i class='fas fa-stack-1x blue fa-envelope fa-1x' data-fa-transform='grow-0' title=''></i>" \
-#   "<span class='fa-stack-1x red fa-layers-counter fa-layers-top-left' data-fa-transform='grow-0'>7</span>" \
+#   "<i class='fas fa-stack-1x blue fa-envelope fa-1x' style='' data-fa-transform='grow-0' title=''></i>" \
+#   "<span class='fa-stack-1x red fa-layers-counter fa-layers-top-left' style='' data-fa-transform='grow-0'>7</span>" \
 #   "</span>"
 
 # The same stack, but using the FA::Build DSL (with various syntaxes).

data/fa_rails.gemspec

@@ -1,7 +1,7 @@
 Gem::Specification.new do |s|
   s.name          = 'fa_rails'
-  s.version       = '0.1.19'
-  s.date          = '2019-07-29'
+  s.version       = '0.1.24'
+  s.date          = '2021-02-14'
   s.summary       = 'FontAwesome helper for Rails'
   s.description   = 'A helper module for using FontAwesome icons in Rails.'
   s.homepage      = 'http://rubygems.org/gems/fa_rails'

data/lib/fa/base.rb

@@ -3,6 +3,11 @@
 module FA
   # FontAwesome 5 (Pro) Helper core class for inheritance
   class Base
+    STYLES = {
+      solid: 's', regular: 'r', light: 'l', thin: 't',
+      duotone: 'd', brands: 'b', kit_upload: 'k'
+    }.freeze
+
     # Outputs the formatted string directly.
     def raw
       #
@@ -43,7 +48,7 @@ module FA
       css = @classes.flatten.join(' ')
       transforms = @transforms.join(' ')
 
-      "<i class='#{css}' data-fa-transform='#{transforms}' " \
+      "<i class='#{css}' style='#{@styles}' data-fa-transform='#{transforms}' " \
       "title='#{options[:title]}'></i>"
     end
 
@@ -59,11 +64,11 @@ module FA
       css = @classes.flatten.reject { |c| c.to_s.match?(/^fa.$/) }.join(' ')
       transforms = @transforms.join(' ')
 
-      "<span class='#{css}' data-fa-transform='#{transforms}'>#{text}</span>"
+      "<span class='#{css}' style='#{@styles}' data-fa-transform='#{transforms}'>#{text}</span>"
     end
 
     def fa_options(options)
-      default = { style: :solid, css: '', fa: '', size: 1 }
+      default = { style: :solid, css: '', raw_css: {}, fa: '', size: 1 }
 
       default.merge(options.to_h)
     end
@@ -93,6 +98,8 @@ module FA
 
     def parse_options(options)
       parse_classes(options)
+      options = merge_fa_styles(options)
+      parse_styles(options)
       parse_transforms(options)
     end
 
@@ -103,6 +110,21 @@ module FA
       @classes << options[:css].to_s.split(' ')
     end
 
+    def merge_fa_styles(options)
+      fa_styles = options.delete(:fa_styles)
+      return options unless fa_styles
+
+      fa_styles = fa_styles.each_with_object({}) do |(k, v), hash|
+        hash["--fa-#{k.to_s.tr('_', '-')}"] = v.to_s
+      end
+      options[:raw_css] = options[:raw_css].merge(fa_styles)
+      options
+    end
+
+    def parse_styles(options)
+      @styles = options[:raw_css].map { |k, v| "#{k}: #{v};" }.join(' ')
+    end
+
     def parse_transforms(options)
       @transforms = []
       %i[grow shrink rotate up down left right].each do |transform|
@@ -113,10 +135,10 @@ module FA
     end
 
     def parse_style(options)
-      return if options[:css].to_s.match?(/fa[srlb]/)
-      return 'fas' unless %i[solid regular light brands].include?(options[:style])
+      return if options[:css].to_s.match?(/fa[srldb]/)
+      return 'fas' unless STYLES.keys.include?(options[:style])
 
-      'fa' + { solid: 's', regular: 'r', light: 'l', brands: 'b' }[options[:style]]
+      'fa' + STYLES[options[:style]]
     end
   end
 end

data/spec/lib/fa_spec.rb

@@ -28,20 +28,22 @@ RSpec.describe FA do
   end
 
   describe 'icon' do
-    it 'should generate the correct icon from a string or symbol name' do
+    it 'should generate the correct icon from a string name' do
       expect(FA::Icon.p('help')).to eql(
-        "<i class='fas fa-help fa-1x' data-fa-transform='' title=''></i>"
+        "<i class='fas fa-help fa-1x' style='' data-fa-transform='' title=''></i>"
       )
+    end
 
+    it 'should generate the correct icon from a symbol name' do
       expect(FA::Icon.p(:help)).to eql(
-        "<i class='fas fa-help fa-1x' data-fa-transform='' title=''></i>"
+        "<i class='fas fa-help fa-1x' style='' data-fa-transform='' title=''></i>"
       )
     end
 
     it 'should generate the correct icon from a configuration hash' do
       fa = { name: 'help', options: { style: :light, size: 2 } }
       expect(FA::Icon.p(fa)).to eql(
-        "<i class='fal fa-help fa-2x' data-fa-transform='' title=''></i>"
+        "<i class='fal fa-help fa-2x' style='' data-fa-transform='' title=''></i>"
       )
     end
 
@@ -55,7 +57,20 @@ RSpec.describe FA do
 
     it 'should generate the correct brand icon' do
       expect(FA::Icon.p(:github, style: :brands)).to eql(
-        "<i class='fab fa-github fa-1x' data-fa-transform='' title=''></i>"
+        "<i class='fab fa-github fa-1x' style='' data-fa-transform='' title=''></i>"
+      )
+    end
+
+    it 'should generate the correct icon with styles' do
+      expect(
+        FA::Icon.p(
+          'fire-alt', style: :duotone, fa_styles: {
+            primary_opacity: '0.6', secondary_opacity: '0.4', primary_color: :green, secondary_color: '#DD2200'
+          }
+        )
+      ).to eql(
+        "<i class='fad fa-fire-alt fa-1x' style='--fa-primary-opacity: 0.6; --fa-secondary-opacity: 0.4; " \
+        "--fa-primary-color: green; --fa-secondary-color: #DD2200;' data-fa-transform='' title=''></i>"
       )
     end
   end
@@ -70,9 +85,9 @@ RSpec.describe FA do
 
       expect(FA::Layer.p(icons, grow: 2)).to eql(
         "<span class='icon fa-layers fa-stack fa-fw ' title=''>" \
-        "<i class='fas fa-stack-1x fa-square fa-1x' data-fa-transform='grow-2' title=''></i>" \
-        "<i class='fas fa-stack-1x fa-circle fa-1x' data-fa-transform='grow-3' title=''></i>" \
-        "<i class='far fa-stack-1x fa-exclamation fa-1x' data-fa-transform='grow-2' title=''></i>" \
+        "<i class='fas fa-stack-1x fa-square fa-1x' style='' data-fa-transform='grow-2' title=''></i>" \
+        "<i class='fas fa-stack-1x fa-circle fa-1x' style='' data-fa-transform='grow-3' title=''></i>" \
+        "<i class='far fa-stack-1x fa-exclamation fa-1x' style='' data-fa-transform='grow-2' title=''></i>" \
         '</span>'
       )
     end
@@ -85,8 +100,8 @@ RSpec.describe FA do
 
       expect(FA::Layer.p(icons)).to eql(
         "<span class='icon fa-layers fa-stack fa-fw ' title=''>" \
-        "<i class='fas fa-stack-1x fa-square fa-1x' data-fa-transform='grow-0' title=''></i>" \
-        "<span class='fa-stack-1x fa-layers-counter fa-layers-top-left' data-fa-transform='grow-0'>17</span>" \
+        "<i class='fas fa-stack-1x fa-square fa-1x' style='' data-fa-transform='grow-0' title=''></i>" \
+        "<span class='fa-stack-1x fa-layers-counter fa-layers-top-left' style='' data-fa-transform='grow-0'>17</span>" \
         '</span>'
       )
     end
@@ -99,8 +114,8 @@ RSpec.describe FA do
 
       expect(FA::Layer.p(icons, title: 'right')).to eql(
         "<span class='icon fa-layers fa-stack fa-fw ' title='right'>" \
-        "<i class='fas fa-stack-1x fa-square fa-1x' data-fa-transform='grow-0' title='right'></i>" \
-        "<i class='fas fa-stack-1x fa-exclamation fa-1x' data-fa-transform='grow-0' title='right'></i>" \
+        "<i class='fas fa-stack-1x fa-square fa-1x' style='' data-fa-transform='grow-0' title='right'></i>" \
+        "<i class='fas fa-stack-1x fa-exclamation fa-1x' style='' data-fa-transform='grow-0' title='right'></i>" \
         '</span>'
       )
     end
@@ -115,8 +130,8 @@ RSpec.describe FA do
 
       expect(layer).to eql(
         "<span class='icon fa-layers fa-stack fa-fw ' title=''>" \
-        "<i class='fas fa-stack-1x fa-circle fa-1x' data-fa-transform='grow-0' title=''></i>" \
-        "<span class='fa-stack-1x fa-layers-counter ' data-fa-transform='grow-0'>7</span>" \
+        "<i class='fas fa-stack-1x fa-circle fa-1x' style='' data-fa-transform='grow-0' title=''></i>" \
+        "<span class='fa-stack-1x fa-layers-counter ' style='' data-fa-transform='grow-0'>7</span>" \
         '</span>'
       )
     end
@@ -125,7 +140,7 @@ RSpec.describe FA do
   describe 'span' do
     it 'should generate the correct span from a string or symbol type' do
       expect(FA::Span.p(:text, 'Hello')).to eql(
-        "<span class='fa-layers-text ' data-fa-transform=''>Hello</span>"
+        "<span class='fa-layers-text ' style='' data-fa-transform=''>Hello</span>"
       )
     end
 
@@ -133,7 +148,7 @@ RSpec.describe FA do
       span = { type: :text, text: 'World', options: { position: :bl } }
       expect(FA::Span.p(span)).to eql(
         "<span class='fa-layers-text fa-layers-bottom-left' " \
-        "data-fa-transform=''>World</span>"
+        "style='' data-fa-transform=''>World</span>"
       )
     end
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: fa_rails
 version: !ruby/object:Gem::Version
-  version: 0.1.19
+  version: 0.1.24
 platform: ruby
 authors:
 - Julian Fiander
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-07-29 00:00:00.000000000 Z
+date: 2021-02-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rake
@@ -77,6 +77,7 @@ extensions: []
 extra_rdoc_files: []
 files:
 - ".gitignore"
+- ".ruby-version"
 - ".travis.yml"
 - Gemfile
 - Gemfile.lock
@@ -113,8 +114,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubyforge_project: 
-rubygems_version: 2.7.6
+rubygems_version: 3.1.4
 signing_key: 
 specification_version: 4
 summary: FontAwesome helper for Rails