diff --git a/components.css b/components.css index 6477003..7db7789 100644 --- a/components.css +++ b/components.css @@ -51,9 +51,13 @@ p { line-height: 1.5rem; } -section { - padding: 1rem 2rem; - margin: 0 auto; +section, nav, footer { + padding: 8rem 2rem; + + & > div:only-child, &:not(:has(>div:only-child)){ + max-width: var(--max-content-width); + margin: 0 auto; + } } svg { diff --git a/style.css b/style.css index d57da29..cfb7f70 100644 --- a/style.css +++ b/style.css @@ -17,10 +17,6 @@ nav { } nav > div { - max-width: var(--max-content-width); - margin: 0 auto; - - /* content inside */ display: grid; grid-template-columns: 1fr auto 1fr; grid-template-rows: 1fr; @@ -131,11 +127,7 @@ nav > div { .about-us { background-color: var(--surface-container-low); - padding: 2rem; - & > div { - max-width: var(--max-content-width); - margin: 0 auto; gap: 4rem; display: grid; grid-template-columns: 3fr 2fr; @@ -184,9 +176,6 @@ nav > div { } .featured-delights { - max-width: var(--max-content-width); - margin: 0 auto; - padding: 2rem; gap: 2rem; display: grid; grid-template-columns: 1fr 1fr 1fr; @@ -278,10 +267,7 @@ nav > div { & > div { background-color: rgb(from var(--surface) r g b / 0.6); - max-width: var(--max-content-width); - margin: 6rem auto; border-radius: var(--border-radius); - padding: 4rem; display: grid; grid-template-columns: 1fr 1fr; @@ -349,9 +335,6 @@ nav > div { footer { display: grid; grid-template-columns: 3fr 2fr 2fr; - max-width: var(--max-content-width); - margin: 3rem auto; - padding: 2rem; gap: 1rem; @media (max-width: 768px) {