Skip to content
This repository has been archived by the owner on Apr 2, 2022. It is now read-only.

Recolor UI with HTML theme-color meta tag #284

Draft
wants to merge 6 commits into
base: main
Choose a base branch
from
Draft

Conversation

cassidyjames
Copy link
Owner

@cassidyjames cassidyjames commented Jun 22, 2021

Probably not the best way as it's not built into the version of WebKit being used here. Instead, I use a one-liner of injected JS to grab the contents of the theme-color meta tag on page load, and use that in GtkCSS to recolor the headerbar.

ephemeral-theme-color-appcenter.mp4

Potential issues:

  • It doesn't support live changes like Chrome and Safari do. I'd need to figure out how to watch the meta tag and re-set the color in a performant way.
  • I don't think where I have this is the most performant place, but I also want to set the theme-color as early as possible for UX reasons.
  • Because it uses injected JS, it doesn't work when JS is diasbled.
  • It doesn't support the brand-new media query support for theme-color

@cassidyjames cassidyjames changed the title WIP: Support HTML theme-color meta tag Recolor UI with HTML theme-color meta tag Jun 22, 2021
@cassidyjames
Copy link
Owner Author

Ha, apparently this applies to all windows, not just the current window 🙈

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant