Use Layout component
This commit is contained in:
parent
28c50f1d4f
commit
2d11de3432
25
components/Blog/Layout.tsx
Normal file
25
components/Blog/Layout.tsx
Normal file
@ -0,0 +1,25 @@
|
||||
import type { NextPage } from "next";
|
||||
import Head from "next/head";
|
||||
import Navigation from "./Navigation";
|
||||
|
||||
interface ILayoutProps {
|
||||
title?: string;
|
||||
}
|
||||
|
||||
const Layout: NextPage<ILayoutProps> = ({ title, children }) => {
|
||||
return <>
|
||||
<Head>
|
||||
<title>{title ?? "c0ntroller.de"}</title>
|
||||
</Head>
|
||||
<div id={"blogBody"}>
|
||||
<header>
|
||||
<Navigation />
|
||||
</header>
|
||||
<main>
|
||||
{ children }
|
||||
</main>
|
||||
</div>
|
||||
</>;
|
||||
};
|
||||
|
||||
export default Layout;
|
@ -1,6 +1,5 @@
|
||||
import type { GetServerSideProps, NextPage } from "next";
|
||||
import Head from "next/head";
|
||||
import Navigation from "../../../components/Blog/Navigation";
|
||||
import Layout from "../../../components/Blog/Layout";
|
||||
import { generateContent } from "../../../lib/content/generateBackend";
|
||||
import type { ContentList } from "../../../lib/content/types";
|
||||
|
||||
@ -16,18 +15,10 @@ interface IContentRender {
|
||||
}
|
||||
|
||||
const Post: NextPage<{ content: IContentRender }> = ({ content }) => {
|
||||
return <>
|
||||
<Head>
|
||||
<title>{content.title} - c0ntroller.de</title>
|
||||
</Head>
|
||||
<div id={"blogBody"}>
|
||||
<header>
|
||||
<Navigation />
|
||||
</header>
|
||||
<main dangerouslySetInnerHTML={{ __html: content.html}}>
|
||||
</main>
|
||||
</div>
|
||||
</>;
|
||||
return <Layout title={`${content.title} - c0ntroller.de`}>
|
||||
<div dangerouslySetInnerHTML={{ __html: content.html}}>
|
||||
</div>
|
||||
</Layout>;
|
||||
};
|
||||
|
||||
export const getServerSideProps: GetServerSideProps = async (context) => {
|
||||
|
@ -1,12 +1,11 @@
|
||||
import type { NextPage } from "next";
|
||||
import Head from "next/head";
|
||||
import type { ContentList } from "../lib/content/types";
|
||||
import Navigation from "../components/Blog/Navigation";
|
||||
import ProjectCard from "../components/Blog/Card";
|
||||
|
||||
import contentList from "../public/content/list.json";
|
||||
|
||||
import styles from "../styles/Blog/Front.module.scss";
|
||||
import Layout from "../components/Blog/Layout";
|
||||
|
||||
const Blog: NextPage<{ content: ContentList }> = ({content}) => {
|
||||
const generateCards = (type: string) => {
|
||||
@ -14,22 +13,14 @@ const Blog: NextPage<{ content: ContentList }> = ({content}) => {
|
||||
};
|
||||
|
||||
return <>
|
||||
<Head>
|
||||
<title>c0ntroller.de</title>
|
||||
</Head>
|
||||
<div id={"blogBody"}>
|
||||
<header>
|
||||
<Navigation />
|
||||
</header>
|
||||
<main>
|
||||
<h1>Hello there!</h1>
|
||||
<p>Miaumiau Lorem ipsum</p>
|
||||
<h2>Projects</h2>
|
||||
{ generateCards("project") }
|
||||
<h2>Diaries</h2>
|
||||
{ generateCards("diary") }
|
||||
</main>
|
||||
</div>
|
||||
<Layout>
|
||||
<h1>Hello there!</h1>
|
||||
<p>Miaumiau Lorem ipsum</p>
|
||||
<h2>Projects</h2>
|
||||
{ generateCards("project") }
|
||||
<h2>Diaries</h2>
|
||||
{ generateCards("diary") }
|
||||
</Layout>
|
||||
</>;
|
||||
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user