If it can help, the script can be simplified: I need only the color flag capacity of the script (very usefull to visuly follow the users. And of course a way to keep all the infos stored before by it.
In other words, this new update might only break styles that targeted at browser elements, or so to speak, if namespace url is mozilla.org/keymaster/gatekeeper/there.is.only.xul ?? Or should I take precaution and edit all the styles I'm using? Cause if browser specific variant rules like -moz-, -webkit-, and -o- won't work without adding the new rule, then many of the styles here would break since they are kinda outdated. And does this also impact: Radio buttons, input, select, option, textarea, code, pre, span, div, css Selectors, button, form etc. elements?
No. The update may break styles that target anonymous content in either the browser chrome or the web page [1]. (That is, elements that DOM Inspector colors red.) In the figure, the INPUT can be styled with an AUTHOR_SHEET, and requires no change to the style sheet, but the anonymous DIV that it contains must be styled with an AGENT_SHEET.
Most (all?) of the affected styles have already been auto-magically updated to include the hack/a>, so you should only need to update your styles [2] [3].
Both XHTML and XUL namespaces are affected (notice that the anonymous DIV in the figure is in the XHTML namespace, not the XUL namespace), and vendor extensions per se are not affected.
Btw, for now I cannot fully grasp the idea of XUL namespaced style running as AUTHOR style %|. Does it really make a sense?
Why not? Author rules prevail over all but !important agent rules, and there aren't many (any?) !important UA rules. Less is best when it comes to privilege, though some may disagree.
Actually, 94453 was automatically updated because of the presence of "scrollbar", but looks like the author overwrote the change. I'll run a scan for thumb, gripper, and scrollbarbutton now though.
Btw, for now I cannot fully grasp the idea of XUL namespaced style running as AUTHOR style %|. Does it really make a sense?
Well it's a little odd because the author is the agent in this case, but if you ignore that fact it makes total sense!
I think these styles that don't work anymore are styles that have been updated by the authors, who are still using Stylish 1.4.0 and have not inserted "/* AGENT_SHEET */" into the style so the automagical update is lost. I'm basing this on my own experience.
You can blame the authors, but I think a lot of authors don't read the forums and don't update Stylish at every opportunity, and there may be many unhappy users and authors.
Jason, I believe your method of adding "/* AGENT_SHEET */" to all the styles that needed it worked well. Why not apply the same method to updated and new styles? Or at least ask the author if they're aware of the issue, in cases where "/* AGENT_SHEET */" is missing where it appears to be needed?
Edit: I was responding to myf's next-to-last post. This thread sure is active.
That's not what I meant by "these things" - that's just making an element display like a different kind of element. I meant styling the internals of an element, for example: input[type="file"] * { color: red !important;} which works with Firefox (with /* AGENT_SHEET */).
I think these styles that don't work anymore are styles that have been updated by the authors, who are still using Stylish 1.4.0 and have not inserted "/* AGENT_SHEET */" into the style so the automagical update is lost. I'm basing this on my own experience.
Hm, still odd to me. What does userstyle with XUL namespace but without AGENT_SHEET comment actually affect now?
I'd expect that the answer is nothing, because if it affected anything, page authors had been able all the time to style shadow DOM, but it isn't so.
Am I right?
So isn't just XUL namespace usage itself clear flag that styles originator intended to affect, well, browser's chrome? Or was this updates purpose just to prevent outdated firefox chrome styles to work? Don't take me wrong, well documented magic comment flag is perfectly OK for me. I've been just a bit confused.
Hm, still odd to me. What does userstyle with XUL namespace but without AGENT_SHEET comment actually affect now?
Don't worry about the concept of an AUTHOR sheet styling user agent chrome. Conceptually, it may be contradictory or redundant, but it really doesn't change anything except as noted here.
Basically, Stylish is lying to Firefox when it says it's an AUTHOR sheet. It's also lying when it says it's an AGENT sheet. Really these things are USER sheets. The truth doesn't matter, but these different modes are subtly different technically.
OK, thanks, now I see that 'normal' Firefox chrome (tabs, menus and such) is really still affected by plain XUL styles without AGENT_SHEET and that it's really just and only the shadow-DOM in pages what depends on the AGENT_SHEET flag. Took me some time :] Thanks for clarification, I misread the docs first.
And the SVG instead XUL was also helpful. I'm getting old, thinking getting hard :|
(So global styles that rely on * {background: transparent !important;} fail as author sheets)
Edit: I used Global dark style - changes everything to DARK without updating it. I see it currently has the /*AGENT_SHEET*/ fix applied by Jason's script and therefore (after updating) it does not have the problem described by EpamiTut. @EpamiTut - if you update these dark global styles you are using, does that help? What are they?
In cases where the the site itself is using !important, the suggested fix is to increase the specificity on the selector. Simply adding /* AGENT_SHEET */ will make it work in Firefox, but it will still be broken in Chrome, Greasemonkey, etc.
I realize that in the case of a global style and a block of code like that, it's not really feasible, in which case adding /* AGENT_SHEET */ just bring things back to how they were in 1.4.0 (working in Firefox, broken everywhere else).
I did, but only as (the most common?) example of anonymous content that people style. When you style things in the method I demonstrated, you're essentially accessing "non-public" parts of the elements. It'll only work in Firefox and you need the special comment because you're working with the implementation details of how Firefox works.
The pseudo-elements you list are "public", so do not require any special privileges. I would recommend using those if they (or an equivalent) work on all the browsers you intend to support.
Jason, you may want to edit your description on AMO to mention that the old Stylish-Custom is not compatible with this version. Because those reviews will take your rating down quickly.
For those who use the old Stylish-Custom:
if you use Stylish-Custom, it's time to uninstall it 'cause it hasn't been updated for 1,5 years and seems abandoned. It's not compatible with Stylish 1.4.1 (one of the possible effects is described here) but a mod by Sonny Razzano is. If you have problems using it, post in its thread.
I think you need to put it right in the main description 'cause - as we all well know - too many people don't read release notes. If you put it under the main description, it will be right in their face (which, of course, doesn't eliminate all users but most of those who install either ext. for the first time ... and actually read description before installing something).
Why this style working in Firefox, but don't fully work (site's !important above mine) Yandex Browser (google engine; AUTHOR_SHEET added in start of style)?
Why this style working in Firefox, but don't fully work (site's !important above mine) Yandex Browser (google engine; AUTHOR_SHEET added in start of style)?
It's: /* AGENT_SHEET */ and it only works in Firefox. You picked the right thread, all you need to do is follow the link in the OP:
Bottom line, Firefox is just better at it (for now at least), but unless the you're trying to override inline CSS, specificity should do the trick.
Thanks, I read this topic. "Stylish for Chrome, if the style installed while a page it affects is open: last author sheet. On subsequent page loads: first author sheet."
I do not know much English, so this line of realized that probably need to insert author_sheet. The trick ... And what can be done for other browsers that my !important interrupt style of site? Which a trick?
You're focusing on the wrong part of the tutorial. Specificity wins regardless. Since English isn't your strong-suit, I'll break it down very simply.
The site has a rule:
.foo{color:red!important;}
Your rule is:
.foo{color:blue!important;}
They have the same specificity, so which rule gets applied depends on which appears last in the cascade. You have very little to no control over this.
Give your selector more specificity and your rule wins regardless. A simple way that works everywhere is to add html or body, like:
body .foo{color:blue!important;}
You can use any parent element for specificity. You can also override your own rule using the same selector, but adding more specificity. You want .foo to be blue but you'd rather .foo in the header was white:
body .foo{color:blue!important;} body #header .foo{color:white!important;}
Comments
It was a that a long time i ask help about it .
Here the script and the topic with my buggzilla report where i explain the problem and they explain why they stop the E4x support:
Flickr Functional Suite By Charles Tilford — Last update Aug 4, 2006
I have some response around it here :
Convert a greasemonkey Script after E4x is not supported
But i don't find / understand how apply that.
If it can help, the script can be simplified:
I need only the color flag capacity of the script (very usefull to visuly follow the users.
And of course a way to keep all the infos stored before by it.
Most (all?) of the affected styles have already been auto-magically updated to include the hack/a>, so you should only need to update your styles [2] [3].
Both XHTML and XUL namespaces are affected (notice that the anonymous DIV in the figure is in the XHTML namespace, not the XUL namespace), and vendor extensions per se are not affected.
http://davidwalsh.name/demo/webkit-styles.php
In fact Chrome 25 has (prefixed) Shadow DOM support. (Firefox, eventually.)
http://blog.chromium.org/2013/01/content-security-policy-and-shadow-dom.html
https://bugzilla.mozilla.org/show_bug.cgi?id=811542
http://caniuse.com/shadowdom
You can blame the authors, but I think a lot of authors don't read the forums and don't update Stylish at every opportunity, and there may be many unhappy users and authors.
Jason, I believe your method of adding "/* AGENT_SHEET */" to all the styles that needed it worked well. Why not apply the same method to updated and new styles? Or at least ask the author if they're aware of the issue, in cases where "/* AGENT_SHEET */" is missing where it appears to be needed?
Edit: I was responding to myf's next-to-last post. This thread sure is active.
reapste, sorryinput[type="file"] * { color: red !important;}
which works with Firefox (with /* AGENT_SHEET */). I'm rerunning the script right now.
I'd expect that the answer is nothing, because if it affected anything, page authors had been able all the time to style shadow DOM, but it isn't so.
Am I right?
So isn't just XUL namespace usage itself clear flag that styles originator intended to affect, well, browser's chrome? Or was this updates purpose just to prevent outdated firefox chrome styles to work? Don't take me wrong, well documented magic comment flag is perfectly OK for me. I've been just a bit confused.
Namespace simply sets the vocabulary; it doesn't imply privilege. Say "SVG" instead of "XUL" and it won't seem so mind-boggling.
https://developer.mozilla.org/en-US/docs/Remote_XUL
Basically, Stylish is lying to Firefox when it says it's an AUTHOR sheet. It's also lying when it says it's an AGENT sheet. Really these things are USER sheets. The truth doesn't matter, but these different modes are subtly different technically.
And the SVG instead XUL was also helpful. I'm getting old, thinking getting hard :|
Yesterday, I updated. The dark global userstyles work bad in: www.ivoox.com -> Large white frames.
I think is due to Stylish 1.4.1
* {background: transparent !important;}
fail as author sheets)Edit: I used Global dark style - changes everything to DARK without updating it. I see it currently has the /*AGENT_SHEET*/ fix applied by Jason's script and therefore (after updating) it does not have the problem described by EpamiTut. @EpamiTut - if you update these dark global styles you are using, does that help? What are they?
I realize that in the case of a global style and a block of code like that, it's not really feasible, in which case adding /* AGENT_SHEET */ just bring things back to how they were in 1.4.0 (working in Firefox, broken everywhere else).
http://css-tricks.com/custom-scrollbars-in-webkit/
https://www.webkit.org/blog/363/styling-scrollbars/
css/CSSSelector.cpp
::-webkit-scrollbar
::-webkit-scrollbar-button
::-webkit-scrollbar-track
::-webkit-scrollbar-track-piece
::-webkit-scrollbar-thumb
::-webkit-scrollbar-corner
::-webkit-resizer
html/shadow/DetailsMarkerControl.cpp
::-webkit-details-marker
html/shadow/MediaControlElements.cpp
::-webkit-media-controls-panel
::-webkit-media-controls-enclosure
::-webkit-media-controls-overlay-enclosure
::-webkit-media-controls-timeline-container
::-webkit-media-controls-volume-slider-container
::-webkit-media-controls-status-display
::-webkit-media-controls-mute-button
::-webkit-media-controls-volume-slider-mute-button
::-webkit-media-controls-play-button
::-webkit-media-controls-overlay-play-button
::-webkit-media-controls-seek-forward-button
::-webkit-media-controls-seek-back-button
::-webkit-media-controls-rewind-button
::-webkit-media-controls-return-to-realtime-button
::-webkit-media-controls-toggle-closed-captions-button
::-webkit-media-controls-closed-captions-container
::-webkit-media-controls-closed-captions-track-list
::-webkit-media-controls-timeline
::-webkit-media-controls-volume-slider
::-webkit-media-controls-fullscreen-volume-slider
::-webkit-media-controls-fullscreen-button
::-webkit-media-controls-fullscreen-volume-min-button
::-webkit-media-controls-fullscreen-volume-max-button
::-webkit-media-controls-time-remaining-display
::-webkit-media-controls-current-time-display
::-webkit-media-text-track-container
html/shadow/MediaControls.cpp
::-webkit-media-controls
html/shadow/MeterShadowElement.cpp
::-webkit-meter-inner-element
::-webkit-meter-optimum-value
::-webkit-meter-suboptimum-value
::-webkit-meter-even-less-good-value
html/shadow/SliderThumbElement.cpp
::-webkit-slider-thumb
::-webkit-media-slider-thumb
::-webkit-slider-container
::-webkit-media-slider-container
html/shadow/SpinButtonElement.cpp
::-webkit-inner-spin-button
html/shadow/TextControlInnerElements.cpp
::-webkit-search-results-button
::-webkit-search-results-decoration
::-webkit-search-decoration
::-webkit-search-cancel-button
::-webkit-input-speech-button
html/shadow/YouTubeEmbedShadowElement.cpp
::-apple-youtube-shadow-iframe Works, yes, in some cases, as long as the browser doesn't crash when you do it - wasn't that after all what put a bug up Zbarsky's nose?
The pseudo-elements you list are "public", so do not require any special privileges. I would recommend using those if they (or an equivalent) work on all the browsers you intend to support.
It works nice in Firefox.
Always before @namespace line in dark global styles?
you may want to edit your description on AMO to mention that the old Stylish-Custom is not compatible with this version. Because those reviews will take your rating down quickly.
For those who use the old Stylish-Custom:
if you use Stylish-Custom, it's time to uninstall it 'cause it hasn't been updated for 1,5 years and seems abandoned. It's not compatible with Stylish 1.4.1 (one of the possible effects is described here) but a mod by Sonny Razzano is. If you have problems using it, post in its thread.
https://userstyles.org/styles/112192/dark-grey-adsoff-by
/* AGENT_SHEET */
and it only works in Firefox. You picked the right thread, all you need to do is follow the link in the OP:https://github.com/JasonBarnabe/stylish/wiki/Overwriting-page-styles
Bottom line, Firefox is just better at it (for now at least), but unless the you're trying to override inline CSS, specificity should do the trick.
"Stylish for Chrome, if the style installed while a page it affects is open: last author sheet. On subsequent page loads: first author sheet."
I do not know much English, so this line of realized that probably need to insert author_sheet.
The trick ... And what can be done for other browsers that my !important interrupt style of site? Which a trick?
The site has a rule:
.foo{color:red!important;}
Your rule is:
.foo{color:blue!important;}
They have the same specificity, so which rule gets applied depends on which appears last in the cascade. You have very little to no control over this.
Give your selector more specificity and your rule wins regardless. A simple way that works everywhere is to add
html
orbody
, like:body .foo{color:blue!important;}
You can use any parent element for specificity. You can also override your own rule using the same selector, but adding more specificity. You want
.foo
to be blue but you'd rather.foo
in the header was white: