RESPONSIVE Fix and optimization
This commit is contained in:
parent
59a829616a
commit
d6c012a7c8
|
|
@ -7,7 +7,9 @@
|
|||
.swiper-pagination {
|
||||
@apply px-12;
|
||||
}
|
||||
|
||||
.swiper-wrapper {
|
||||
@apply mb-0;
|
||||
}
|
||||
&__inner {
|
||||
@apply max-w-screen-2xl mx-auto;
|
||||
}
|
||||
|
|
@ -25,11 +27,11 @@
|
|||
}
|
||||
|
||||
&__slider-content {
|
||||
@apply py-16 pt-8 md:pt-16 lg:pt-32;
|
||||
@apply py-16 pt-8 md:pt-16 2xl:pt-32;
|
||||
}
|
||||
|
||||
.card-revue {
|
||||
@apply flex flex-col lg:grid lg:grid-cols-2 gap-y-2 md:gap-y-12 2xl:gap-y-16 pb-12 gap-x-12 2xl:gap-x-24 lg:px-12 px-4;
|
||||
@apply flex flex-col lg:grid lg:grid-cols-2 gap-y-2 md:gap-y-6 2xl:gap-y-16 pb-1 2xl:pb-12 gap-x-12 2xl:gap-x-24 lg:px-12 px-4;
|
||||
@screen lg {
|
||||
grid-template-columns: 61.8fr 38.2fr;
|
||||
}
|
||||
|
|
@ -41,8 +43,10 @@
|
|||
}
|
||||
|
||||
&__content {
|
||||
@apply mx-0;
|
||||
h4.title {
|
||||
@apply uppercase text-3xl md:text-6xl lg:text-4xl font-normal pb-8;
|
||||
@apply uppercase text-3xl md:text-6xl lg:text-6xl font-normal pb-8;
|
||||
line-height: 1.02;
|
||||
}
|
||||
h5.edito-title {
|
||||
@apply text-2xl font-bold uppercase pb-8;
|
||||
|
|
@ -54,10 +58,10 @@
|
|||
|
||||
.card-background {
|
||||
@apply absolute border-primary border bg-white top-20 left-8;
|
||||
height: 94%;
|
||||
width: 104%;
|
||||
height: 300px;
|
||||
transform: perspective(800px) rotateY(10deg) skewX(1deg) rotateZ(4deg)
|
||||
rotateX(1deg) scale(0.98) translateY(-2px);
|
||||
rotateX(1deg) scale(0.98) translateY(-40px);
|
||||
z-index: 0;
|
||||
|
||||
&::before {
|
||||
|
|
@ -66,18 +70,22 @@
|
|||
height: calc(100% - 42px);
|
||||
left: 21px;
|
||||
top: 21px;
|
||||
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__issue-thumbnail,
|
||||
.card-background {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
&__issue-thumbnail {
|
||||
@apply bg-white border-primary border relative;
|
||||
/* transform: perspective(800px) rotateY(10deg) skewX(2deg); */
|
||||
height: 330px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
height: 300px;
|
||||
|
||||
img {
|
||||
width: calc(100% - 42px);
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user