Deligraph-V3/resources/css/blocks/gallery-website-screens.css
2025-02-06 16:18:08 +01:00

41 lines
850 B
CSS

.gallery-website-screens {
@apply bg-neutral-100 p-10 w-screen;
&--padding-simple {
@apply py-10;
}
&--padding-double {
@apply py-16;
}
margin: 0 calc(50% - 50vw);
&__screens-grid {
@apply gap-4 px-0 md:px-4 lg:px-12 justify-center list-none mx-auto;
&.is-grid {
@apply grid grid-cols-2 lg:grid-cols-3;
}
&.is-flex {
@apply flex flex-nowrap;
img {
@apply max-h-96;
}
}
&.is-mobile-capture {
@apply md:gap-6 xl:gap-12;
img {
@apply rounded-xl xl:rounded-3xl max-w-60;
}
}
.gallery-website-screens__single-screen {
img {
width: 100%; /* Fixe la largeur max */
height: 100%; /* Fixe la hauteur max */
max-height: 800px; /* Ajuste selon ton besoin */
object-fit: cover; /* Évite les déformations */
}
}
max-width: 1800px;
}
}