Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

BIG-19104 Icons as SVG sprite via grunt #129

Merged
merged 2 commits into from
Jul 1, 2015
Merged

BIG-19104 Icons as SVG sprite via grunt #129

merged 2 commits into from
Jul 1, 2015

Conversation

SiTaggart
Copy link
Contributor

Add support to stencil for SVG sprites, to handle icons.

Grunt task grunt svgstore will take a folder of svg files (they still need to be clean svg exports, with no inline fill:#hex setting on the paths, I can't automate that.) and build a sprite.

The sprite is placed in a handlebars template templates/components/common/icons/icon-defs.html, which is loaded on base.html for every page to use.

You can then call an icon anywhere on the page with <svg><use xlink:href="#icon-facebook" /></svg> changing the #icon-nameOfSVGFile to your desired icon.

Also brought in the icon component from Citadel, to remove a little boilerplate from the social links styles

@bc-miko-ademagic @christopher-hegre @bc-chris-roper @haubc

@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can trash everything in these files besides the svg/path right? Or does the grunt task sort that out itself?

Edit: Looks like it does... Can probably disregard this comment. Is the <title> bit that gets outputted needed? Or is that just another byproduct of the process?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See templates/components/common/icons/icon-defs.html for outputted svg.

This are just the individual svg icons you export from where ever. Just in case you need them...

@haubc
Copy link
Contributor

haubc commented Jun 30, 2015

LGTM 👍

bc-chris-roper added a commit that referenced this pull request Jul 1, 2015
BIG-19104 Icons as SVG sprite via grunt
@bc-chris-roper bc-chris-roper merged commit 0deb769 into bigcommerce:master Jul 1, 2015
@SiTaggart SiTaggart deleted the BIG-19104-svgs branch September 3, 2015 18:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants