search

stdlib-js / www

Website for stdlib, a standard library for JavaScript and Node.js.
https://stdlib.io
Apache License 2.0
6 stars 8 forks source link

[Bug]: stdlib logo on landing page has insufficient contrast when viewed in dark mode #51

Closed kgryte closed 2 years ago

kgryte commented 2 years ago

When viewing the landing page in dark mode, the logo tag line has insufficient contrast with the background. We should probably target the text using, e.g., the default theme text color.

Screen Shot 2022-05-20 at 5 08 16 PM

kgryte commented 2 years ago

The issue for resolving this is that the banner is loaded via an img tag: https://github.com/stdlib-js/www/blob/8107e2fa8925c7c96608cc15500af5fac55505e9/src/components/welcome/banner.jsx#L36

That's problematic for theming as we cannot modify SVG attributes for SVG loaded this way.

The rationale for loading via an img tag was to reduce bundle sizes and leverage caching.

Likely best solution here is to use the existing logo.jsx component and then add the tag line as a separate DOM element which we can then theme.

kgryte commented 2 years ago

Screen Shot 2022-05-21 at 4 22 56 AM Screen Shot 2022-05-21 at 4 23 08 AM