Wandering Thoughts archives


Giving Firefox the tiniest URL bar bookmark 'star' button possible

Recently over on the Fediverse I mentioned I'd broken Ctrl-D to add new bookmarks in my Firefox:

TIL that I accidentally broke bookmarking on my primary Firefox. This is actually convenient because the only time I bookmark something on it is when I absentmindedly used Ctrl-D to try to close the window/tab. (My terminals close with Ctrl-D, my Firefox windows with Ctrl-W, I have a bunch of both, yes life is fun.)

One of the irritating ongoing changes in Firefox over the past N years is Firefox's slow but steady encroachment on the space in the URL bar. One of those things is the 'star' button for bookmarking the current page (or unbookmarking it), which Mozilla added at one point and doesn't let you remove, even if you don't use bookmarking and want the space so you can actually see more of the page's URL. So after grousing about it, I wound up removing the star button in my custom Firefox build, through the means of commenting out the entire snippet of browser 'HTML' that defines it. It turns out that this breaks Ctrl-D, apparently because the normal pop-up bookmark dialog wants to manipulate the state of the star. With no star element at all to manipulate, Firefox starts raising internal Javascript errors.

I made a series of attempts to deal with this. First I patched in Javascript 'try { ... }' sections around the obvious bits that were raising errors. This made Ctrl-D work too well; it would flash up the normal dialog very briefly but not wait for input (ie, for me to cancel the bookmark). Next I tried having the star button and its box be present but be either 'display: none' or zero width. That didn't work either, with the same symptoms that Ctrl-D worked too well. At this point I almost gave up but my stubbornness led me to the next obvious step of a having the tiniest possible star button. It turned out that this worked, and the tiniest star button (well, button box) is 1px in size (I believe these are CSS pixels, so scaled by your HiDPI scaling factor if this is applicable).

After some refinement, the CSS that I wound up with is, in userChrome.css format (cf):

#star-button-box {
  width: 0;
  max-width: 0;
  min-width: 0;
  border-width: 0;
  padding: 0px 0px 0px 1px !important;
  margin: 0;

(I've verified that this works in userChrome.css, although in my own build I did it in browser/base/content/browser.css, and I innocently used 'padding: 1px;' so that version gave me a 2px bookmark star. The difference between 2px and 1px isn't much, so I may keep it as 2px so I have a bit more of a reminder that there is something there. Some of these 0 settings may be overkill.)

One of my overall lessons from this is that I should try to do more personal Firefox UI changes with CSS instead of with my historical approach of brute force, ie commenting out sections of the UI's definitions. And probably I should do more of these as userChrome.css changes instead of source code changes. Just because I have a hammer doesn't mean I need to use it for everything.

web/FirefoxTiniestBookmarkStar written at 22:53:23; Add Comment

Page tools: See As Normal.
Login: Password:
Atom Syndication: Recent Pages, Recent Comments.

This dinky wiki is brought to you by the Insane Hackers Guild, Python sub-branch.