💄(react) remove button box shadow effect
On hover and active, buttons have a box shadow effect that is too heavy visually so we remove this effect for now.
This commit is contained in:
committed by
Jean-Baptiste PENRATH
parent
1667d9b501
commit
1be02f5a85
5
.changeset/late-fans-wave.md
Normal file
5
.changeset/late-fans-wave.md
Normal file
@@ -0,0 +1,5 @@
|
||||
---
|
||||
"@openfun/cunningham-react": minor
|
||||
---
|
||||
|
||||
remove button box shadow
|
||||
@@ -13,10 +13,6 @@
|
||||
border-radius: var(--c--components--button--border-radius--active);
|
||||
}
|
||||
|
||||
&:hover, &:focus-visible {
|
||||
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
border-color: #FFF;
|
||||
box-shadow: 0 0 0 4px var(--c--theme--colors--primary-400);
|
||||
@@ -25,7 +21,6 @@
|
||||
|
||||
&:active, &.c__button--active {
|
||||
border-color: currentColor;
|
||||
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
@@ -107,12 +102,12 @@
|
||||
color: var(--c--theme--colors--greyscale-800);
|
||||
|
||||
&:hover, &:focus-visible {
|
||||
background-color: var(--c--theme--colors--greyscale-100);
|
||||
background-color: var(--c--theme--colors--greyscale-200);
|
||||
color: var(--c--theme--colors--greyscale-900);
|
||||
}
|
||||
|
||||
&:active, &.c__button--active {
|
||||
background-color: var(--c--theme--colors--greyscale-200);
|
||||
background-color: var(--c--theme--colors--greyscale-100);
|
||||
color: var(--c--theme--colors--greyscale-800);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user