ldc-theme-default/sass/base/_common.scss
2025-06-25 17:52:24 +02:00

110 lines
2.5 KiB
SCSS

// Empty.
.text-border-white {
text-shadow: 2px 0 #fff, -2px 0 #fff, 0 2px #fff, 0 -2px #fff,
1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
}
.geometric-form-background {
position: absolute;
top: 50%;
left: 50%;
background: $color-primary;
clip-path: polygon(8px 0, 100% 8px, calc(100% - 4px) calc(100% - 4px), 0 100%);
transform: translate(-50%, -50%);
}
.title-bikes {
font-size: 4rem;
line-height: .7;
@include media-breakpoint-up(lg) {
padding: 0 12rem;
&::before {
position: absolute;
z-index: 1;
bottom: -.5rem;
left: 0.3rem;
width: 12rem;
height: 4.5rem;
background-image: url('@Theme/images/Velos-rouges.png');
background-repeat: no-repeat;
background-size: contain;
content: "";
}
}
}
.default-image-background {
background-image: url('@Theme/images/home_background.png');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
.border-custom {
border-top: 4px solid #{$color-white};
@include media-breakpoint-up(lg) {
border-top: 0;
border-left: 4px solid #{$color-white};
}
}
.details {
&-left, &-right {
top: -2rem;
width: 30rem;
}
&-left {
left: -2rem;
transform: rotate(-10deg);
}
&-right {
right: -2rem;
transform: rotate(10deg);
}
}
@include media-breakpoint-up(lg) {
.gifts-imgs::before {
position: absolute;
z-index: 2;
bottom: 0;
left: 10vw;
width: 10rem;
height: 10rem;
background-image: url('@Theme/images/cadeau-rouge.png');
background-repeat: no-repeat;
background-size: contain;
content: "";
}
.gifts-imgs::after {
position: absolute;
z-index: 2;
right: 10vw;
bottom: 0;
width: 10rem;
height: 10rem;
background-image: url('@Theme/images/cadeau-bleu.png');
background-repeat: no-repeat;
background-size: contain;
content: "";
}
.gift-after::before {
position: absolute;
z-index: 2;
right: 0;
bottom: -5rem;
width: 10rem;
height: 10rem;
background-image: url('@Theme/images/cadeau-bleu.png');
background-repeat: no-repeat;
background-size: contain;
content: "";
}
}