a1d2c40ea5
Transforming the <image> element causes it to become smaller, and thus to not trigger click event if the button was clicked near the edge. This patch makes us scale tab close button by instead changing its padding which just makes the icon smaller during :active. This fixes #526
36 lines
1.5 KiB
CSS
36 lines
1.5 KiB
CSS
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/button_effect_scale_onclick.css made available under Mozilla Public License v. 2.0
|
|
See the above repository for updates as well as full license text. */
|
|
|
|
/* Effect */
|
|
.urlbar-icon,
|
|
.toolbarbutton-icon,
|
|
.downloadIconShow > .button-box > .button-icon,
|
|
.menuitem-iconic .menu-iconic-icon,
|
|
#downloads-indicator-icon,
|
|
.urlbar-input-container [role="button"] image{
|
|
transition: transform 83ms linear !important;
|
|
}
|
|
toolbar .toolbarbutton-1 > .toolbarbutton-icon{
|
|
transition: padding 83ms linear !important;
|
|
}
|
|
.urlbar-input-container [role="button"]:active image,
|
|
.downloadIconShow:active > .button-box > .button-icon,
|
|
#downloads-button:active #downloads-indicator-icon,
|
|
toolbarbutton#scrollbutton-up:active > .toolbarbutton-icon,
|
|
toolbarbutton:not(.toolbarbutton-1):active > .toolbarbutton-icon,
|
|
toolbar .toolbarbutton-1:not([disabled]):active > .toolbarbutton-badge-stack > .toolbarbutton-icon,
|
|
.menuitem-iconic:active .menu-iconic-icon,
|
|
.urlbar-page-action:active > .urlbar-icon{
|
|
transform: scale(0.6) !important;
|
|
}
|
|
.tab-close-button:hover{
|
|
transition: padding-block 83ms linear;
|
|
}
|
|
.tab-close-button:active{
|
|
padding: calc(var(--tab-close-button-padding) + 2px) !important;
|
|
}
|
|
toolbarbutton#scrollbutton-down:active > .toolbarbutton-icon{ transform: scale(-0.6) !important; }
|
|
|
|
toolbar .toolbarbutton-1:not([disabled]):active > .toolbarbutton-icon{
|
|
padding: calc(var(--toolbarbutton-inner-padding) + 3px) !important;
|
|
} |