diff --git a/src/public/stylesheets/theme-next/forms.css b/src/public/stylesheets/theme-next/forms.css index e2e5c71e1..87e793e37 100644 --- a/src/public/stylesheets/theme-next/forms.css +++ b/src/public/stylesheets/theme-next/forms.css @@ -78,10 +78,11 @@ button.btn.btn-success kbd { * Icon buttons */ -:root .icon-action:not(.global-menu-button) { +:root .icon-action:not(.global-menu-button), +:root .tn-tool-button { width: var(--icon-button-size); height: var(--icon-button-size); - border: unset; + border: unset !important; border-radius: 8px; padding: 0; text-align: center; @@ -89,7 +90,8 @@ button.btn.btn-success kbd { } /* The "x" icon button */ -:root .icon-action.bx-x { +:root .icon-action.bx-x, +:root .tn-tool-button.bx-x { --icon-button-hover-background: var(--tab-close-button-hover-background); --icon-button-hover-color: var(--tab-close-button-hover-color); --icon-button-size: 24px; @@ -99,23 +101,28 @@ button.btn.btn-success kbd { } /* The icon */ -:root .icon-action:not(.global-menu-button)::before { +:root .icon-action:not(.global-menu-button)::before, +:root .tn-tool-button::before { display: block; line-height: var(--icon-button-size); font-size: calc(var(--icon-button-size) * var(--icon-button-icon-ratio)); } :root .icon-action:not(.global-menu-button):hover, -:root .icon-action:not(.global-menu-button).show { +:root .icon-action:not(.global-menu-button).show, +:root .tn-tool-button:hover, +:root .tn-tool-button.show { background: var(--icon-button-hover-background); color: var(--icon-button-hover-color); } -:root .icon-action:not(.global-menu-button):active::before { +:root .icon-action:not(.global-menu-button):active::before, +:root .tn-tool-button:active::before { transform: scale(.85); } -:root .icon-action:not(.global-menu-button):focus-visible { +:root .icon-action:not(.global-menu-button):focus-visible, +:root .tn-tool-button:focus-visible { outline: 2px solid var(--input-focus-outline-color); }