design: add styling for disabled buttons

This commit is contained in:
Pierre de La Morinerie 2018-07-18 16:20:51 +02:00 committed by gregoirenovel
parent a386a0ffb2
commit 030562a32f
2 changed files with 21 additions and 7 deletions

View file

@ -10,11 +10,11 @@
line-height: 20px;
background-color: #FFFFFF;
color: $black;
cursor: pointer;
text-align: center;
-webkit-appearance: none;
&:hover {
&:hover:not(:disabled) {
cursor: pointer;
background: $light-grey;
text-decoration: none;
}
@ -24,12 +24,17 @@
outline: none;
}
&:disabled {
opacity: 0.5;
filter: saturate(50%);
}
&.primary {
color: #FFFFFF;
border-color: $blue;
background-color: $blue;
&:hover {
&:hover:not(:disabled) {
background: $light-blue;
}
}
@ -39,7 +44,7 @@
border-color: $blue;
background-color: #FFFFFF;
&:hover {
&:hover:not(:disabled) {
color: #FFFFFF;
background: $light-blue;
}
@ -62,7 +67,7 @@
border-color: $green;
background-color: $green;
&:hover {
&:hover:not(:disabled) {
color: $green;
background-color: #FFFFFF;
}
@ -73,7 +78,7 @@
border-color: $black;
background-color: $black;
&:hover {
&:hover:not(:disabled) {
color: $black;
background-color: #FFFFFF;
}
@ -84,7 +89,7 @@
border-color: $dark-red;
background-color: $dark-red;
&:hover {
&:hover:not(:disabled) {
color: $dark-red;
background-color: #FFFFFF;
}