Skip to content

Support for Css variables #206

@FHoffmannSopra

Description

@FHoffmannSopra

Hey guys,

I tried to render a ccs-styled polyline with the svg2pdf tool.
I know styles have to be declared inside the Svg to work correctly in the PDF document.
For the colors of my polyline I use Css variables stored in :root, which I would like to embed in the Svg too.
I tried these three approaches:

Added this style tag and the variable declaration right into my class (all manipulations not based on variables work fine)
<style>.bluePolyline {--color: blue; stroke: var(--color); }</style>
<path class="bluePolyline"><path/>

Added an additional class to my polyline, which includes all my colors
<style>.bluePolyline {stroke: var(--color); }</style>
<style>.polyLineColors {--color: blue;}</style>
<path class="bluePolyline polyLineColors"><path/>

Added the variable declaration to the outermost Svg container:
<svg style="--color: blue;"><svg/>
<style>.bluePolyline {stroke: var(--color); }</style>
<path class="bluePolyline"><path/>

As far as I know all these methods work in html and I get the right colors in the DOM.
However in the exported Pdf none of the strokes are rendered.
Just need the info if there is another way to embed the variables, or just no support for it.

I am running jsPdf 2.4.0 and svg2pdf 2.2.0, not sure which package is responisble for such a feature.

Thanks for your help
Frederic

Metadata

Metadata

Assignees

No one assigned

    Labels

    difficulty:mediumenhancementhelp wantedHelp with creating a proper test-case, looking up the spec, or creating a pull request.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions