Launcher doesn't adapt to OS dark theme
My system
OS: Arch Linux x86_64
DE: Xfce 4.16
Theme: Adwaita-dark [GTK2/3]
Notice the dark
suffix.
Screenshots with example problems:
Logo has low contrast
Fig 1. The logo have very low contrast since it expects that the background is white.
Icons have low contrast
Fig 2. Icons that should be white are black.
Bridge notice
Fig 3. Some settings can't be read since the background is white and the text too.
Captcha window
Fig 4. The captcha window has almost unreadable text and an image that doesn't fit the dark theme.
Possible fixes
Detect the OS dark mode
You can detect the dark mode of the OS in Javascript with this snippet:
let darkMode = window.matchMedia('(prefers-color-scheme: dark)').matches
You can watch for changes with a event listener too:
window.matchMedia('(prefers-color-scheme: dark)')
.addEventListener('change', event => {
if (event.matches) {
//dark mode
} else {
//light mode
}
})
Then, we can set a variable to dynamically change the CSS, eg:
js
wizardElem.setAttribute("tor_dark_mode", darkModeMatch.matches);
css
wizard[tor_dark_mode="true"] .tbb-logo {
list-style-image: url("chrome://torlauncher/skin/tbb-logo-dark.svg");
}