From 3823cc14d91e475b0cd0586ffb8469dcb62cfd06 Mon Sep 17 00:00:00 2001 From: MeowcaTheoRange Date: Wed, 3 Apr 2024 11:32:44 -0500 Subject: [PATCH] Optimizations, characters in Gallery, etc. --- src/app/(slug)/blog/page.tsx | 5 +- src/app/(slug)/characters/[slug]/page.tsx | 2 +- src/app/(slug)/characters/page.tsx | 7 ++- src/app/(slug)/characters/style.module.css | 3 ++ src/app/(slug)/gallery/[slug]/page.tsx | 46 +++++++++++++++++++ src/app/(slug)/gallery/page.tsx | 7 ++- src/app/(slug)/gallery/style.module.css | 3 ++ src/app/(slug)/stories/page.tsx | 5 +- src/layout/MainLayout/MainLayout.module.css | 1 + src/layout/MainLayout/MainLayout.tsx | 4 +- .../MainLayout/Sidebar/Main/Main.module.css | 6 ++- src/layout/MainLayout/Sidebar/Main/Main.tsx | 36 +++++++-------- src/styles/style.css | 12 +++-- 13 files changed, 97 insertions(+), 40 deletions(-) diff --git a/src/app/(slug)/blog/page.tsx b/src/app/(slug)/blog/page.tsx index 79a95c5..75526ad 100644 --- a/src/app/(slug)/blog/page.tsx +++ b/src/app/(slug)/blog/page.tsx @@ -41,15 +41,14 @@ export default async function Home({ ))} -

+

1}> Previous - {" "} Next -

+
) } diff --git a/src/app/(slug)/characters/[slug]/page.tsx b/src/app/(slug)/characters/[slug]/page.tsx index a531e72..2fe08e7 100644 --- a/src/app/(slug)/characters/[slug]/page.tsx +++ b/src/app/(slug)/characters/[slug]/page.tsx @@ -78,7 +78,7 @@ export default async function Home({ return (

{img.title}

{new Date(img.created).toLocaleDateString()}

diff --git a/src/app/(slug)/characters/page.tsx b/src/app/(slug)/characters/page.tsx index b5e1309..912677e 100644 --- a/src/app/(slug)/characters/page.tsx +++ b/src/app/(slug)/characters/page.tsx @@ -41,7 +41,7 @@ export default async function Home({ return (

{character.name}

{character.pronouns}

@@ -50,15 +50,14 @@ export default async function Home({ ); })}
-

+

1}> Previous - {" "} Next -

+
) } \ No newline at end of file diff --git a/src/app/(slug)/characters/style.module.css b/src/app/(slug)/characters/style.module.css index ab7940b..13b01d5 100644 --- a/src/app/(slug)/characters/style.module.css +++ b/src/app/(slug)/characters/style.module.css @@ -11,6 +11,9 @@ } .CharacterContainer { + display: flex; + flex-direction: column; + justify-content: flex-end; aspect-ratio: 1/1; overflow: hidden; padding: 16px; diff --git a/src/app/(slug)/gallery/[slug]/page.tsx b/src/app/(slug)/gallery/[slug]/page.tsx index 9657b97..6f8b333 100644 --- a/src/app/(slug)/gallery/[slug]/page.tsx +++ b/src/app/(slug)/gallery/[slug]/page.tsx @@ -2,6 +2,9 @@ import { MainLayout } from "@/layout/MainLayout/MainLayout"; import { notFound } from "next/navigation"; import Markdown from "react-markdown"; import rehypeRaw from "rehype-raw"; +import styles from "../style.module.css"; +import Link from "next/link"; +import { ConditionalNull } from "@/components/utility/Conditional"; export default async function Home({ params @@ -13,6 +16,32 @@ export default async function Home({ const blog = await fetch(`https://img.abtmtr.link/api/collections/mtr/posts/${params.slug}`, { cache: 'no-store' }).then(x=>x.json()); if (blog.data == null) return notFound(); + + let allCharacters:{ + id: string, + name: string, + description?: string[], + picture: string, + gender: string, + pronunciation: string, + pronouns: string, + spec?: string, + species: string, + age: number, + height: number, + relationships: { + id: string, + status: string, + }[] + }[] = []; + + await (blog.data.tags.reduce(async (p:Promise, tag:string) => { + const tagCharacter = await fetch(`https://blog.abtmtr.link/api/collections/characters/posts/${tag}`, { next: { revalidate: 1800 } }).then(x=>x.json()); + if (tagCharacter.data == null) return; + + allCharacters.push(JSON.parse(tagCharacter.data.body.replace(/[“”]/g, "\""))); + }, Promise.resolve())); + return (

{blog.data.title}

@@ -22,6 +51,23 @@ export default async function Home({ }}> {blog.data.body}
+ = 1}>

Characters

 +
+ {allCharacters.map(async (character) => { + const charblogs = await fetch(`https://img.abtmtr.link/api/collections/mtr/posts/${character.picture}`).then(x=>x.json()); + console.log(charblogs?.data?.images?.[0]); + return ( + +
+

{character.name}

+

{character.pronouns}

+
+ + ); + })} +
) } diff --git a/src/app/(slug)/gallery/page.tsx b/src/app/(slug)/gallery/page.tsx index 8ece2f4..8d28ce3 100644 --- a/src/app/(slug)/gallery/page.tsx +++ b/src/app/(slug)/gallery/page.tsx @@ -31,7 +31,7 @@ export default async function Home({ }) => (

{post.title}

Posted {new Date(post.created).toLocaleDateString()}

@@ -39,15 +39,14 @@ export default async function Home({ ))}
-

+

1}> Previous - {" "} Next -

+
) } diff --git a/src/app/(slug)/gallery/style.module.css b/src/app/(slug)/gallery/style.module.css index 86c956d..028e2c4 100644 --- a/src/app/(slug)/gallery/style.module.css +++ b/src/app/(slug)/gallery/style.module.css @@ -11,6 +11,9 @@ } .ImageContainer { + display: flex; + flex-direction: column; + justify-content: flex-end; aspect-ratio: 1/1; overflow: hidden; padding: 16px; diff --git a/src/app/(slug)/stories/page.tsx b/src/app/(slug)/stories/page.tsx index 6b1ee9d..2eaa26b 100644 --- a/src/app/(slug)/stories/page.tsx +++ b/src/app/(slug)/stories/page.tsx @@ -39,15 +39,14 @@ export default async function Home({ ))} -

+

1}> Previous - {" "} Next -

+
) } diff --git a/src/layout/MainLayout/MainLayout.module.css b/src/layout/MainLayout/MainLayout.module.css index 603163b..8d12d08 100644 --- a/src/layout/MainLayout/MainLayout.module.css +++ b/src/layout/MainLayout/MainLayout.module.css @@ -56,6 +56,7 @@ border-right: 1px solid var(--neutral); } +.MainLayout_Aside.Modifier_Open {} .MainLayout_Inner { max-width: 100%; max-height: 100%; diff --git a/src/layout/MainLayout/MainLayout.tsx b/src/layout/MainLayout/MainLayout.tsx index 8710773..b5db99f 100644 --- a/src/layout/MainLayout/MainLayout.tsx +++ b/src/layout/MainLayout/MainLayout.tsx @@ -16,7 +16,5 @@ export function MainLayout({ sidebar?: React.ReactNode, currentPage: string }) { - return (<> - {children} - ) + return {children} } \ No newline at end of file diff --git a/src/layout/MainLayout/Sidebar/Main/Main.module.css b/src/layout/MainLayout/Sidebar/Main/Main.module.css index fb7670e..31cc5f0 100644 --- a/src/layout/MainLayout/Sidebar/Main/Main.module.css +++ b/src/layout/MainLayout/Sidebar/Main/Main.module.css @@ -13,7 +13,11 @@ gap: 8px; } -.Main_List_CurrentLink button { +.Main_List>a { + text-decoration: none; +} + +.Main_List_CurrentLink>div { background-color: var(--bg-2); } diff --git a/src/layout/MainLayout/Sidebar/Main/Main.tsx b/src/layout/MainLayout/Sidebar/Main/Main.tsx index 188f625..518df6d 100644 --- a/src/layout/MainLayout/Sidebar/Main/Main.tsx +++ b/src/layout/MainLayout/Sidebar/Main/Main.tsx @@ -9,58 +9,58 @@ export function SidebarMain({currentPage}:{currentPage:string}) { */}
- +
- + - + - + - + - + - + - + - + diff --git a/src/styles/style.css b/src/styles/style.css index 3ec60f5..093ef6f 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -78,7 +78,7 @@ button:hover { opacity: 0.75; } -button.fw { +div.fw { padding: 8px; width: 100%; border-radius: 4px; @@ -86,11 +86,11 @@ button.fw { text-decoration: none; } -button.fw a { +div.fw a { text-decoration: none; } -button.fw:hover { +div.fw:hover { background-color: var(--bg-2); opacity: 1; } @@ -101,4 +101,10 @@ img.headerImage { aspect-ratio: 768/300; image-rendering: crisp-edges; background-color: var(--bg-1); +} +.navigation { + margin: 16px 0; + display: flex; + justify-content: center; + gap: 16px; } \ No newline at end of file