Bug 1715361 Comment 19 Edit History

Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.

This one does not flip JPGs and has a better background adjustment.
This one does not flip JPGs and has a better background adjustment.

This is what happens:

```
const darkBackground = [42,42,46] //#2a2a2e

function isDarkTheme() {
  return window.matchMedia("(prefers-color-scheme: dark)").matches;
}

function invert() {
  let css = `html {
    background-color: rgba(${darkBackground.join(",")});
  }
  html, img[src*=".jpg" i], img[src*=".jpeg" i] {
    filter: invert(100%);
  }`;
  let head = document.getElementsByTagName('head')[0];
  let style = document.createElement('style');
  style.type = 'text/css';
  style.appendChild(document.createTextNode(css))
  head.appendChild(style)
}

if (isDarkTheme()) {
  invert();
  let elements = document.querySelectorAll(`html, body, body > *`);
  for (let element of elements) {
    let color = window.getComputedStyle(element).getPropertyValue('background-color');
    let [r,g,b,a] = color.match(/[.?\d]+/g);

    // If a custom background color is set and it is close to white, replace it
    // with the dark background (inverted, so it gets properly inverted by CSS filter).
    if (r > 245 && g > 245 && b > 245) {
      element.style.backgroundColor = `rgba(${darkBackground.map(e => 255-e).join(",")})`;
    }
  }
}
```

Back to Bug 1715361 Comment 19