jaculabilis/danbooru
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

css: fix disabled buttons appearing clickable.

Browse Source 
Fix buttons appearing to be clickable when in the disabled state.

Submit buttons are normally disabled after a form is submitted. Before
these buttons would still look clickable. Now disabled buttons are greyed
out instead of looking the same as normal buttons.
This commit is contained in:
evazion
2022-02-07 18:26:34 -06:00
parent 3f64808432
commit a5b92dc9e6
3 changed files with 17 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
app/javascript/src/styles/common/buttons.scss
View File

@@ -13,18 +13,27 @@ input[type="button"], input[type="submit"], button {
border-radius: 3px;
padding: 0.25em 1em;
background: var(--form-button-background);
cursor: pointer;
border: 1px solid var(--form-button-border-color);
background: var(--form-button-background);
color: var(--form-button-text-color);
&:hover {
box-shadow: 0 0 2px var(--form-button-hover-box-shadow-color);
&:disabled {
cursor: wait;
background: var(--form-button-hover-background);
color: var(--form-button-disabled-text-color);
}
&:active {
box-shadow: 0 0 2px var(--form-button-hover-box-shadow-color);
background: var(--form-button-active-background);
&:not(:disabled) {
&:hover {
box-shadow: 0 0 2px var(--form-button-hover-box-shadow-color);
background: var(--form-button-hover-background);
}
&:active {
box-shadow: 0 0 2px var(--form-button-hover-box-shadow-color);
background: var(--form-button-active-background);
}
}
}