how to change a basic ui icon?

Support and discussions for the x86/x64 Linux version of Pale Moon.

Moderators: trava90, satrow

Lew Rockwell Fan
Fanatic
Fanatic
Posts: 152
Joined: 2017-06-14, 15:20

how to change a basic ui icon?

Unread post by Lew Rockwell Fan » 2018-10-04, 07:48

Any suggestion on how I can change the little + on the new tab button to a larger custom icon? A generalized method would be ideal as there are some others I'd like to change. I've changed the color and horizontal extent in
~/.moonchild productions/pale moon/bsygixk9.he/chrome/userChrome.css

Is there a way to change the icon there also?
If I can't point it toward a custom image, maybe I could replace the image it uses by renaming mine over it.
"To attempt to silence a man is to pay him homage, for it is an acknowledgement that his arguments are both impossible to answer and impossible to ignore." - John Bryant

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

Re: how to change a basic ui icon?

Unread post by Lootyhoof » 2018-10-04, 12:08

Try this:

Code: Select all

#new-tab-button,
.tabs-newtab-button {
  list-style-image: url("YOUR/URL/HERE") !important;
}
You can use list-style-image on any icon you want to change, provided you know the IDs. Personally I tend to use DOM Inspector + Element Inspector add-ons to be able to shift+right click on an element to open it in DOM Inspector, which lets me view the DOM plus any styles attached to it.

Lew Rockwell Fan
Fanatic
Fanatic
Posts: 152
Joined: 2017-06-14, 15:20

Re: how to change a basic ui icon?

Unread post by Lew Rockwell Fan » 2018-10-04, 18:29

Lootyhoof wrote:Try this:

Code: Select all

#new-tab-button,
.tabs-newtab-button {
  list-style-image: url("YOUR/URL/HERE") !important;
}
You can use list-style-image on any icon you want to change, provided you know the IDs. Personally I tend to use DOM Inspector + Element Inspector add-ons to be able to shift+right click on an element to open it in DOM Inspector, which lets me view the DOM plus any styles attached to it.
Perfect. Thank you. I was using an incorrect string instead of "list-style-image". I'll try the inspector add-ons for my next mod now.
"To attempt to silence a man is to pay him homage, for it is an acknowledgement that his arguments are both impossible to answer and impossible to ignore." - John Bryant

Locked