diff options
| author | Ariel Costas Guerrero <94913521+arielcostas@users.noreply.github.com> | 2024-10-11 23:14:54 +0200 |
|---|---|---|
| committer | Ariel Costas Guerrero <94913521+arielcostas@users.noreply.github.com> | 2024-10-11 23:14:54 +0200 |
| commit | ad941ff1dd8f282edb70d187c5ad0b593ddc17e7 (patch) | |
| tree | ba2f490da94a88d26a30079929c2554499a55f92 /src/layouts | |
| parent | 34c1425dc85fe19402b9d2b3a63a3aaf7244ebc7 (diff) | |
Improve portfolio section
References #2
Diffstat (limited to 'src/layouts')
| -rw-r--r-- | src/layouts/Layout.astro | 64 |
1 files changed, 60 insertions, 4 deletions
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 2395461..2333acd 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,7 +1,6 @@ --- import "@fontsource-variable/sen"; import Header from "../partials/Header.astro"; -import MainWrapper from "../partials/MainWrapper.astro"; import Footer from "../partials/Footer.astro"; interface Props { @@ -9,7 +8,7 @@ interface Props { description: string; } -const { title, description } = Astro.props; +const { title, description, transitionName, transitionAnimate } = Astro.props; --- <!doctype html> @@ -44,9 +43,9 @@ const { title, description } = Astro.props; </head> <body> <Header /> - <MainWrapper> + <main> <slot /> - </MainWrapper> + </main> <Footer /> </body> </html> @@ -99,4 +98,61 @@ const { title, description } = Astro.props; *::selection { background-color: transparentize($accent, 0.85); } + + li > time { + font-family: $monoFontStack; + } + + main { + box-sizing: border-box; + margin: 0.75rem 1rem 3rem; + padding: 1.5rem 3rem; + border-radius: $floatingRadius; + box-shadow: $shadow; + margin-bottom: auto; + + align-self: center; + + max-width: 82ch; + font-size: 1.2rem; + + background-color: $lightAlt; + + a { + color: $accentDark; + transition: color 0.2s ease-in-out; + + &:hover { + color: $accent; + } + } + + > * { + margin-block: 0.75em; + } + + > p > code { + word-break: break-word; + font-family: $monoFontStack; + + color: $accentDark; + background-color: #f6f6f6; + } + + h1 { + font-size: 2.75rem; + line-height: 1; + margin-bottom: 1rem; + } + + p.meta { + display: block; + font-size: 0.85rem; + margin-bottom: 1rem; + } + + pre { + overflow: scroll; + } + } </style> |