refining responsive

This commit is contained in:
Antoine M 2024-07-18 14:43:01 +02:00
parent b8bc4a9756
commit fb8559e21d

View File

@ -1,18 +1,24 @@
.parcours-chapter { .parcours-chapter {
@apply p-4 pt-16 !my-20 grid; @apply p-4 pt-16 !my-20 flex flex-wrap lg:grid;
grid-template-columns: 42% 16% 42%; grid-template-columns: 42% 16% 42%;
&:nth-child(even) { &:nth-child(even) {
.parcours-chapter__cover { .parcours-chapter__cover {
@apply order-3; @apply lg:order-3;
} }
.parcours-chapter__content { .parcours-chapter__content {
order: -1; @apply lg:-order-1;
} }
} }
&__cover { &__cover {
/* @apply w-full h-full bg-green-300; */ /* @apply w-full h-full bg-green-300; */
justify-self: center; justify-self: center;
@media screen and (max-width: 1024px) {
@apply !w-full h-full;
}
img { img {
@apply w-full h-auto; @apply w-full h-auto;
max-width: 380px; max-width: 380px;
@ -20,7 +26,7 @@
} }
} }
&__icon { &__icon {
@apply h-24 w-24 shadowed-lg p-5 bg-white rounded-3xl; @apply my-6 h-24 w-24 shadowed-lg p-5 bg-white rounded-3xl;
justify-self: center; justify-self: center;
} }
&__content { &__content {