Files
commerce/src/components/modules/home/HomeBanner/HomeBanner.module.scss
DatNguyen acb709f5ad 🐛 bug: carousel
:%s
2021-09-20 10:41:23 +07:00

59 lines
1.3 KiB
SCSS

@import "../../../../styles/utilities";
.homeBanner {
@apply spacing-horizontal overflow-hidden;
margin-bottom: 2.8rem;
.left {
@apply hidden;
margin-bottom: 3rem;
max-width: 50rem;
}
@screen xl {
@apply grid;
grid-template-columns: 35.75% 64.25%;
// grid-template-columns: 1fr 1.8fr;
> div {
@apply w-full overflow-hidden;
}
.left {
@apply relative flex items-end justify-center shape-common-lg;
margin-right: 1.6rem;
.imgWrap {
@apply absolute w-full h-full;
top: 0;
left: 0;
> div {
@apply w-full h-full shape-common-lg;
}
img {
object-fit: cover;
}
}
.text {
@apply relative font-heading text-center;
padding: 2.4rem 2.4rem 4.8rem;
width: min-content;
color: var(--white);
font-size: 8.8rem;
line-height: 8rem;
letter-spacing: -0.03em;
font-weight: bold;
text-transform: uppercase;
&::after {
@apply absolute;
content: "";
top: -2.4rem;
right: 0.8rem;
width: 5.7rem;
height: 4.7rem;
background-image: url("./assets/text-decorative.svg");
background-repeat: no-repeat;
}
}
}
}
}