feat: wire header, footer, and scroll effects into layout
This commit is contained in:
@@ -4,7 +4,9 @@ import { ThemeProvider } from '@wrksz/themes/next'
|
|||||||
import { Providers } from './providers'
|
import { Providers } from './providers'
|
||||||
import './globals.css'
|
import './globals.css'
|
||||||
import 'katex/dist/katex.min.css'
|
import 'katex/dist/katex.min.css'
|
||||||
import { useMDXComponents } from '@/mdx-components'
|
import { Header } from '@/components/layout/Header'
|
||||||
|
import { Footer } from '@/components/layout/Footer'
|
||||||
|
import { ScrollProgress } from '@/components/ui/ScrollProgress'
|
||||||
|
|
||||||
const inter = Inter({
|
const inter = Inter({
|
||||||
subsets: ['latin'],
|
subsets: ['latin'],
|
||||||
@@ -40,7 +42,10 @@ export default function RootLayout({ children }: { children: React.ReactNode })
|
|||||||
enableSystem
|
enableSystem
|
||||||
disableTransitionOnChange
|
disableTransitionOnChange
|
||||||
>
|
>
|
||||||
<Providers>{children}</Providers>
|
<ScrollProgress />
|
||||||
|
<Header />
|
||||||
|
{children}
|
||||||
|
<Footer />
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -2,6 +2,8 @@ import { notFound } from 'next/navigation'
|
|||||||
import { MDXRemote } from 'next-mdx-remote/rsc'
|
import { MDXRemote } from 'next-mdx-remote/rsc'
|
||||||
import { getPosts, getPost, getReadingTime } from '@/lib/posts'
|
import { getPosts, getPost, getReadingTime } from '@/lib/posts'
|
||||||
import { TableOfContents } from '@/components/blog/TableOfContents'
|
import { TableOfContents } from '@/components/blog/TableOfContents'
|
||||||
|
import { ScrollToTop } from '@/components/ui/ScrollToTop'
|
||||||
|
import { ReadingProgress } from '@/components/ui/ReadingProgress'
|
||||||
|
|
||||||
export async function generateStaticParams() {
|
export async function generateStaticParams() {
|
||||||
const posts = await getPosts()
|
const posts = await getPosts()
|
||||||
@@ -25,6 +27,9 @@ export default async function PostPage({ params }: { params: Promise<{ slug: str
|
|||||||
if (!post) notFound()
|
if (!post) notFound()
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
|
<ScrollToTop />
|
||||||
|
<ReadingProgress />
|
||||||
<div className="max-w-4xl mx-auto px-6 py-16">
|
<div className="max-w-4xl mx-auto px-6 py-16">
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-[1fr_200px] gap-8">
|
<div className="grid grid-cols-1 lg:grid-cols-[1fr_200px] gap-8">
|
||||||
<article>
|
<article>
|
||||||
@@ -46,5 +51,6 @@ export default async function PostPage({ params }: { params: Promise<{ slug: str
|
|||||||
</aside>
|
</aside>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { motion } from "motion/react";
|
import { motion } from "motion/react";
|
||||||
import type { PostMeta } from "@/lib/posts";
|
import type { PostMeta } from "@/lib/posts";
|
||||||
|
|||||||
Reference in New Issue
Block a user