style/button group: fix the appearance of the active button

This commit is contained in:
Adorian Doran 2025-11-30 00:55:34 +02:00
parent 2923d917e5
commit cef242a9ce
4 changed files with 14 additions and 5 deletions

View File

@ -592,11 +592,6 @@ button.btn-sm {
color: var(--left-pane-text-color); color: var(--left-pane-text-color);
} }
.btn.active:not(.btn-primary) {
background-color: var(--button-disabled-background-color) !important;
opacity: 0.4;
}
.ck.ck-block-toolbar-button { .ck.ck-block-toolbar-button {
transform: translateX(7px); transform: translateX(7px);
color: var(--muted-text-color); color: var(--muted-text-color);

View File

@ -41,6 +41,9 @@
--cmd-button-keyboard-shortcut-color: white; --cmd-button-keyboard-shortcut-color: white;
--cmd-button-disabled-opacity: 0.5; --cmd-button-disabled-opacity: 0.5;
--button-group-active-button-background: #ffffff4e;
--button-group-active-button-text-color: white;
--icon-button-color: currentColor; --icon-button-color: currentColor;
--icon-button-hover-background: var(--hover-item-background-color); --icon-button-hover-background: var(--hover-item-background-color);
--icon-button-hover-color: var(--hover-item-text-color); --icon-button-hover-color: var(--hover-item-text-color);

View File

@ -41,6 +41,9 @@
--cmd-button-keyboard-shortcut-color: black; --cmd-button-keyboard-shortcut-color: black;
--cmd-button-disabled-opacity: 0.5; --cmd-button-disabled-opacity: 0.5;
--button-group-active-button-background: #00000026;
--button-group-active-button-text-color: black;
--icon-button-color: currentColor; --icon-button-color: currentColor;
--icon-button-hover-background: var(--hover-item-background-color); --icon-button-hover-background: var(--hover-item-background-color);
--icon-button-hover-color: var(--hover-item-text-color); --icon-button-hover-color: var(--hover-item-text-color);

View File

@ -146,6 +146,14 @@ button.btn.btn-success kbd {
outline: 2px solid var(--input-focus-outline-color); outline: 2px solid var(--input-focus-outline-color);
} }
/* Button groups */
/* Active button */
:root .btn-group button.btn.active {
background-color: var(--button-group-active-button-background);
color: var(--button-group-active-button-text-color);
}
/* /*
* Input boxes * Input boxes
*/ */