mirror of
https://github.com/vercel/commerce.git
synced 2025-07-22 20:26:49 +00:00
59 lines
1.3 KiB
SCSS
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;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|