diff options
Diffstat (limited to 'old_stuff/src/components/Nav.astro')
| -rw-r--r-- | old_stuff/src/components/Nav.astro | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/old_stuff/src/components/Nav.astro b/old_stuff/src/components/Nav.astro new file mode 100644 index 0000000..da08b32 --- /dev/null +++ b/old_stuff/src/components/Nav.astro @@ -0,0 +1,47 @@ +--- +interface Props { + path: string; +} + +const { path } = Astro.props; + +const directories = ["skills", "projects", "blogs"]; +--- + +<nav + class="grid sm:flex + justify-between + border-[0.25vh] sm:border-[0.125vw] + border-[var(--alt)] + border-solid + mb-[7vw] sm:mb-[1.5625vw] + p-[3vw] sm:p-[1vw]" +> + <span class="mr-[2.5vh] text-[5vw] sm:mr-[2.5vw] sm:text-[1.375vw]" + >{path}</span + > + <span + id="nav-links" + class="mb-0 mx-[0.2vw] text-[5vw] + mx-[0.2vw] sm:text-[1.375vw]" + > + <a href="/">home</a> + { + directories.map((dir) => ( + <> + <a href={`/${dir}`}>{dir}</a> + </> + )) + } + <a class="hidden sm:contents" href="/shell">shell</a> + </span> +</nav> + +<style> + #nav-links a { + color: var(--primary); + } + #nav-links a:hover { + color: var(--accent); + } +</style> |
