User Style for

Yesterday, I was talking with Kohei Yoshino (the person behind the Bugzilla Quantum effort that recently landed significant UX improvements to the header strip) about some visual issues I have on which basically boil down to our default view being a bit too noisy for my taste and not emphasizing enough on the key elements I want to glance at immediately when I visit a bug (bug Status, description, comments).

Given that I spend a significant amount of time on Bugzilla and that I also spend some time on Github issues, I decided to see if I could improve our default theme on Bugzilla with a user style to make it easier on the eyes and also closer visually to Github, which I think is good when you use both on a daily basis.

After an evening spent on it, I am happy with the result so I decided to share it via To install this style on Firefox, you need an extension such as Stylish or Styl-us (I use the former), go to the user style page above and install it. Load a bug (ex: Bug 1406825) and you should see the result. Note that this CSS patches the default theme on, not the old one. You need to have the option "Use modal user interface" set to ON in your bugzilla preferences (that's the default value).

Here are a few Before/After screenshots:

Screenshot-2018-1-10 1406825 - Enable Custom elements v1 on Nightly by default.png
Overview and header before

Screenshot-2018-1-10 1406825 - Enable Custom elements v1 on Nightly by default(1).png

Overview and header after

Screenshot-2018-1-10 1408044 - Stop shipping about (2).png
Comment before
[object Object]
Comment after

That's a v1 (a v1.1 actually), it uses sans-serif fonts instead of monospace, styles replies and comments in a more modern way, removes some visual elements and emphasizes on readibility of comments. Cheers

Haut de page