Carousel: Create a bigger hover/click area for controls
This commit is contained in:
@@ -46,21 +46,21 @@
|
||||
&--white {
|
||||
background-color: #fff;
|
||||
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
background-color: $color-secondary;
|
||||
}
|
||||
}
|
||||
&--pink {
|
||||
background-color: rgba($color-secondary, 0.4);
|
||||
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
background-color: rgba($color-secondary, 0.75);
|
||||
}
|
||||
}
|
||||
&--gray {
|
||||
background-color: $color-gray;
|
||||
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
background-color: $color-text;
|
||||
}
|
||||
}
|
||||
@@ -75,7 +75,7 @@
|
||||
transform: translate3d(100%, -50%, 0);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
.icon:not([aria-hidden]) {
|
||||
opacity: 0;
|
||||
transform: translate3d(-100%, 0, 0);
|
||||
@@ -92,7 +92,7 @@
|
||||
transform: translate3d(-150%, -50%, 0);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
.icon:not([aria-hidden]) {
|
||||
opacity: 0;
|
||||
transform: translate3d(100%, 0, 0);
|
||||
@@ -110,7 +110,7 @@
|
||||
transform: translate3d(0, -150%, 0);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
.icon:not([aria-hidden]) {
|
||||
opacity: 0;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
@@ -128,7 +128,7 @@
|
||||
transform: translate3d(0, 150%, 0);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
.icon:not([aria-hidden]) {
|
||||
opacity: 0;
|
||||
transform: translate3d(0, -100%, 0);
|
||||
@@ -178,7 +178,7 @@
|
||||
}
|
||||
|
||||
// Hover
|
||||
&:hover {
|
||||
&:hover, &:focus {
|
||||
background-color: rgba($color-lightpurple, 0.65);
|
||||
|
||||
* {
|
||||
|
||||
Reference in New Issue
Block a user