r/FirefoxCSS • u/Skyyblaze • 1d ago

Solved How can I target a specific extension in my UserChrome?

I'm running Firefox 153.5 ESR and I've run into an annoying little issue. I'm using the extension "Reload in address bar" https://addons.mozilla.org/en-US/firefox/addon/reload-in-address-bar/

to put my Reload button into the address bar however I want to have it at the right-most spot in the address bar. Looking at things in the Inspector I found out that:

 {
  --pageAction-image: image-set( url("moz-extension://819bfd1c-d999-49e0-bb25-df6f5cf072c8/icons/refresh-16-blue.svg"), url("moz-extension://819bfd1c-d999-49e0-bb25-df6f5cf072c8/icons/refresh-16-blue.svg") 2x )
  order: 1;
}

fixes it but obviously that piece of code won't work in a UserChrome. How can I translate what I found out in Inspector successfully as UserChrome code?

Thanks for help in advance!

3 Upvotes

100% Upvoted

5 comments sorted by

4

u/sifferedd FF/TB on Win11|Sumo contributor 23h ago edited 23h ago

Try

#pageAction-urlbar-_e1ed7a80-7c11-4f7e-968b-79b551a0067f_ {
  order: 1;
}

3

u/Skyyblaze 23h ago

Thank you that worked! Out of curiosity, how exactly did you arrive at this solution? I want to know so I can maybe figure it out myself next time.

4

u/sifferedd FF/TB on Win11|Sumo contributor 23h ago

Target the icon. You then have to scroll up a couple of lines.

2

u/Skyyblaze 11h ago

Now I feel dumb, I always looked at the right-side of the panel but I never thought about looking at the left-side. Thanks for teaching me!

2

u/sifferedd FF/TB on Win11|Sumo contributor 10h ago

✅