MozillaZine

userChrome.css snippets for a native UI look over Photon

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

Post Posted October 7th, 2017, 12:33 pm

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-native-css/blob/master/userChrome.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: 14
Joined: October 24th, 2017, 2:29 am

Post Posted October 24th, 2017, 10:16 pm

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?

Frank Lion

User avatar
 
Posts: 19513
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom

Post Posted October 25th, 2017, 4:14 am

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.
Metal Lion latest SeaMonkey & Thunderbird Themes - Sea Monkey and Silver Sea Monkey
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)

luke01
 
Posts: 14
Joined: October 24th, 2017, 2:29 am

Post Posted October 25th, 2017, 4:57 am

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: 239
Joined: January 20th, 2015, 12:29 pm

Post Posted October 25th, 2017, 6:18 am

How's this?
Code: Select all
.close-icon {
   fill: red !important;
}


You can change the color to whatever you like.

luke01
 
Posts: 14
Joined: October 24th, 2017, 2:29 am

Post Posted October 25th, 2017, 9:54 am

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)

Return to Firefox General


Who is online

Users browsing this forum: No registered users and 7 guests