mirror of
https://github.com/vercel/commerce.git
synced 2025-07-05 20:51:21 +00:00
52 lines
933 B
SCSS
52 lines
933 B
SCSS
@import '../../../styles/utilities';
|
|
.navigationWrapper {
|
|
@apply relative;
|
|
min-height: theme('caroucel.arrow-height');
|
|
.isPadding {
|
|
@apply spacing-horizontal;
|
|
}
|
|
:global(.customArrow) {
|
|
width: 64px;
|
|
height: 64px;
|
|
&:focus {
|
|
outline: none;
|
|
}
|
|
@apply absolute top-1/2 bg-background-arrow transform -translate-y-1/2 flex justify-center items-center transition duration-100;
|
|
&:global(.leftArrow) {
|
|
@apply left-0;
|
|
}
|
|
&:global(.rightArrow) {
|
|
@apply right-0;
|
|
}
|
|
&:global(.isDisabledArrow) {
|
|
@apply hidden;
|
|
}
|
|
}
|
|
:global {
|
|
.dots {
|
|
display: flex;
|
|
padding: 1rem 0;
|
|
justify-content: center;
|
|
}
|
|
|
|
.dot {
|
|
border: none;
|
|
width: 1rem;
|
|
height: 1rem;
|
|
background: #c5c5c5;
|
|
border-radius: 50%;
|
|
margin: 0 0.5rem;
|
|
padding: 0.5rem;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.dot:focus {
|
|
outline: none;
|
|
}
|
|
|
|
.dot.active {
|
|
background: #000;
|
|
}
|
|
}
|
|
}
|