mirror of
https://github.com/hex248/ob248.com.git
synced 2026-02-07 18:23:04 +00:00
super basic pagination
This commit is contained in:
10
src/components/Header.astro
Normal file
10
src/components/Header.astro
Normal file
@@ -0,0 +1,10 @@
|
||||
---
|
||||
import NavLink from "./NavLink.astro";
|
||||
|
||||
const { currentPage } = Astro.props;
|
||||
---
|
||||
|
||||
<header class="flex gap-2 p-2 border-b-1">
|
||||
<NavLink currentPage={currentPage} title="home" href="/" />
|
||||
<NavLink currentPage={currentPage} title="about" href="/about" />
|
||||
</header>
|
||||
9
src/components/NavLink.astro
Normal file
9
src/components/NavLink.astro
Normal file
@@ -0,0 +1,9 @@
|
||||
---
|
||||
const { currentPage, title, href } = Astro.props;
|
||||
---
|
||||
|
||||
<a
|
||||
href={href}
|
||||
class={`${currentPage === title ? "bg-black text-white" : ""} px-1 rounded-sm`}
|
||||
>{title}</a
|
||||
>
|
||||
20
src/layouts/Layout.astro
Normal file
20
src/layouts/Layout.astro
Normal file
@@ -0,0 +1,20 @@
|
||||
---
|
||||
import "../styles/global.css";
|
||||
import Header from "../components/Header.astro";
|
||||
const { currentPage } = Astro.props;
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<title>ob - {currentPage}</title>
|
||||
</head>
|
||||
<body>
|
||||
<Header currentPage={currentPage} />
|
||||
<div class="p-2">
|
||||
<slot />
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
7
src/pages/about.astro
Normal file
7
src/pages/about.astro
Normal file
@@ -0,0 +1,7 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
---
|
||||
|
||||
<Layout currentPage="about">
|
||||
<h1 class="text-md">about page</h1>
|
||||
</Layout>
|
||||
@@ -1,16 +1,7 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
---
|
||||
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>Astro</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Astro</h1>
|
||||
</body>
|
||||
</html>
|
||||
<Layout currentPage="home">
|
||||
<h1 class="text-md">home page</h1>
|
||||
</Layout>
|
||||
Reference in New Issue
Block a user