Page 1 of 1

how to change a basic ui icon?

Posted: 2018-10-04, 07:48
by Lew Rockwell Fan
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.

Re: how to change a basic ui icon?

Posted: 2018-10-04, 12:08
by Lootyhoof
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.

Re: how to change a basic ui icon?

Posted: 2018-10-04, 18:29
by Lew Rockwell Fan
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.