mirror of
https://github.com/DefectingCat/DefectingCat.github.io
synced 2025-07-15 16:51:37 +00:00
Add footer
* modify mdx layout
This commit is contained in:
18
components/Footer.tsx
Normal file
18
components/Footer.tsx
Normal file
@ -0,0 +1,18 @@
|
||||
import { FC } from 'react';
|
||||
|
||||
const nowDay = new Date().getFullYear();
|
||||
|
||||
const Footer: FC = () => {
|
||||
return (
|
||||
<>
|
||||
<footer className="px-10">
|
||||
<div className="h-[2px] bg-slate-500"></div>
|
||||
<div className="py-4">
|
||||
© 2022-{nowDay} Powered by Next.js 💙 xfy
|
||||
</div>
|
||||
</footer>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default Footer;
|
@ -1,12 +1,19 @@
|
||||
import { FC } from 'react';
|
||||
import MainLayout from 'layouts/MainLayout';
|
||||
import dynamic from 'next/dynamic';
|
||||
|
||||
const MDXLayout: FC = ({ children }) => {
|
||||
const Footer = dynamic(() => import('components/Footer'));
|
||||
const HeadBar = dynamic(() => import('components/NavBar'));
|
||||
|
||||
const MainLayout: FC = ({ children }) => {
|
||||
return (
|
||||
<>
|
||||
<MainLayout>{children}</MainLayout>
|
||||
<HeadBar />
|
||||
|
||||
<main id="article">{children}</main>
|
||||
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default MDXLayout;
|
||||
export default MainLayout;
|
||||
|
@ -1,5 +1,8 @@
|
||||
import { FC } from 'react';
|
||||
import HeadBar from 'components/NavBar';
|
||||
import dynamic from 'next/dynamic';
|
||||
|
||||
const Footer = dynamic(() => import('components/Footer'));
|
||||
const HeadBar = dynamic(() => import('components/NavBar'));
|
||||
|
||||
const MainLayout: FC = ({ children }) => {
|
||||
return (
|
||||
@ -7,6 +10,8 @@ const MainLayout: FC = ({ children }) => {
|
||||
<HeadBar />
|
||||
|
||||
<main>{children}</main>
|
||||
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
@ -4,13 +4,15 @@ import type { NextPageWithLayout } from 'types';
|
||||
|
||||
const Home: NextPageWithLayout = () => {
|
||||
return (
|
||||
<div className="text-lg text-red-700">
|
||||
<>
|
||||
<Head>
|
||||
<title>RUA - HOME</title>
|
||||
</Head>
|
||||
|
||||
<div>hi</div>
|
||||
</div>
|
||||
<main className="h-[calc(100vh-142px)] flex justify-center items-center text-xl">
|
||||
<div>Hi there,👋 Im a next.js app.</div>
|
||||
</main>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -6,6 +6,8 @@ tags: ['functions', 'JavaScript']
|
||||
|
||||
import Layout from 'layouts/MDXLayout.tsx';
|
||||
|
||||
# Hello world
|
||||
|
||||
## Hello
|
||||
|
||||
This is my first post.
|
||||
|
Reference in New Issue
Block a user