diff options
| author | Joe Carstairs <65492573+Sycamost@users.noreply.github.com> | 2024-05-12 09:20:30 +0100 |
|---|---|---|
| committer | Joe Carstairs <65492573+Sycamost@users.noreply.github.com> | 2024-05-12 09:20:30 +0100 |
| commit | a086d765e45ab00a4d1ec1d3fff6d59d8fa710ad (patch) | |
| tree | 6ecd6e6a7f82d854946ea83bf9614a84b0cc68da | |
| parent | 0f75bf3443996f287b9a8a70abb0b3ac8031def8 (diff) | |
Tweaks styling
| -rw-r--r-- | website/public/css/base.css | 23 | ||||
| -rw-r--r-- | website/src/components/Navbar.astro | 12 |
2 files changed, 27 insertions, 8 deletions
diff --git a/website/public/css/base.css b/website/public/css/base.css index a3f8e49..cff23c8 100644 --- a/website/public/css/base.css +++ b/website/public/css/base.css @@ -84,11 +84,18 @@ body { } @media (min-width: 36rem) { - :is(main, article) { + body { display: grid; grid-template-columns: [media-start] 6rem [content-start] 1fr [content-end]; margin-inline-end: 6rem; column-gap: var(--spacing-block-sm); + max-width: calc(6rem + var(--spacing-block-sm) + 30rem); + + :is(main, article, nav) { + display: grid; + grid-column: media-start / content-end; + grid-template-columns: subgrid; + } :is(section, header, aside) { grid-column: content-start / content-end; @@ -136,7 +143,8 @@ a:is(:link, :visited) { nav { margin-block: var(--spacing-block-sm); - li { + ul { + grid-column: media-start / content-end; display: flex; justify-content: center; gap: var(--spacing-inline-md); @@ -144,6 +152,17 @@ nav { } } +@media (min-width: 36rem) { + nav { + display: grid; + grid-template-columns: subgrid; + + ul { + justify-content: end; + } + } +} + /** Blog feed */ .h-feed { diff --git a/website/src/components/Navbar.astro b/website/src/components/Navbar.astro index bae661b..c94944a 100644 --- a/website/src/components/Navbar.astro +++ b/website/src/components/Navbar.astro @@ -2,12 +2,12 @@ --- <nav> - <li> - <ul> + <ul> + <li> <a href="/">Home</a> - </ul> - <ul> + </li> + <li> <a href="/blog">Blog</a> - </ul> - </li> + </li> + </ul> </nav> |