Socket
Socket
Sign inDemoInstall

graphicss

Package Overview
Dependencies
41
Maintainers
1
Versions
2
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    graphicss

graphicss =


Version published
Maintainers
1
Install size
1.12 MB
Created

Readme

Source

graphicss

Create css for your images

Build Status

Installation

npm install -D graphicss

Options

  • outdir - destination folder (default: dist)
  • outfilename - filename to use for output (default: graphics)
  • include - files to include. following glob-all conventions. (default : ['**/*.{svg,png}', '!node_modules/**/*'])
  • classnamePattern - pattern to use for classnames. (default: icon-%s)

Usage

graphicss --classnamePattern --outdir build-output --outfilename main --include **/*.png --include **/*.svg --include !node_modules

Output Example

Look at the example folder and the example-dist to see input and output examples

This is the generated css file

.example-camera:before{  height : 206px ; width: 406px; display:block; content:''; background:url('example/camera.svg') no-repeat; }

Note that the css assumes the path to the graphics remains the same. So if the graphics were at example/, they will still be there.
The intention is that you will copy the graphics folders as is (after optimization with svgo perhaps?) to your dist folder.

Alongside it there's an html file showing all the possible icons.

FAQs

Last updated on 28 Nov 2016

Did you know?

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

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc