Why is Firefox "about:preferences" not affected by CSS while "about:addons" is?

fioiu omotrlfioiu omotrl
in Style Development Firefox
I modify "about:addons" in the same Stylish sheet where I modify other Firefox elements, I just modify, say, ".main-content" and everything is fine. But .main-content of "about:preferences" is not affected. I then go to another Stylish sheet, where I modify web pages, and put
@-moz-document url(about:preferences)
{
.main-content{...}
}
and still nothing happens. I tried to use "about:preferences#general" too, but no way. What do I do wrong?

Comments

  • calicocalico
    Chrome

    CTR affects the page. You will need the secret code word added.

    /* AGENT_SHEET */
@-moz-document url(about:preferences),url-prefix(about:preferences){

.main-content{
  background:aliceblue!important;}
}
  • fioiu omotrlfioiu omotrl
    Firefox
    Thank you, Calico, you saved me again! Who could have thought that CTR tentacles spread so far and wide and at the same time so selectively!
    I also have a similar problem with Back, Forward and Download buttons: whatever way I try to modify them, they are not affected (CTR again?) except by opacity. I want to do two things with them: 1) get rid of the 3D glossy look they get when hovered over and 2) make the arrow images white. Can you help me with that?
  • calicocalico
    Chrome

    I apologize, as I probably can't be much help with image icons. CTR does target the buttons, but mine are white because of the theme I use, and don't have a 3D glossy look. Not sure what that is tbh, it sounds like a Classic Toolbar Buttons extension look. You may have some luck playing with the following code, but hopefully other members will have a better answer.

    #ctraddon_back-button >  .toolbarbutton-icon,
#ctraddon_forward-button >  .toolbarbutton-icon{
  filter: invert(100%)!important;}
  • fioiu omotrlfioiu omotrl
    Firefox
    After some thinking I decided to stop using CTR, after all I don't use most of its settings. I already managed (with CTR disabled) to decrease the tab and nav-bar height, made tabs square (simply by setting .tab-background to zero opacity). But again there is a line I can't get rid of. It's between the tab bar and the nav bar (not a border, I tried *{boder:none}, even with /* AGENT_SHEET */). Can you help?
    Line1.png
    336 x 104 - 4K
  • makondomakondo
    Waterfox
    Try this:

    #navigator-toolbox::after
    { border: none !important; }
  • fioiu omotrlfioiu omotrl
    Firefox
    No, it doesn't work. But I already tried *{boder:none}, is "after" not covered by * ?
  • makondomakondo
    edited July 2017 Waterfox
    Yeah, it won't work in your case. What theme are you using? Try default Fx theme to see my code in work (and don't forget !important).
    In your case, check the theme file for that border/box-shadow.
  • fioiu omotrlfioiu omotrl
    Firefox
    Yes, I use important and default Firefox theme. Classic Theme Restorer is disabled. Byt why should it work where the asterisk doesn't ?
  • fioiu omotrlfioiu omotrl
    Firefox
    I disabled everything in Stylish except for the single line:
    #nav-bar{
    background:transparent!important;
    }
    (otherwise, this line will be impossible to discern) and your code.
    And it's still there. Default theme, with Firefox taking on Windows theme (blue color). That's how it looks now.
    Line2.PNG
    295 x 72 - 5K
  • makondomakondo
    Waterfox
    Sorry, i can't help you. My toolbox looks different and i don't see your issue (i use Waterfox 53, clean profile).
    Good Luck!
  • calicocalico
    Firefox

    Makondo might have had the answer above. Try this out:

    #nav-bar{
box-shadow:none !important;
}

    Also, just realized CTR has an option to reverse icon colors.
    image

  • SonnySonny
    edited July 2017 Waterfox
    Try more specificity like:
    #main-window #nav-bar {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    }
  • fioiu omotrlfioiu omotrl
    Firefox
    You guys are cool! "Box-shadow:none" made the line disappear while leaving a dark blue line in its place. "Border:none" removed the dark blue line. Thanks a lot!

    As to icons, I now see I need to replace the images in order to change the color (I earlier thought that changing something like the buttons' background-color could do it).
  • makondomakondo
    edited July 2017 Waterfox
    You can try using filters. hue-rotate(SOMEdeg) might do it, will need to play with it to get what you might like. Using brightness in addition often helps and might try invert as well.

    https://www.w3schools.com/CSSref/css3_pr_filter.asp
    https://developer.mozilla.org/en-US/docs/Web/CSS/filter
    https://css-tricks.com/almanac/properties/f/filter/
  • fioiu omotrlfioiu omotrl
    Firefox
    Interesting things, I'll look into them, thanks, makondo.
  • makondomakondo
    Waterfox
    You're welcome, Good Luck!
    https://forum.userstyles.org/discussion/29057/helpful-styling-links/p1
Sign In or Register to comment.