Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

octicons_gem

Package Overview
Dependencies
Maintainers
13
Versions
106
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

octicons_gem

Don't install

  • 7.4.0-alpha.4baea4bb
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
3
decreased by-62.5%
Maintainers
13
Weekly downloads
 
Created
Source

Octicons gem

Gem version Build Status

Octicons gem to distribute octicons svg

Install

Add this to your Gemfile

gem 'octicons'

Then bundle install.

Usage

require 'octicons'
icon = Octicons::Octicon.new("x")
icon.to_svg
# <svg class="octicon octicon-x" viewBox="0 0 16 16" width="16" height="16" version="1.1" "aria-hidden"="true"><path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path></svg>

Documentation

The Octicon class takes two arguments. The first is the symbol of the icon, and the second is a hash of arguments representing html attributes

symbol (required)

This is the name of the octicon you want to use. For example alert. Full list of icons

Options
  • :height - When setting the height to a number, the icon will scale to that size. For example, passing 32, will calculate the width based on the icon's natural size.
  • :width - When setting the width to a number, the icon will scale to that size. For example, passing 32, will calculate the width based on the icon's natural size.

If both :width, :height are passed into the options hash, then the icon will be sized exactly at those dimensions.

Attributes

Once initialized, you can read a few properties from the icon.

symbol

Returns the string of the symbol name

icon = Octicons::Octicon.new("x")
icon.symbol
# "x"
path

Path returns the string representation of the path of the icon.

icon = Octicons::Octicon.new("x")
icon.path
# <path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path>
options

This is a hash of all the options that will be added to the output tag.

icon = Octicons::Octicon.new("x")
icon.options
# {:class=>"octicon octicon-x", :viewBox=>"0 0 12 16", :version=>"1.1", :width=>12, :height=>16, :"aria-hidden"=>"true"}
width

Width is the icon's true width. Based on the svg view box width. Note, this doesn't change if you scale it up with size options, it only is the natural width of the icon

height

Height is the icon's true height. Based on the svg view box height. Note, this doesn't change if you scale it up with size options, it only is the natural height of the icon

keywords

Returns an array of keywords for the icon. The data comes from the data file in lib. Consider contributing more aliases for the icons.

icon = Octicons::Octicon.new("x")
icon.keywords
# ["remove", "close", "delete"]
Methods
to_svg

Returns a string of the svg tag

icon = Octicons::Octicon.new("x")
icon.to_svg
# <svg class="octicon octicon-x" viewBox="0 0 16 16" width="16" height="16" version="1.1" "aria-hidden"="true"><path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path></svg>

Documentation

For a full list of options available, see the octicons_gem documentation

License

(c) GitHub, Inc.

When using the GitHub logos, be sure to follow the GitHub logo guidelines.

MIT

FAQs

Package last updated on 27 Jun 2018

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc