style(next): buttons: style keyboard shortcut

This commit is contained in:
Adorian Doran 2025-01-29 22:20:52 +02:00
parent e29389296d
commit e96b9f3251
3 changed files with 17 additions and 0 deletions

View File

@ -26,6 +26,8 @@
--cmd-button-hover-background-color: #ffffff37;
--cmd-button-hover-text-color: white;
--cmd-button-shadow-color: #00000080;
--cmd-button-keyboard-shortcut-background: #0000004d;
--cmd-button-keyboard-shortcut-color: white;
--cmd-button-disabled-opacity: .5;
--muted-text-color: #bbb;

View File

@ -26,6 +26,8 @@
--cmd-button-hover-background-color: #00000016;
--cmd-button-hover-text-color: #000;
--cmd-button-shadow-color: #00000040;
--cmd-button-keyboard-shortcut-background: #00000017;
--cmd-button-keyboard-shortcut-color: black;
--cmd-button-disabled-opacity: .5;
--muted-text-color: #666;

View File

@ -54,6 +54,19 @@ button.btn.btn-success:focus-visible {
outline: 2px solid var(--input-focus-outline-color);
}
button.btn.btn-primary kbd,
button.btn.btn-secondary kbd,
button.btn.btn-sm kbd,
button.btn.btn-success kbd {
margin-left: .5em;
vertical-align: middle;
background: var(--cmd-button-keyboard-shortcut-background);
color: var(--cmd-button-keyboard-shortcut-color);
font-size: .6em;
text-transform: uppercase;
letter-spacing: .5pt;
}
button.btn + button.btn {
margin-left: 8px;
}