androidsvg icon indicating copy to clipboard operation
androidsvg copied to clipboard

Dark Mode support

Open calbot opened this issue 4 years ago • 1 comments

It would be nice if you could render the SVG in darkmode using the setting in @media (prefers-color-scheme: dark) by passing a parameter for what color scheme you're in.

Is there already a way to do this?

https://www.palantir.com/icon.svg

<svg xmlns="http://www.w3.org/2000/svg" width="171" height="218" viewBox="0 0 171 218" fill="none">
    <style>
        @media (prefers-color-scheme: dark) {
            .a { fill: #FFFFFF; }
        }
    </style>
    <path class="a" d="M85.5 0C40.5 0 3.59999 37.3976 3.59999 83.0044C3.59999 128.611 40.5 166.009 85.5 166.009C130.5 166.009 167.4 128.611 167.4 83.0044C167.4 37.3976 130.5 0 85.5 0ZM85.5 140.469C54 140.469 28.8 114.929 28.8 83.0044C28.8 51.0798 54 25.5401 85.5 25.5401C117 25.5401 142.2 51.0798 142.2 83.0044C141.3 114.929 116.1 140.469 85.5 140.469ZM158.4 158.711L85.5 190.636L12.6 158.711L0 181.515L85.5 218L171 181.515L158.4 158.711Z" fill="#1E2124"/>
</svg>

calbot avatar Aug 16 '21 07:08 calbot

No. There isn't a way to do it at the moment. But you could do it yourself by checking the dark mode setting and passing different CSS to the renderToX() methods.

Parsing @media queries properly is quite complicated. So in the interest of keeping the library small, I've kind-of avoided adding support for them. But I'll keep this issue alive for now as a feature request.

BigBadaboom avatar Aug 16 '21 09:08 BigBadaboom