71 lines
No EOL
2.8 KiB
CSS
71 lines
No EOL
2.8 KiB
CSS
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/dark_checkboxes_and_radios.css made available under Mozilla Public License v. 2.0
|
|
See the above repository for updates as well as full license text. */
|
|
|
|
/* Change the appearance of natively styled widgets including radios, checkboxes, buttons and expender "dropdown" arrows */
|
|
/* Their background will be transparent instead of white so they will appear fitting to whatever is on the background */
|
|
/* As such, this might cause a small issue if the background happens to be same color as the border of these buttons or the checkbox-image */
|
|
|
|
/* In short, these native widgets will be dark on dark theme and light on light theme */
|
|
|
|
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
|
|
|
#editBMPanel_tagsSelector > richlistitem > image,
|
|
radio > .radio-check,
|
|
checkbox > .checkbox-check{
|
|
-moz-appearance: none !important;
|
|
border: 1px solid graytext;
|
|
border-radius: 2px;
|
|
height: 1.3em;
|
|
width: 1.3em;
|
|
padding: 1px;
|
|
}
|
|
|
|
#editBMPanel_tagsSelector > richlistitem > image{
|
|
background-color: var(--toolbar-bgcolor,rgb(50,50,52)) !important;
|
|
margin: 1px !important;
|
|
border-color: graytext !important;
|
|
border-radius: 2px !important;
|
|
}
|
|
|
|
#editBMPanel_tagsSelector > richlistitem:not([disabled]):hover > image,
|
|
radio:not([disabled]):hover > .radio-check,
|
|
checkbox:not([disabled]):hover > .checkbox-check{ border-color: highlight !important; }
|
|
|
|
radio > .radio-check{ padding: 0; border-radius: 20px }
|
|
|
|
#editBMPanel_tagsSelector > richlistitem[checked] > image,
|
|
radio[selected] > .radio-check,
|
|
checkbox[checked] > .checkbox-check{
|
|
list-style-image: url("chrome://global/skin/icons/check.svg");
|
|
-moz-context-properties: fill;
|
|
fill: highlight;
|
|
}
|
|
|
|
radio[selected] > .radio-check{ list-style-image: url("chrome://global/skin/in-content/radio.svg"); }
|
|
|
|
#editBMPanel_tagsSelector > richlistitem[disabled] > image,
|
|
radio[disabled] > .radio-check,
|
|
checkbox[disabled] > .checkbox-check{ fill: graytext !important; }
|
|
|
|
/*Buttons*/
|
|
/* This only applies to natively-ish styled buttons, not the buttons in toolbars */
|
|
|
|
button{
|
|
-moz-appearance: none !important;
|
|
color: inherit !important;
|
|
background-color: rgba(127,127,127,0.1) !important;
|
|
border: 1px solid graytext;
|
|
}
|
|
|
|
button[disabled]{ opacity: 0.8 }
|
|
|
|
|
|
button:not([disabled]):hover{ border-color: highlight; background-color: rgba(0,0,0,0.1) !important; box-shadow: inset 0 0 2px highlight }
|
|
button:not([disabled]):active{ box-shadow: inset 0 0 3px 0px black }
|
|
button.searchbar-engine-one-off-item,
|
|
.panel-footer > button{ border-width: 1px 0 0 0; }
|
|
|
|
button.panel-button{ padding: 2px 2px 1px 2px !important; }
|
|
|
|
#customization-done-button{ background-color: #0a84ff !important; }
|
|
#customization-done-button:hover{ background-color: #0a64df !important; } |