Quantcast
Channel: SmartClient Forums
Viewing all articles
Browse latest Browse all 4756

Best practice needed: SVG skinning support with SmartGWT in current browsers

$
0
0
Hello Isomorphic,

I'm looking for a way to easily skin my SVG files with CSS.
I'm using SVGs from flaticon (e.g. http://www.flaticon.com/free-icon/stats-document_36170) and add a style sheet in the file (2nd line added):

Code:

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/css" href="/myproj/images/svg-style.css"?>
....

The CSS just includes:
Code:

path {fill: red !important;)
Now, when I include the image with Img img = new Img("filename.svg"); it is displayed, but not styled (=black icon). When I just open the icon in Chrome or Firefox, it is styled (=red icon).

I'm 100% sure this is not a SmartGWT bug, but perhaps you can tell the best way how to include SVGs in SmartGWT.


The SVG-class seems to be somewhat older, most likely from the time when browsers needed plugins in order to display SVGs.

As one can see for example here, browsers support SVG-stylesheets, but as it seems not for img-tags, but only SVG-tags.

So with your expertise, what is the best way to include SVG-files in SmartGWT so that one can style them with external CSS (either own CSS file or in a style tag in the main html). I tried with v9.1p_2014-04-13 and Chrome34/FF26 using the HTML5 doctype.

Thank you & best regards,
Blama

Viewing all articles
Browse latest Browse all 4756

Trending Articles