External style sheets do not work

catfacetaro commented 5 years ago

Does not show the svg preview correctly when svg has external stylesheet.

test1.svg:

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
    <link xmlns="http://www.w3.org/1999/xhtml" rel="stylesheet" href="mystyle.css" type="text/css"/>
    <rect x="20" y="20" width="60" height="60" />
</svg>

test2.svg:

<?xml-stylesheet type="text/css" href="mystyle.css"?>
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
    <rect x="20" y="20" width="60" height="60" />
</svg>

mystyle.css:

svg rect {
    stroke: #006600;
    fill: #00cc00;
}

The preview shows a black square. Opening the either test1.svg or test2.svg in chrome shows green square.

vitaliymaz commented 5 years ago

External resources are not supported for now and I don't see an easy way to implement that from the current implementation point of view. Closing for now.

zm-cttae commented 1 year ago

The new pull #72 makes it possible to include a local CSS stylesheet that's in the same folder as the SVG.

vitaliymaz / vscode-svg-previewer

External style sheets do not work #33