userstyle interference
I have this simple dark blue on white history sidebar menu color scheme code:
- bookmarks-view, #historyTree { background-color: #FFFFFF !important; }
treechildren:-moz-tree-cell-text { color: #020944 !important; } treechildren:-moz-tree-cell-text(selected) { color: #FFFFFF !important; } treechildren:-moz-tree-row(selected) { background: #0080FF !important; } treechildren:-moz-tree-row(focus, selected, current), treechildren:-moz-tree-row(focus, selected, odd), treechildren:-moz-tree-row(focus, selected, even) treechildren:-moz-tree-row { background: #0080FF !important; } treechildren:-moz-tree-image { width: 0 !important; }
unfortunately, it hides the checked-unchecked squares in my adblock plus filters preferences window.
How could i reserve the style for the "history" sidebar menu, only ?
All Replies (11)
delicacy said
#bookmarks-view, #historyTree treechildren::-moz-tree-cell-text { color: #020944 !important; }
#bookmarks-view, #historyTree treechildren::-moz-tree-cell-text(selected) { color: #FFFFFF !important; }
#placesList treechildren::-moz-tree-cell-text(selected), #contentView treechildren::-moz-tree-cell-text(selected) { color: #ffffff !important; }
#placesList treechildren::-moz-tree-cell-text(current), #contentView treechildren::-moz-tree-cell-text(current) { color: #020944 }
Of the above, is #1 working on the right side, but #4 isn't working on the left side? There is a difference, in that #4 only applies to "current".
the blue text isn't considered, when not selected, it's black actually.. for the right & left side..
my blue code: #020944
Does this work? That blue isn't very blue...
/* Main Background: white */ #placesView, #placesList .tree-bodybox, #contentView .tree-bodybox { background-color: #fff !important; } /* Text default color */ #placesList treechildren::-moz-tree-cell-text, #contentView treechildren::-moz-tree-cell-text { color: #020944 !important; } /* Selected/current row text/background color */ #placesList treechildren::-moz-tree-cell-text(focus, selected, current), #contentView treechildren::-moz-tree-cell-text(focus, selected, current) { color: #FFFFFF !important; } #placesList treechildren::-moz-tree-row(focus, selected, current), #contentView treechildren::-moz-tree-row(focus, selected, current) { background: #2673c1 !important; } /* Not sure what this is */ #historyTree treechildren::-moz-tree-image { width: 0 !important; }
With what you gave me, it just adds one more issue..
you changed the background personalized cyan into a dark blue.
main text is still "black"
& yes, it's not very blue but it's the blue i need -black is boring & dull -light blue for text is too light for links -dark blue is too common & reminds me clickable links..
but the issue's not the color type, actually.
Where was the cyan? If you mean the small panel at the lower right, remove this from the beginning of the first rule:
#placesView,
my blue code: #020944
It looks like black because it's very close to black. If you want it bluer, change the last two digits to higher values, for example:
#020988
The cyan is the selection background that wraps text >> #bookmarks-view, #historyTree treechildren::-moz-tree-row(selected) { background: #0080FF !important; }
& no, my color is not a black or "very close to black" to the point of not being able to distinct "blue".. the history sidebar code uses the same color in the code #020944
& you can clearly see the difference with the library text color which remains black, so it's a code error & not a problem of vision.
Gewysig op
Okay, so if I change the background from #2673c1 to #0080FF then I get the attached medium blue background on selected rows.
I'm pretty sure that text is not black on my image, but I notice a lot of style differences between our images so you may have some other rules applying there that my code does not override.
In CSS, usually the most "specific" rule wins, and among equally specific rules, the last one usually wins. What other rules do you have that affect color for treechildren::-moz-tree-cell-text ?
thanks but there's still an issue, you finally got me the unselected text to appear in the dark blue i want, but selected text should be white & it's dark actually .. .
Gewysig op
(pending, unfixed.. selected text must be white)
Final solution for a blue on white style for bookmarks/history/library panels without interfering with adblockplus preferences window: #bookmarks-view, #historyTree { background-color: #FFFFFF !important; } #bookmarks-view, #historyTree treechildren::-moz-tree-cell-text { color: #020944 !important; } #bookmarks-view, #historyTree treechildren::-moz-tree-cell-text(selected) { color: #FFFFFF !important; } #bookmarks-view, #historyTree treechildren::-moz-tree-row(selected) { background: #0080FF !important; } #bookmarks-view, #historyTree treechildren::-moz-tree-row(focus, selected, current), #bookmarks-view, #historyTree treechildren::-moz-tree-row(focus, selected, odd), #bookmarks-view, #historyTree treechildren::-moz-tree-row(focus, selected, even) #bookmarks-view, #historyTree treechildren::-moz-tree-row { background: #0080FF !important; } #bookmarks-view, #historyTree treechildren::-moz-tree-image { width: 0 !important; } #placesList .tree-bodybox, #contentView .tree-bodybox { background-color: #FFFFFF !important; } #placesList treechildren::-moz-tree-cell-text(selected), #contentView treechildren::-moz-tree-cell-text(selected) { color: #ffffff !important; } #placesList treechildren::-moz-tree-cell-text, #contentView treechildren::-moz-tree-cell-text { color: #020944 !important; } #placesList treechildren::-moz-tree-row(selected), #contentView treechildren::-moz-tree-row(selected) { background-color: #2673c1 !important; }
Gewysig op
Note that your posted code is missing a trailing comma:
#bookmarks-view, #historyTree treechildren::-moz-tree-row(focus, selected, odd), #bookmarks-view, #historyTree treechildren::-moz-tree-row(focus, selected, even)
See also:
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); :-moz-any(#bookmarks-view, #historyTree) { background-color: #FFFFFF !important; } :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-cell-text { color: #020944 !important; } :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-cell-text(selected) { color: #FFFFFF !important; } :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-row(selected) { background: #0080FF !important; } :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-row(focus, selected, current), :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-row(focus, selected, odd), :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-row(focus, selected, even), :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-row { background: #0080FF !important; } :-moz-any(#bookmarks-view, #historyTree) treechildren::-moz-tree-image { width: 0 !important; } #placesList .tree-bodybox, #contentView .tree-bodybox { background-color: #FFFFFF !important; } #placesList treechildren::-moz-tree-cell-text(selected), #contentView treechildren::-moz-tree-cell-text(selected) { color: #ffffff !important; } #placesList treechildren::-moz-tree-cell-text, #contentView treechildren::-moz-tree-cell-text { color: #020944 !important; } #placesList treechildren::-moz-tree-row(selected), #contentView treechildren::-moz-tree-row(selected) { background-color: #2673c1 !important; }
apparently can't be resolved.
Gewysig op