Styling Stylus [not an issue.... but where to post this seems to be]

[Ghis1964]

https://userstyles.org/styles/170675/stylus

Not an issue (other than where to post this is) (I wish I could do this with any other extension. But, seems to me that the only way would to convert any which one into userscripts so I could edit the css style and load them as scripts other than having to load them as temp-extension :-( )

Anyway, I don't know how I did it, but I've styled Stylus with this:

/-----selct-copy codes and import as firefox-format-----/

@-moz-document url-prefix("moz-extension://a29b2bd5-38b2-4d0f-bfd5-16c0df5e9b69/") { .CodeMirror { font-family: monospace; font-size: 1.3em; height: 390px; color: #989494; direction: ltr; }

stylus, body

{color: #afa9a9 !important; background: #413b3b !important;}

a, .style-name a, .style-edit-link {color: #d1d1d1 !important;}

[type="checkbox"] { background: #bfb3b3 !important;}

backup-buttons .dropdown-content{

display: none;
position: absolute;
background-color: hsl(0, 1%, 10%);
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
z-index: 1;

} .dropdown-content :hover, .dropdown-content :focus, #file-all-styles:hover{ background-color: hsl(5, 1%, 32%)!important; z-index: 1; }

select, #search, #manage.newUI.sort { padding: 2px 7px; border: 1px solid hsl(0, 2%, 9%); font: inherit; font-size: inherit; line-height: inherit; color: #c9c4c4; background-color: hsl(0, 1%, 10%); background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAYAAADtlXTHAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QwGBBwIHvKt6QAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAL0lEQVQI12NoaGgQZ2JgYGBkYmBgYGZiYGBggrMY4VxsYsyoskQQCB2MWAxAMhkADVECDhlW9CoAAAAASUVORK5CYII='); background-repeat: repeat-x; background-size: 100% 100%; transition: background-color .25s, border-color .25s; }

select:hover { background-color: hsl(0, 5%, 20%); background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAYAAADtlXTHAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QwGBBwIHvKt6QAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAL0lEQVQI12NoaGgQZ2JgYGBkYmBgYGZiYGBggrMY4VxsYsyoskQQCB2MWAxAMhkADVECDhlW9CoAAAAASUVORK5CYII='); background-repeat: repeat-x; background-size: 100% 100%; transition: background-color .25s, border-color .25s;}

button { -webkit-appearance: none; -moz-appearance: none; user-select: none; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 2px 7px; border: 1px solid hsl(0, 2%, 9%); font: inherit; font-size: inherit; line-height: inherit; color: #c9c4c4; background-color: hsl(0, 1%, 10%); background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAYAAADtlXTHAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QwGBBwIHvKt6QAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAL0lEQVQI12NoaGgQZ2JgYGBkYmBgYGZiYGBggrMY4VxsYsyoskQQCB2MWAxAMhkADVECDhlW9CoAAAAASUVORK5CYII='); background-repeat: repeat-x; background-size: 100% 100%; transition: background-color .25s, border-color .25s; } button:hover, button:not(:disabled):hover, input:not([type]), #options [type="number"]{ -webkit-appearance: none; -moz-appearance: none; user-select: none; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border: 1px solid hsl(0, 3%, 3%); font: inherit; font-size: inherit; line-height: inherit; color: #c9c4c4; background-color: hsl(0, 5%, 0%)!important; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAYAAADtlXTHAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QwGBBwIHvKt6QAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAL0lEQVQI12NoaGgQZ2JgYGBkYmBgYGZiYGBggrMY4VxsYsyoskQQCB2MWAxAMhkADVECDhlW9CoAAAAASUVORK5CYII='); background-repeat: repeat-x; background-size: 100% 100%; transition: background-color .25s, border-color .25s; } }

[stonecrusher]

For security reasons extensions cannot modify other extensions. If you use Firefox, you can make use of userChrome.css instead.

https://www.userchrome.org/how-create-userchrome-css.html https://www.howtogeek.com/334716/how-to-customize-firefoxs-user-interface-with-userchrome.css/

[Ghis1964]

For security reasons extensions cannot modify other extensions. If you use Firefox, you can make use of userChrome.css instead.

https://www.userchrome.org/how-create-userchrome-css.html https://www.howtogeek.com/334716/how-to-customize-firefoxs-user-interface-with-userchrome.css/

My userchrome is so full again (as I had to restart from scratch.... thx quantum but no thx) that this is become pretty easy to to messed it up. It's a bit hard to had style to and addon without risking afecting the rest of firefox UI. I'm even looking for a way to dismember addon (mostly the older ones like legacy) and use them as userscripts in "xyz"-monkey (as it was in the old days, before everyone and developers fell into the "addon" trap).

[stonecrusher]

without risking afecting the rest of firefox UI

It's totally easy to restrict your style to only the desired extension

@-moz-document url-prefix("moz-extension://EXTENSION-UUID-HERE/") {
    /* your code here */
}

[narcolepticinsomniac]

Yeah, this repo is mostly for bug reports and feature requests. If you wanna share your styles, forum.userstyles.org will probably get the most eyeballs, or you could join our Discord server. If you post it elsewhere, just provide a link to the style. There's no need to paste the whole code in your comments.