refining styling
This commit is contained in:
parent
9401e3f110
commit
743abd902b
|
|
@ -1,18 +1,37 @@
|
|||
.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);
|
||||
ul {
|
||||
|
||||
&__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 gap-24;
|
||||
@apply md:gap-6 xl:gap-12;
|
||||
img {
|
||||
@apply rounded-3xl max-w-60;
|
||||
@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 */
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user