feat: create generic page template apply to Tag and Entry template
This commit is contained in:
parent
3a0bed3355
commit
052f42b580
3 changed files with 34 additions and 39 deletions
|
|
@ -1,25 +1,7 @@
|
|||
import Main from "@/templates/Main"
|
||||
import { useParams } from "react-router"
|
||||
|
||||
import Page from "./Page"
|
||||
export default function Entry() {
|
||||
const { entry } = useParams()
|
||||
return (
|
||||
<Main>
|
||||
<div className="flex-1 flex flex-col overflow-auto">
|
||||
<div className="@container/main flex flex-col">
|
||||
<div className="flex flex-1">
|
||||
<div className="border-l-none w-full">
|
||||
<div className="border-b py-2 px-4 lg:px-6 bg-sidebar">
|
||||
<h2 className="scroll-m-20 font-semibold">
|
||||
<span>{entry?.replace(/_/g, " ")}</span>
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div className="p-4 lg:p-6"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Main>
|
||||
)
|
||||
return <Page titleComponent={<span>{entry?.replace(/_/g, " ")}</span>} />
|
||||
}
|
||||
|
|
|
|||
23
src/templates/Page.tsx
Normal file
23
src/templates/Page.tsx
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
import Main from "./Main"
|
||||
|
||||
export default function Page({ pageTitle = null, pageBody = null, titleComponent = null }) {
|
||||
return (
|
||||
<Main>
|
||||
<div className="flex-1 flex flex-col overflow-auto">
|
||||
<div className="@container/main flex flex-col">
|
||||
<div className="flex flex-1">
|
||||
<div className="border-l-none w-full">
|
||||
<div className="border-b py-2 px-4 lg:px-6 bg-sidebar">
|
||||
<h2 className="scroll-m-20 font-semibold">
|
||||
{titleComponent ? titleComponent : <span>{pageTitle}</span>}
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div className="p-4 lg:p-6">{pageBody}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Main>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,26 +1,16 @@
|
|||
import Main from "@/templates/Main"
|
||||
import { useParams } from "react-router"
|
||||
|
||||
import Page from "./Page"
|
||||
export default function Tag() {
|
||||
const { tag } = useParams()
|
||||
return (
|
||||
<Main>
|
||||
<div className="flex-1 flex flex-col overflow-auto">
|
||||
<div className="@container/main flex flex-col">
|
||||
<div className="flex flex-1">
|
||||
<div className="border-l-none w-full">
|
||||
<div className="border-b py-2 px-4 lg:px-6 bg-sidebar">
|
||||
<h2 className="scroll-m-20 font-semibold">
|
||||
<span className="mr-2 text-muted-foreground">Entries tagged:</span>
|
||||
<span>{tag}</span>
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div className="p-4 lg:p-6"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Main>
|
||||
<Page
|
||||
titleComponent={
|
||||
<>
|
||||
<span className="mr-2 text-muted-foreground">Entries tagged:</span>
|
||||
<span>{tag}</span>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue