STYLE refine styles for block-dernieres-dynamiques and introduce new variations for website themes
This commit is contained in:
parent
fdf5da229e
commit
b5a3785574
|
|
@ -1,5 +1,5 @@
|
||||||
.block-dernieres-dynamiques {
|
.block-dernieres-dynamiques {
|
||||||
@apply bg-primary text-white pt-2 md:pt-20 px-4 md:px-16;
|
@apply pt-2 md:pt-20 px-4 md:px-16;
|
||||||
/* overflow: visible !important; */
|
/* overflow: visible !important; */
|
||||||
overflow: hidden !important;
|
overflow: hidden !important;
|
||||||
|
|
||||||
|
|
@ -8,15 +8,14 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&__header {
|
&__header {
|
||||||
@apply flex flex-wrap items-end justify-between gap-8 gap-y-2 uppercase text-4xl mb-6 md:mb-12;
|
@apply flex flex-wrap items-end justify-between gap-8 gap-y-2 uppercase text-4xl mb-6 md:mb-12;
|
||||||
|
|
||||||
.block-title {
|
.block-title {
|
||||||
@apply flex grow items-end justify-between gap-8 uppercase text-2xl md:text-4xl lg:text-5xl;
|
@apply flex grow items-end justify-between gap-8 uppercase text-2xl md:text-4xl lg:text-5xl;
|
||||||
span {
|
span {
|
||||||
@apply block shrink-0;
|
@apply block shrink-0;
|
||||||
}
|
}
|
||||||
&:after {
|
&:after {
|
||||||
@apply w-full z-20 bg-white block mb-2;
|
@apply w-full z-20 block mb-2;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
content: ' ';
|
content: ' ';
|
||||||
}
|
}
|
||||||
|
|
@ -144,7 +143,6 @@
|
||||||
&:after {
|
&:after {
|
||||||
@apply content-[''] absolute inset-0 bg-carhop-purple-100 w-screen left-1/2 -translate-x-1/2;
|
@apply content-[''] absolute inset-0 bg-carhop-purple-100 w-screen left-1/2 -translate-x-1/2;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
/* opacity: 0.5; */
|
|
||||||
top: 100px;
|
top: 100px;
|
||||||
|
|
||||||
@screen lg {
|
@screen lg {
|
||||||
|
|
@ -160,8 +158,41 @@
|
||||||
@apply text-base font-extrabold uppercase pb-8 tracking-bigbig nunito text-primary text-center mx-auto block mt-12;
|
@apply text-base font-extrabold uppercase pb-8 tracking-bigbig nunito text-primary text-center mx-auto block mt-12;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.is-website-dynamiques .block-dernieres-dynamiques {
|
||||||
|
@apply bg-primary text-white;
|
||||||
|
&__header {
|
||||||
|
.block-title:after {
|
||||||
|
@apply bg-white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
:is(p, span, h1, h2, h3, h4, h5, h6):not(.article-card *) {
|
:is(p, span, h1, h2, h3, h4, h5, h6):not(.article-card *) {
|
||||||
@apply text-white;
|
@apply text-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.related-articles:after {
|
||||||
|
@apply content-[''] absolute inset-0 bg-carhop-purple-100 w-screen left-1/2 -translate-x-1/2;
|
||||||
|
z-index: 0;
|
||||||
|
top: 100px;
|
||||||
|
|
||||||
|
@screen lg {
|
||||||
|
height: calc(100% - 150px);
|
||||||
|
transform: translateY(100px) translateX(-50%) perspective(800px) skewX(1deg)
|
||||||
|
rotateZ(-2deg) rotateY(-4deg) scaleX(1.98);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.is-website-carhop .block-dernieres-dynamiques {
|
||||||
|
@apply bg-carhop-orange-50 text-primary;
|
||||||
|
|
||||||
|
&__header {
|
||||||
|
.block-title:after {
|
||||||
|
@apply bg-primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
:is(p, span, h1, h2, h3, h4, h5, h6):not(.article-card *) {
|
||||||
|
@apply text-primary;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user