mirror of
https://github.com/adoyle0/thaw.git
synced 2025-01-22 22:09:22 -05:00
Proper handling of disabled buttons (#32)
* Proper handling of disabled buttons * Proper handling of disabled buttons * Proper handling of disabled buttons --------- Co-authored-by: Cristobal Andrada <kandrelczyk@gmail.com>
This commit is contained in:
parent
c8228aa470
commit
cd70d80795
2 changed files with 12 additions and 3 deletions
|
@ -12,7 +12,7 @@
|
|||
user-select: none;
|
||||
}
|
||||
|
||||
.thaw-button:hover {
|
||||
.thaw-button:hover:not(.thaw-button--disabled) {
|
||||
border-color: var(--thaw-border-color-hover);
|
||||
background-color: var(--thaw-background-color-hover);
|
||||
cursor: pointer;
|
||||
|
@ -20,6 +20,10 @@
|
|||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.thaw-button--disabled:not(.thaw-button--text) {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.thaw-button:active:not(.thaw-button--disabled) {
|
||||
transition: all 0.3s;
|
||||
border-color: var(--thaw-border-color-hover);
|
||||
|
@ -31,16 +35,20 @@
|
|||
border: none;
|
||||
}
|
||||
|
||||
.thaw-button--text:hover {
|
||||
.thaw-button--text:hover:not(.thaw-button--disabled) {
|
||||
color: var(--thaw-font-color-hover);
|
||||
}
|
||||
|
||||
.thaw-button--text.thaw-button--disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.thaw-button--link {
|
||||
height: auto;
|
||||
padding: inherit;
|
||||
}
|
||||
|
||||
.thaw-button--link:hover {
|
||||
.thaw-button--link:hover:not(.thaw-button--disabled) {
|
||||
color: var(--thaw-font-color-hover);
|
||||
}
|
||||
|
||||
|
|
|
@ -144,6 +144,7 @@ pub fn Button(
|
|||
class=("thaw-button--round", move || round.get())
|
||||
class=("thaw-button--disabled", move || disabled.get())
|
||||
style=move || format!("{}{}", css_vars.get(), style.get())
|
||||
disabled=move || disabled.get()
|
||||
on:click=on_click
|
||||
>
|
||||
<Wave comp_ref=wave_ref/>
|
||||
|
|
Loading…
Add table
Reference in a new issue