salesforce-ux / design-system

Salesforce Lightning Design System
https://www.lightningdesignsystem.com
Other
3.57k stars 827 forks source link

SVG icons not showing up in Salesforce1 Visualforce tabs #30

Closed logontokartik closed 9 years ago

logontokartik commented 9 years ago

Hi I created a Visualforce page using SLDS and created a tab to show on Salesforce1 Mobile. Everything works fine but icons doesn't show up, they look fine on the regular browser.

logontokartik commented 9 years ago
screen shot 2015-09-24 at 8 46 52 am screen shot 2015-09-24 at 8 47 21 am
amyleesalesforce commented 9 years ago

This is a known issue on Salesforce1 mobile (and I believe you can see the same problem with one.app). It will be addressed in a future release.

For right now the best workaround we have found is to inline the SVG. If you download SLDS's zipfile (http://www.lightningdesignsystem.com/resources/downloads/) you will see a set of single SVG files in assets/icons/action (for example). Copy the contents of the SVG file you want to use and inline that into your page.

rickschmoo commented 9 years ago

It will be fixed in the imminent next release of Salesforce - Winter 2016. You can check it out here: https://www.salesforce.com/blog/2015/08/salesforce-winter-16-coming-soon.html

logontokartik commented 9 years ago

Thank you @amyleesalesforce @rickschmoo . I will use the workaround for now. Do you know if this the same if I build something with Lightning Components?

amyleesalesforce commented 9 years ago

Well, if you are building with Lightning Components you might have to take the same approach of inlining for now.

In the future, you'll want to build a component similar to our Trailhead guide: https://developer.salesforce.com/trailhead/project/slds-lightning-components-workshop/slds-lc-4