MozillaZine


Searching for a Stylesheet in the Style Editor

User Help for Mozilla Firefox
manngo
 
Posts: 17
Joined: September 30th, 2007, 12:53 am

Post Posted February 2nd, 2020, 12:35 am

Using the the Developer Tools Style Editor, is it possible to search for a particular style sheet? Some sites have a large number of style sheets.

In particular, when using Remote Debugging to explore the style sheets for Firefox itself, I am faced with what I believe are thousands of style sheets. Looking for one in particular, say userContent.css, is a little like looking for a needle in a stack of needles.

Failing that, is there a way of searching for text across style sheets?

dickvl

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

Post Posted February 2nd, 2020, 1:28 am

Actually that list looks like it is longer than necessary because I see a lot of repeats.
For instance count the instances of global.css and the block that starts with autocomplete.css and a lot of others if I scroll the list.

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

Post Posted February 2nd, 2020, 6:50 am

Browser toolbox launches a separate Firefox instance and uses a separate profile.

You can highlight the userChrome.css and userContent.css labels in the style editor using a secondary userChrome.css file.

* <profile folder>\chrome_debugger_profile\user.js

Code: Select all
user_pref("toolkit.legacyUserProfileCustomizations.stylesheets", true);

* <profile folder>\chrome_debugger_profile\chrome\userChrome.css

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

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

@-moz-document url-prefix("chrome://devtools/content/styleeditor/index.xhtml") {
  html|ol.splitview-nav label[value="userChrome.css"],
  html|ol.splitview-nav label[value="userContent.css"] {
    background-color: red !important;
    color: white !important;
  }
}

Similar thread
http://www.reddit.com/r/FirefoxCSS/comments/dsfv6w

manngo
 
Posts: 17
Joined: September 30th, 2007, 12:53 am

Post Posted February 2nd, 2020, 1:38 pm

@morat Thanks for the reply. That has made all the difference in the world to finding the sheet.
I notice that here the file is userChrome.css, while my changes to the browser Style Editor need to go into userContent.css. I’m just a bit confused, but getting closer.

dickvl

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

Post Posted February 2nd, 2020, 5:16 pm

Thanks.

I was already using a userChrome.css file, so I added your CSS code and it works perfectly.
I use a lot of @import rules and these imported files appear directly under userChrome.css and userContent.css.

I noticed the cache2 folder in the debugger profile and decided to check this folder and noticed a lot of files in it, so this folder appears to be used.
It looks like a good case for using a user.js file in the debugger profile in each of the profiles I have to clear the disk cache on exit.
Maybe there are more candidates to include in user.js.

user_pref("privacy.sanitize.sanitizeOnShutdown", true);
user_pref("privacy.clearOnShutdown.cache", true);

Return to Firefox Support


Who is online

Users browsing this forum: aborix and 2 guests