Error css classes in svg export
In version before 26.2, applying a graphic style to a simple object (rectangle, line, etc.) allowed the name of that graphic style to be used as a CSS class in the an exported SVG. So a graphic style of "thick-outline" would become a CSS class called ".thick-outline" when the SVG file was exported with internal CSS.
Now, a useless class called "cls-1" is applied to the illustrator object instead, making re-use of overriding of the style in the SVG difficult. This is a regression that makes the usefulness of the SVG export feature limited.
See below for a comparison of files exported in 26.1 vs. 26.2:
26.1
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
<defs>
<style>
.wo-icon--outline-thick {
fill: none;
stroke: #1a1a1a;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 3px;
}
</style>
</defs>
<polyline class="wo-icon--outline-thick" points="19.94 13.5 30.38 23.93 19.94 34.37"/>
</svg>
26.2:
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
<defs>
<style>
.wo-icon--outline-thick, .cls-1 {
stroke: #1a1a1a;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 3px;
}
.cls-1 {
fill: none;
}
</style>
</defs>
<polyline class="cls-1" points="18 12 30 24 18 36"/>
</svg>
Brent Scofield
shared this idea
-
Szymon Kuś commented
Same here. I found out it happens only when style fill is empty. For stroke and fill works fine.
-
Isaac Englart
commented
Same issue for me.
These look to be related or same issue: