Allow algorithmic darkening in web screens

I want to preface this request by saying that I've already found a workaround using the dark mode profile in Tasker, so the priority of this request is low. However, it would be a fun thing to have 🙂

In newer versions of web browsers, you can respond to the system's dark/light mode using a CSS media query. For example:

@media (prefers-color-scheme: dark) {
  .some-element {
    background-color:#111;
  }
}

This currently isn't working in AutoTools Web Screens, it just always defaults to dark. To satisfy my curiousity I did some digging into how this work with Android Webviews, and found that how it handles dark mode is a bit of a headache. It depends on the following factors:

• a different solution is needed depending on whether the app's target sdk version is 33 or higher
• the user needs to have Android System Webview version 100 or up (older versions will still function but won't have the prefers-color-scheme support)
• setting some combination of properties on the Webview (algorithmic_darkening, force_dark, isLightTheme)

Sources:

• This StackOverflow answer is a comprehensive overview of the options
• setAlgorithmicDarkeningAllowed() in the API documentation. The summary table shown below seems useful
• Google's documentation on Darken Web Content

You can find a demo of the prefers-color-scheme feature here. If you toggle dark mode on your system, the page should respond without the need for a page refresh