Skip to content

Feature/themed browser toolbar icon#8

Open
richardkrikler wants to merge 3 commits intomikker:mainfrom
richardkrikler:feature/themed-browser-toolbar-icon
Open

Feature/themed browser toolbar icon#8
richardkrikler wants to merge 3 commits intomikker:mainfrom
richardkrikler:feature/themed-browser-toolbar-icon

Conversation

@richardkrikler
Copy link
Copy Markdown

Solves #7

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/action#syntax
theme_icons:
* "dark"-option: icon that is visible when a theme with dark text is active (e.g. Firefox Light Theme)
* "light"-option: icon that is visible when a theme with light text is active (e.g. Firefox  Dark Theme)
@mikker
Copy link
Copy Markdown
Owner

mikker commented Nov 26, 2025

Good stuff! Thanks – I'll take a look soon

Richard Krikler added 2 commits November 26, 2025 22:04
* Use window.matchMedia('(prefers-color-scheme: dark)') & onchange event-listener to listen for theme-changes & send "themeChange"-extension-message
* Listen to "themeChange"-extension-events & call new function "setTheme"
* Add "setTheme(theme)" to set toolbar-icon based on current user-theme (load available icons from manifest.json)
* Inspiration: https://stackoverflow.com/questions/58880234/toggle-chrome-extension-icon-based-on-light-or-dark-mode-browser#comment138897725_58882519
** https://github.com/Zren/RecentBookmarksPopup
@richardkrikler richardkrikler force-pushed the feature/themed-browser-toolbar-icon branch from 8548253 to 1ff2c14 Compare November 26, 2025 21:04
@richardkrikler
Copy link
Copy Markdown
Author

Sry, forgot to commit the icons for chrome yesterday.
Now everything is correctly pushed.

@mikker
Copy link
Copy Markdown
Owner

mikker commented Mar 18, 2026

I can't get this working in Chrome. Was it working for you?

@richardkrikler
Copy link
Copy Markdown
Author

richardkrikler commented Mar 20, 2026

I can't get this working in Chrome. Was it working for you?

Yes, works for me in Microsoft Edge & Chromium.
Icon changes its theme, as long as the user is on a normal webpage (not chrome://).
If a user is on "chrome://" and then switches their browser-tab to another normal page, then the icon will also change.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants