diff options
| author | Andrew Lee <alee14498@protonmail.com> | 2024-01-22 19:56:50 -0500 |
|---|---|---|
| committer | Andrew Lee <alee14498@protonmail.com> | 2024-01-22 20:53:41 -0500 |
| commit | 8fd6f1a2739b686092bbb5806666e63f283d6510 (patch) | |
| tree | e378cd080f8f6882e0282e9db6a6b0c48030049b /src/layouts/Default.astro | |
| parent | 7604592b7a68fee231b63ff5123837e3eb1beaf8 (diff) | |
| download | personal-website-8fd6f1a2739b686092bbb5806666e63f283d6510.tar.gz personal-website-8fd6f1a2739b686092bbb5806666e63f283d6510.tar.bz2 personal-website-8fd6f1a2739b686092bbb5806666e63f283d6510.zip | |
Add Vue.JS for Navbar; Transitions; Getting started on projects
Diffstat (limited to 'src/layouts/Default.astro')
| -rw-r--r-- | src/layouts/Default.astro | 22 |
1 files changed, 15 insertions, 7 deletions
diff --git a/src/layouts/Default.astro b/src/layouts/Default.astro index ecc4e2e..29662c6 100644 --- a/src/layouts/Default.astro +++ b/src/layouts/Default.astro @@ -1,18 +1,19 @@ --- interface Props { title: string; - description: string; + description: string; } const { title, description } = Astro.props; -import { ViewTransitions } from 'astro:transitions'; -import Navbar from '../components/Navbar.astro'; +import { ViewTransitions, slide } from 'astro:transitions'; +import Navbar from '../components/Navbar.vue'; --- <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> + <meta name="title" content={title} /> <meta name="description" content={description} /> <meta name="viewport" content="width=device-width" /> <link rel="preconnect" href="https://fonts.googleapis.com"> @@ -24,11 +25,13 @@ import Navbar from '../components/Navbar.astro'; <title>{title}</title> </head> <body> - <Navbar /> + <Navbar client:load /> + <div transition:animate={slide({ duration: '0.2s' })}> <slot /> - <footer> - <p>Copyright © 2024 Andrew Lee</p> - </footer> + <footer> + <p>Copyright © 2024 Andrew Lee</p> + </footer> + </div> </body> </html> <style is:global> @@ -40,6 +43,11 @@ import Navbar from '../components/Navbar.astro'; color: #FFFFFF; } + ul { + padding-left: 20px; + font-size: 1.1em; + } + footer { text-align: center; font-size: 1.3em; |