Fix for preview pages and added notice for no blog present

TK-Entertainment · Oct 28, 2023 · d13faf7 · d13faf7
1 parent 5f13c42
commit d13faf7
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 9 deletions.
diff --git a/app/blog/preview/[slug]/page.tsx b/app/blog/preview/[slug]/page.tsx
@@ -55,7 +55,7 @@ export default async function BlogSlug({
  <MDXContent>
  <div className="grid grid-cols-7">
  <div className="col-span-6 max-xl:col-span-full px-8 md:px-12 md:mt-8 mt-4">
- <div className="flex flex-col p-4 w-full rounded-2xl border bg-orange-200 transition-all hover:drop-shadow-2xl">
+ <div className="flex flex-col p-4 w-full rounded-2xl border bg-orange-200 dark:bg-orange-500 transition-all hover:drop-shadow-2xl">
  <div className="flex flex-row">
  <FontAwesomeIcon
  icon={faWarning}
@@ -72,7 +72,7 @@ export default async function BlogSlug({
  還請您不要將此連結發出去，並點擊左上角的標題回到首頁，謝謝！
  </span>
  </div>
- <div className="flex flex-col mt-2 p-4 w-full rounded-2xl border bg-slate-300 transition-all hover:drop-shadow-2xl">
+ <div className="flex flex-col mt-2 p-4 w-full rounded-2xl border bg-slate-300 dark:bg-slate-600 transition-all hover:drop-shadow-2xl">
  <div className="flex flex-row">
  <FontAwesomeIcon
  icon={faInfoCircle}
@@ -93,7 +93,7 @@ export default async function BlogSlug({
  </span>
  </div>
  <div className="md:py-8 py-4">
- <span className="transition-all text-sm mr-1 rounded-2xl border px-2 bg-red-200 hover:bg-red-500">
+ <span className="transition-all text-sm mr-1 rounded-2xl border px-2 bg-red-200 dark:bg-red-400 hover:bg-red-500">
  {`<!> 預覽 Preview`}
  </span>
  {page.tags?.map((tag, index) => (

diff --git a/app/blog/tags/[slug]/page.tsx b/app/blog/tags/[slug]/page.tsx
@@ -5,7 +5,7 @@ import TagSidebar from "@/components/Navigation/tagsidebar";
 import PostBlock from "@/components/PostLayout/postblock";
 import { allBlogs } from "contentlayer/generated";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faArrowLeft } from "@fortawesome/free-solid-svg-icons";
+import { faArrowLeft, faQuestionCircle } from "@fortawesome/free-solid-svg-icons";
 import Link from "next/link";
 
 export default function TagSlug({ params }: { params: { slug?: string } }) {
@@ -57,11 +57,23 @@ export default function TagSlug({ params }: { params: { slug?: string } }) {
  <p>#{decodedTag}</p>
  </div>
  </Link>
- {postSortedByTags.map((post, index) => (
- <div key={index}>
- <PostBlock page={post} />
- </div>
- ))}
+ {postSortedByTags.length != 0 ? (
+ <>
+ {postSortedByTags.map((post, index) => (
+ <div key={index}>
+ <PostBlock page={post} />
+ </div>
+ ))}
+ </>
+ ) : (
+ <div className="mx-auto">
+ <FontAwesomeIcon icon={faQuestionCircle} className="mr-2" />
+ <span className="text-normal font-bold">
+ 沒有找到任何有 #{decodedTag} 標籤的文章
+ </span>
+ </div>
+ )}
+
  </div>
  </div>
  </>