feat(site/blog): add nextjs-toploader

qhanw · Oct 19, 2023 · 55e0f04 · 55e0f04 · vercel · Oct 19, 2023
1 parent 4af23a6
commit 55e0f04
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 59 deletions.
diff --git a/site/blog/app/posts/[slug]/loading.tsx b/site/blog/app/posts/[slug]/loading.tsx
diff --git a/site/blog/app/posts/layout.tsx b/site/blog/app/posts/layout.tsx
@@ -1,3 +1,4 @@
+import NextTopLoader from "nextjs-toploader";
 import Footer from "@/app/components/Footer";
 export default function PostsLayout({
   children,
@@ -6,6 +7,12 @@ export default function PostsLayout({
 }) {
   return (
     <>
+      <NextTopLoader
+        color="rgba(156,163,175,0.45)"
+        height={2}
+        showSpinner={false}
+        shadow={false}
+      />
       {children}
       <Footer className="prose mx-auto" />
     </>

diff --git a/site/blog/app/posts/loading.tsx b/site/blog/app/posts/loading.tsx
diff --git a/site/blog/package.json b/site/blog/package.json
@@ -15,8 +15,8 @@
     "gray-matter": "^4.0.3",
     "next": "13.5.6",
     "next-mdx-remote": "^4.4.1",
+    "nextjs-toploader": "^1.5.3",
     "react": "18.2.0",
-    "react-content-loader": "^6.2.1",
     "react-dom": "18.2.0",
     "react-use": "^17.4.0",
     "reading-time": "^1.5.0",

diff --git a/site/blog/pnpm-lock.yaml b/site/blog/pnpm-lock.yaml