userChrome.css snippets for a native UI look over Photon

Discussion of general topics about Mozilla Firefox
Post Reply
isaacschemm
Posts: 270
Joined: January 20th, 2015, 12:29 pm

userChrome.css snippets for a native UI look over Photon

Post by isaacschemm »

I use Firefox Developer Edition sometimes (depending on the computer I'm on), and so with the new release I decided to work on a CSS file that would give it more of an OS-native look. The biggest changes are having the toolbar buttons and menu items render as native ones, using XUL.

https://github.com/IsaacSchemm/photon-n ... Chrome.css

Put userChrome.css in a folder called "chrome" in your profile folder.

Note - you will have to enable the light theme in Customize for these changes to be applied.

Screenshots (old vs. new):

Windows 7 (classic theme)
Image

Windows 10
Image

macOS
Image

It also looks good on the Windows 7 standard theme and on GTK3 on *nix. On macOS it's probably not much of an improvement.
luke01
Posts: 18
Joined: October 24th, 2017, 2:29 am

Re: userChrome.css snippets for a native UI look over Photon

Post by luke01 »

This is great! But it is possible to change also the ugly grey color for the [X]-close tab button ? Or to only change the color for [X} no matter what theme is using?
User avatar
Frank Lion
Posts: 21173
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom
Contact:

Re: userChrome.css snippets for a native UI look over Photon

Post by Frank Lion »

luke01 wrote:This is great! But it is possible to change also the ugly grey color for the [X]-close tab button ?
Word of advice - when someone makes a complete theme or, as here, alters the appearance of the UI via userChrome.css then there is a strong chance that they like the look of it as it is....otherwise, they wouldn't haven't bothered doing the work.

See why things like 'ugly grey color' from you might not 'go down well'? Just something to note, if you are asking for help, as you are here.
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)
.
luke01
Posts: 18
Joined: October 24th, 2017, 2:29 am

Re: userChrome.css snippets for a native UI look over Photon

Post by luke01 »

Sorry if I was so rude but I wanted to say if possible to change also the color of the [x] button to be more distinctive towards the tab color (wich is the same) and in the default UI is very annoying no matter wich theme is used.

https://imgur.com/a/hnmxv
isaacschemm
Posts: 270
Joined: January 20th, 2015, 12:29 pm

Re: userChrome.css snippets for a native UI look over Photon

Post by isaacschemm »

How's this?

Code: Select all

.close-icon {
	fill: red !important;
}
You can change the color to whatever you like.
luke01
Posts: 18
Joined: October 24th, 2017, 2:29 am

Re: userChrome.css snippets for a native UI look over Photon

Post by luke01 »

Yes it works now I have a [x] red button, thank you very much! But I tried also your first tweak and don't work for me. (win 10)
Post Reply