73 lines
No EOL
2.9 KiB
CSS
73 lines
No EOL
2.9 KiB
CSS
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/button_effect_icon_glow.css made available under Mozilla Public License v. 2.0
|
|
See the above repository for updates as well as full license text. */
|
|
|
|
/* Replace the button background-colors with a glow effect */
|
|
/* Edit the color choices how you see fit */
|
|
:root{
|
|
--uc-icon-glow-primary: cyan;
|
|
--uc-icon-glow-secondary: cadetblue;
|
|
--uc-icon-glow-hover-primary: red;
|
|
--uc-icon-glow-hover-secondary: yellow;
|
|
}
|
|
|
|
/* Make backgrounds transparent */
|
|
.close-icon,
|
|
.urlbar-icon,
|
|
.urlbar-icon-wrapper,
|
|
toolbar .toolbarbutton-1,
|
|
#tabbrowser-tabs toolbarbutton,
|
|
toolbar toolbarbutton > .toolbarbutton-icon,
|
|
toolbar toolbarbutton > .toolbarbutton-badge-stack,
|
|
.titlebar-button,
|
|
#identity-box,
|
|
.identity-box-button,
|
|
#tracking-protection-icon-container,
|
|
.findbar-textbox~toolbarbutton,
|
|
toolbarbutton.scrollbutton-up,
|
|
toolbarbutton.scrollbutton-down,
|
|
toolbarbutton#scrollbutton-up,
|
|
toolbarbutton#scrollbutton-down{
|
|
background-color: transparent !important;
|
|
border-color: transparent !important;
|
|
}
|
|
|
|
/* Glow effects on hover */
|
|
.close-icon:hover,
|
|
.urlbar-history-dropmarker:hover,
|
|
#page-action-buttons > .urlbar-icon:hover,
|
|
.urlbar-icon-wrapper:hover > .urlbar-icon,
|
|
toolbar .toolbarbutton-1:not([disabled]):hover .toolbarbutton-icon,
|
|
#TabsToolbar toolbarbutton:not([disabled]):hover .toolbarbutton-icon,
|
|
toolbar #downloads-button:hover #downloads-indicator-anchor,
|
|
.identity-box-button:hover,
|
|
#tracking-protection-icon:hover,
|
|
.findbar-textbox~toolbarbutton:not([disabled]):hover,
|
|
toolbarbutton.scrollbutton-up:not([disabled]):hover,
|
|
toolbarbutton.scrollbutton-down:not([disabled]):hover,
|
|
toolbarbutton#scrollbutton-up:not([disabled]):hover,
|
|
toolbarbutton#scrollbutton-down:not([disabled]):hover{
|
|
filter: drop-shadow(0 0 2px var(--uc-icon-glow-secondary)) drop-shadow(0 0 1px var(--uc-icon-glow-primary))
|
|
}
|
|
|
|
/* Active states and close window button hover state */
|
|
#titlebar .titlebar-buttonbox > .titlebar-close:hover > .toolbarbutton-icon,
|
|
.close-icon:active,
|
|
.urlbar-history-dropmarker:active,
|
|
#page-action-buttons > .urlbar-icon:active,
|
|
#page-action-buttons > .urlbar-icon[open],
|
|
.urlbar-icon-wrapper:active > .urlbar-icon,
|
|
.urlbar-icon-wrapper[open] > .urlbar-icon,
|
|
toolbar toolbarbutton:not([disabled]):active .toolbarbutton-icon,
|
|
toolbar toolbarbutton:not([disabled])[open] .toolbarbutton-icon,
|
|
#TabsToolbar toolbarbutton:not([disabled]):active .toolbarbutton-icon,
|
|
toolbar #downloads-button:active #downloads-indicator-anchor,
|
|
toolbar #downloads-button[open] #downloads-indicator-anchor,
|
|
.identity-box-button:active,
|
|
#tracking-protection-icon-container[open] #tracking-protection-icon,
|
|
.findbar-textbox~toolbarbutton:not([disabled]):active,
|
|
toolbarbutton.scrollbutton-up:active,
|
|
toolbarbutton.scrollbutton-down:active,
|
|
toolbarbutton#scrollbutton-up:active,
|
|
toolbarbutton#scrollbutton-down:active{
|
|
filter: drop-shadow(0 0 2px var(--uc-icon-glow-hover-secondary)) drop-shadow(0 0 1px var(--uc-icon-glow-hover-primary))
|
|
} |