fix: proper spacing on mobile

This commit is contained in:
Chuma McPhoy
2024-09-27 10:51:07 +02:00
parent 42471b309f
commit ff34ae3c0f

View File

@@ -26,8 +26,7 @@
.heroContainer { .heroContainer {
width: 100%; width: 100%;
padding-bottom: var(--Spacing-x4); padding: var(--Spacing-x4) var(--Spacing-x2);
padding-top: var(--Spacing-x4);
} }
.heroContainer img { .heroContainer img {
@@ -39,7 +38,7 @@
.contentContainer { .contentContainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding-top: var(--Spacing-x4); padding: var(--Spacing-x4) var(--Spacing-x2) 0;
} }
.mainContent { .mainContent {
@@ -57,11 +56,15 @@
} }
@media (min-width: 1367px) { @media (min-width: 1367px) {
.heroContainer {
padding: var(--Spacing-x4) 0;
}
.contentContainer { .contentContainer {
display: grid; display: grid;
grid-template-columns: var(--max-width-text-block) 1fr; grid-template-columns: var(--max-width-text-block) 1fr;
gap: var(--Spacing-x9); gap: var(--Spacing-x9);
max-width: var(--max-width-content); max-width: var(--max-width-content);
margin: 0 auto; margin: 0 auto;
padding: var(--Spacing-x4) 0 0;
} }
} }