Comments (11)
Ok the problem is the {Services}
in the script. Open the script in text editor and replace it all with this
// ==UserScript==
// @name userChrome_agent_css
// @namespace userChrome_Agent_Sheet_CSS
// @version 0.0.6
// @description Load userChrome.ag.css as agent sheet from resources folder using chrome: uri
// @backgroundmodule
// ==/UserScript==
let EXPORTED_SYMBOLS = [];
(function () {
let sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
// Try to load userChrome.ag.css as agent sheet
// WARNING - agent sheets loaded like this affect each and every document you load including web sites. So be careful with your custom styles.
try{
sss.loadAndRegisterSheet(Services.io.newURI("chrome://userChrome/content/userChrome.ag.css"), sss.AGENT_SHEET);
}catch(e){
console.error(`Could not load userChrome.ag.css: ${e.name}`)
}
})();
from uc.css.js.
I think you might be misunderstanding what that script does. All it does is replace the native tooltips shown for the window controls in the titlebar with XUL tooltips, so that they can be styled like other XUL tooltips. It's referring to the tooltips that appear when you hover the minimize, maximize, and close buttons in the top right corner of the window.
The tooltips you're showing in your video are unrelated. Those are simply normal XUL tooltips. The script doesn't style them. Whatever is styling the other tooltips in your video correctly, it's failing to style the default native-anonymous tooltip correctly.
There are 2 types of tooltips in the chrome window. The first is the generic tooltip. This shows up at the bottom of the DOM, <tooltip default="true" page="true".../>
. It's used for all elements that have a tooltiptext
attribute. Whatever text is in the tooltiptext
attribute gets copied into that generic tooltip.
The other type is different. There's a limited number of special tooltips, that are permanent elements in the DOM. For example, the tooltip for the back button is one such example. Instead of a tooltiptext
attribute containing just the tooltip's intended text, the back button has a tooltip
attribute that refers to the ID of its permanent tooltip element, back-button-tooltip
. So when you hover it, that unique tooltip is opened instead. That's done because the back button's tooltip has 2 rows of uniquely styled text, so the generic tooltip presentation wouldn't be sufficient.
It's a lot easier to style the unique tooltips because they are permanent elements that you can style in ordinary user CSS. So your own userChrome.css file can say for example:
#back-button-tooltip {
background: red !important;
}
Conversely, if you try to do that with the generic tooltip, it will have no effect:
tooltip {
/* no effect */
background: red !important;
}
The only way the generic tooltip can be styled is with a user agent stylesheet. That same rule above, if moved into a user agent stylesheet instead of userChrome.css, will work just fine. See my agent sheet for example.
If you maintain your own stylesheets, then you should make a user agent stylesheet. The readme for this repo goes into quite a lot of detail about my recommended way to do this.
If you're using another author's theme, then you should file a bug on their repo. As far as I know, between 116 and 118, nothing has changed with how agent sheets are processed, nor with how tooltips can be styled. So this is more likely a regression with your theme. If it was working before, then the theme must have had an agent sheet. So if I were you, I would look into what may have changed about the agent sheet or how it's loaded.
from uc.css.js.
Oh man, thanks for the detailed explanation, I really appreciate it.
Sure, I have very superficial knowledge in CSS (I am 3D artist), and I can confuse something and I apologize for that.
However, you helped to configure this (post on Reddit) and it worked perfectly, but ceased for some reason recently.
It was a year ago..
So, if you say that there were no significant changes in this, then perhaps something else changed and started to interfere with this to work.
I will try to set up on a fresh installation, without other scripts and addons, let's see.
Thanks.
from uc.css.js.
I can see in your video that you have a script userChrome_agent_css
. Send me that script
from uc.css.js.
Not sure if it's this script?
userChrome_ag_css.zip
from uc.css.js.
Also, can I ask you to write a simple step by step guide (or give a link to an already existing one) what and how to install to fix and be able to style these tooltips.
I mean, I'll install a fresh FF and want to test just that, without any other (not necessary) scripts or addons installed.
I'm just a little confused already and can't figure out how to do it, although I already did it a year ago, but completely forgot how..
I understand that it is annoying to explain to every idiot on the Internet the same thing every time, so if you don't have the time or mood for it - I understand it..
But please..
from uc.css.js.
That's not a script, that's a CSS file. I'm talking about javascript files. Look at the video you sent me, it's showing in the user scripts menu along with my script.
I already wrote what to do above. You never answered any of my questions, like who made your tooltip styles, where are you getting all this code from? And your issue doesn't have anything to do with other scripts or addons. But there's not much I can do if you can't show me the scripts and files in your chrome folder.
from uc.css.js.
Anyway... you should open your userChrome.css file and look for tooltip
in it. Find whatever styles you're using for tooltip in userChrome.css and copy them into your userChrome.ag.css.
Also, the CSS rule that's in that file is just an example. It doesn't actually do anything, since html|tooltip
refers to nothing. So you want to replace that with a rule like
tooltip {
/*...same styles you have for tooltips in userChrome.css...*/
}
from uc.css.js.
Hmm, you asked for a userChrome_agent_css
and I send it, you probably just didn't open that archive.
There are two files, one userChrome_ag_css.uc.js
and the second userChrome.ag.css
(just in case).
Although on my video it's called userChrome_author_css
instead (not agent).
from uc.css.js.
Obviously something has been broken recently and I don't have enough knowledge to find the reason or clearly explain it to you.
However, if I install your userChromeAgentAuthorSheetLoader.uc.js
(into a chrome/JS folder) and then copy the userChrome.ag.css
script from resources folder to chrome folder, then everything works fine again and all the tooltips look the same and good again..
So, to me it looks like the userChrome_ag_css.uc.js
script can't load the userChrome.ag.css
file for some reason, although it used to work fine in Nightly and still works in Stable.
Not sure if this is the right solution, but I'll leave it like that for now.
Thanks for the help.
from uc.css.js.
Yes, it works too.. 😎👍
Thanks a lot.
from uc.css.js.
Related Issues (20)
- Option to customise certain ui tooltips[FR] HOT 2
- [FR] Auto-trigger picture-in-picture? HOT 2
- [BUG] The VerticalTabsPane script cannot move to the right in versions above 113 HOT 2
- [FR] Add extension debug menu for Unified Extension panel
- debugExtensionInToolbarContextMenu.uc.js v1.5.0 not working HOT 3
- [BUG]clearDownloadsButton.uc.js console error HOT 3
- [FR][Extension Options Panel] Add Pin "addon button" to Toolbar HOT 5
- Did the animateContextMenus stop working in the latest few Nightly versions? HOT 1
- [BUG]Dragging local files to Sibery bar and opening them on the actual "file://" address instead of "blob:"? HOT 1
- [BUG] Private tab button does not get created HOT 3
- [BUG] No version of recentlyClosedTabsContextMenu.uc.js seems to load or do anything at all on FF116 Devedition HOT 19
- [BUG] A small bug in private tabs script HOT 1
- [FR][Extension Options Panel] Ability to keep some addon on the top of EOPanel's list HOT 4
- [FR][Extension Options Panel] Ability to auto disable some user specified addons when Firefox start
- Private Window Homepage broken? HOT 6
- Refactor invertPDFButton to JSWindowActor
- Search for add-ons in the add-ons manager, and show the number of pieces HOT 4
- [FR]Make Tab Thumbnail Tooltip work with Vertical Tabs Pane
- [BUG] urlbarTabUrlIndicator.uc.js isn't working for me HOT 15
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from uc.css.js.