search

transmission / transmission.github.io

25 stars 36 forks source link

Dark Mode Conflicts #52

Open shatteredsite opened 2 years ago

shatteredsite commented 2 years ago

There are a few issues with the dark mode of the website.

The images for Synology NAS and Puppy Linux on the Downloads page require a different image in dark mode than light. This can be achieved with similar HTML to the following:

<noscript> 
    <picture>
      <source srcset="settings-dark.png" media="(prefers-color-scheme: dark)" />
      <source srcset="settings-light.png" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" />
      <img id="screenshot" src="settings-light.png" />
    </picture>
</noscript>

I have attached the modified images.

The Github button on the homepage needs to be properly inverted in color scheme. Giving the same look as .btn-outline-lightrather than .btn-outline-dark.

The homepage gear image backgrounds I have exported as png for transparency (attached) and will work in both light and dark mode now. The current dark mode is very flat on the homepage otherwise. Images attached, CSS needs to reference png not jpg versions for classes .homepageheader and .news-section. Removal of lines 205-208 is needed.

Dark Mode Distro Logos.zip Gear Backgrounds.zip

mangosplat commented 1 year ago

I think your changes are more likely and/or quickly to be merged if they are submitted as pull requests