Antoine/homegrade_theme_production
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactoring the block with an inner container

Browse Source
This commit is contained in:
Antoine M 2023-11-17 17:04:57 +01:00
parent 1ea15b7fdc
commit c58113bd4f
1 changed files with 39 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
resources/css/blocks/timeline.css
View File

@ -1,10 +1,29 @@
.homegrade-blocks-timeline { .homegrade-blocks-timeline {
@apply max-w-screen-xl mx-auto relative my-32; @apply max-w-screen-xl mx-auto my-32;
&__lateral-cover { .section_titling {
@apply max-h-96 h-auto mx-auto; @apply mb-9;
} }
&__container {
@apply relative;
}
&__lateral-cover {
img {
@apply rounded-3xl mb-3;
}
.description,
.caption {
@apply m-0 p-0;
}
.caption {
@apply font-semibold text-primary text-sm;
}
}
&--has-lateral-cover { &--has-lateral-cover {
@apply grid grid-cols-3 gap-12; .homegrade-blocks-timeline__container {
@apply grid grid-cols-3 gap-12;
}
.homegrade-blocks-timeline__innercontent { .homegrade-blocks-timeline__innercontent {
@apply col-span-2; @apply col-span-2;
} }
@ -13,17 +32,19 @@
} }
} }
&--has-step-icons { &--has-step-icons {
&:before { .homegrade-blocks-timeline__container {
@apply rounded-xl bg-secondary &:before {
opacity-10 @apply rounded-xl bg-secondary
absolute opacity-10
top-0 absolute
h-full; top-0
z-index: -1; h-full;
content: ''; z-index: -1;
top: 0; content: '';
left: calc(33% + 56px); top: 0;
width: 26px; left: calc(33% + 56px);
width: 26px;
}
} }
} }
&--has-no-step-pictures { &--has-no-step-pictures {
@ -49,8 +70,9 @@
@apply w-24 h-24 shrink-0 bg-white shadowed p-4 rounded-3xl flex justify-center items-center; @apply w-24 h-24 shrink-0 bg-white shadowed p-4 rounded-3xl flex justify-center items-center;
img { img {
@apply mx-auto object-contain w-12 h-10; @apply mx-auto object-contain;
max-height: 3rem; max-width: 80%;
max-height: 80%;
} }
} }
&__content { &__content {