MozillaZine

userChrome.css not working on newly installed FF

User Help for Mozilla Firefox
macron0
 
Posts: 4
Joined: October 27th, 2015, 2:34 am

Post Posted September 25th, 2019, 5:36 am

the-edmeister wrote:Users are making that a big deal. Mozilla got rid of the "tabs on bottom" feature in Australis Fx 29 as the default; it has been users who couldn't learn to live with that change and insisted on changing it via an extension initially and then with Quantum via userChrome code.


yes because users want (and should want) computer sto do what the user wants. Thats why we have them.

I made the mistake of updating dd from 64 to 69 and now I have spend hours fugiring out how the tab bar goes where it should.

Just image that the door of your fridge suddele opens the other way arround just because the manufacturer pushed you an update so youre fridge is more energie effiecent or something.
they even might decide to move the freeze compatment to the top en the cooling to the bottom. The most be people that would realy like that. I would not and I think many people that use ff use it for a reason and are more stuborn about how they want things to go.

I have been clinging on to seamonkey untuil support stopped last year. Chrome is horrible so only thing left is ff. and ff well. they have become just as commercial a group minded bunch never mind what the individual likes as apple and microsoft every where. so sad. :(

kerft
 
Posts: 585
Joined: January 30th, 2019, 9:38 am

Post Posted September 25th, 2019, 5:58 am

>> seamonkey untuil support stopped last year
An updated version has just been released of Seamonkey - https://blog.seamonkey-project.org/2019 ... -released/
An unofficial Seamonkey 2.53 also exists, https://www.wg9s.com/comm-253/ and works fine.

jscher2000

User avatar
 
Posts: 10920
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted September 25th, 2019, 7:30 am

macron0 wrote:I made the mistake of updating dd from 64 to 69 and now I have spend hours fugiring out how the tab bar goes where it should.

Good news! You just need to use the latest version from a regularly updated repository like: https://github.com/Aris-t2/CustomCSSforFx

Mozilla is rewriting chunks of XUL to HTML in each version, so you should think about revisiting after every major update to refresh your files.

Or use https://www.reddit.com/r/FirefoxCSS/ to stay on top of specific new changes.

Or use ESR for more stability: https://support.mozilla.org/kb/switch-to-firefox-extended-support-release-esr

mmortal03
 
Posts: 394
Joined: January 29th, 2004, 9:08 am
Location: USA

Post Posted January 3rd, 2020, 9:27 am

Should userChrome.css modifications still work in 71.0? I've got:

toolkit.legacyUserProfileCustomizations.stylesheets = true

My userChrome.css starts with:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

I've checked that I'm placing it in the correct Firefox profile under the chrome folder.

...but none of the modifications I've tried seem to work after restarting Firefox -- modifications that used to work.

Here are some examples, none of this is working:

Code: Select all
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* Removes some menu animations */
.panel-arrowcontainer {
  opacity: 1;
  transform: none;
  pointer-events: all !important;
}

/* Removes space in top left before tabs when not maximized */
.titlebar-placeholder[type="pre-tabs"]{display:none;}

/* Reduce the "white flash" in new tabs */
browser[type="content-primary"],
browser[type="content"] {
  background: #000000 !important;
}

morat
 
Posts: 3744
Joined: February 3rd, 2009, 6:29 pm

Post Posted January 3rd, 2020, 11:16 am

@mmortal03

Try this:

Code: Select all
/* Removes space in top left before tabs when not maximized */
.titlebar-spacer[type="pre-tabs"] { display: none !important; }

dickvl

User avatar
 
Posts: 53084
Joined: July 18th, 2005, 3:25 am

Post Posted January 3rd, 2020, 6:27 pm

Note that .titlebar-placeholder is for Firefox 64 and older.
Firefox 65 needs .titlebar-spacer

A DXR search suggests that panel-arrowcontainer is within Shadow DOM and thus can't be accessed via userChrome.css.
https://dxr.mozilla.org/mozilla-release ... wcontainer

morat
 
Posts: 3744
Joined: February 3rd, 2009, 6:29 pm

Post Posted January 3rd, 2020, 7:00 pm

@dickvl

Shadow parts should work in user origin stylesheets
http://bugzilla.mozilla.org/show_bug.cgi?id=1575507#c2

Sören says the simple selector works correctly.

mmortal03
 
Posts: 394
Joined: January 29th, 2004, 9:08 am
Location: USA

Post Posted January 4th, 2020, 12:38 am

morat wrote:@mmortal03

Try this:

Code: Select all
/* Removes space in top left before tabs when not maximized */
.titlebar-spacer[type="pre-tabs"] { display: none !important; }


Thanks, that works!

morat wrote:@dickvl

Shadow parts should work in user origin stylesheets
http://bugzilla.mozilla.org/show_bug.cgi?id=1575507#c2

Sören says the simple selector works correctly.


In other words, there's a way to do it, but the code is going to have to be modified?

morat
 
Posts: 3744
Joined: February 3rd, 2009, 6:29 pm

Post Posted January 4th, 2020, 7:45 am

@mmortal03

I don't know.

I can change the color of the popup in the bookmarks sidebar.

Code: Select all
.panel-arrowcontainer {
  background: orange !important;
}

And, AFAICT, the properties work correctly.

Code: Select all
.panel-arrowcontainer {
  opacity: 0.80 !important;
  transform: rotate(0.5turn) !important;
  pointer-events: none !important;
}

I don't see any menu animations using the default settings. (maybe it's a Windows 10 only style)

Firefox 71.0
Windows 7 SP1 32-bit

P.S.

Try adding the !important rule to override each property.

-----

Try this:

Code: Select all
/* Firefox userContent.css */

/* Reduce the "white flash" in new tabs */
@-moz-document url-prefix("about:blank") {
  * {
    background-color: black !important;
  }
}

http://kb.mozillazine.org/UserContent.css

That works for new tabs, but not the new tab at startup.

mmortal03
 
Posts: 394
Joined: January 29th, 2004, 9:08 am
Location: USA

Post Posted January 5th, 2020, 5:21 am

@morat,

You're right that the other parameters do something. How do I find a list of the available parameters?

Btw, this may be when it was implemented: https://bugzilla.mozilla.org/show_bug.cgi?id=1352075

Edit: This works:

Code: Select all
panel[type="arrow"]:not([animate="false"])
   {transition-duration: 0ms !important;}

morat
 
Posts: 3744
Joined: February 3rd, 2009, 6:29 pm

Post Posted January 5th, 2020, 6:49 am

Alternatively...

Code: Select all
panel[type="arrow"] {
  -moz-appearance: none !important;
  opacity: 1 !important;
  transform: none !important;
  transition-property: none !important;
  transition-duration: unset !important;
  transition-timing-function: unset !important;
  pointer-events: all !important;
}

Try toggling the xul.panel-animations.enabled pref.

How do we get DOM info for userChrome in 57+
viewtopic.php?f=23&t=3034448

Reference
http://developer.mozilla.org/docs/Web/CSS/Reference
http://developer.mozilla.org/docs/Web/CSS/opacity
http://developer.mozilla.org/docs/Web/CSS/transform
http://developer.mozilla.org/docs/Web/CSS/pointer-events

pintassilgo
 
Posts: 177
Joined: August 30th, 2013, 3:50 pm

Post Posted January 5th, 2020, 8:34 pm

Do you know if it is possible to stylize HTML5 default video controls (e.g. to make them always visible) with userChrome.css or userContent.css?

I only got it with AGENT_SHEET and afaik userContent.css is USER_SHEET and userChrome.css is AUTHOR_SHEET.

morat
 
Posts: 3744
Joined: February 3rd, 2009, 6:29 pm

Post Posted January 6th, 2020, 10:26 am

I can style the video control bar with AGENT_SHEET and USER_SHEET using js, but not with the userChrome.css or userContent.css files.

Code: Select all
(function () {

  var css = `.controlBar {
    -moz-appearance: none !important;
    background-color: orange !important;
    display: flex !important;
  }`;
  var ios = Components.classes["@mozilla.org/network/io-service;1"].
    getService(Components.interfaces.nsIIOService);
  var uri = ios.newURI("data:text/css," + encodeURIComponent(css), null, null);
  var sss = Components.classes["@mozilla.org/content/style-sheet-service;1"].
    getService(Components.interfaces.nsIStyleSheetService);
  // var type =  sss.AGENT_SHEET;
     var type =  sss.USER_SHEET;
  // var type = sss.AUTHOR_SHEET;
  if (sss.sheetRegistered(uri, type)) sss.unregisterSheet(uri, type);
  else sss.loadAndRegisterSheet(uri, type);

})();

userChrome.css is USER_SHEET.
userContent.css is AUTHOR_SHEET.

Test page
http://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_video_controls
Last edited by morat on January 6th, 2020, 11:16 am, edited 1 time in total.

mmortal03
 
Posts: 394
Joined: January 29th, 2004, 9:08 am
Location: USA

Post Posted January 6th, 2020, 10:36 am

morat wrote:Try toggling the xul.panel-animations.enabled pref.


Yes, that works! Why didn't we see this before? :)



Thanks!

pintassilgo
 
Posts: 177
Joined: August 30th, 2013, 3:50 pm

Post Posted January 6th, 2020, 10:54 pm

morat wrote:I can style the video control bar with AGENT_SHEET and USER_SHEET using js, but not with the userChrome.css or userContent.css files.

You're right, USER_SHEET works too. But here the style works in userContent.css, so JS is not needed.

morat wrote:userChrome.css is USER_SHEET.
userContent.css is AUTHOR_SHEET.

They're both USER_SHEET, but each with its own specifics. userContent.css stylizes content area only. userChrome.css stylizes chrome areas only. And a JS loaded USER_SHEET style stylize both chrome and content.

https://searchfox.org/mozilla-central/s ... he.cpp#245
Code: Select all
        LoadSheet(gUserContentSheetURL, eUserSheetFeatures, eLogToConsole);

https://searchfox.org/mozilla-central/s ... he.cpp#485
Code: Select all
  mUserContentSheet = LoadSheetFile(contentFile, eUserSheetFeatures);
  mUserChromeSheet = LoadSheetFile(chromeFile, eUserSheetFeatures);

Return to Firefox Support


Who is online

Users browsing this forum: No registered users and 6 guests