bugfix - fixed blog fitting

This commit is contained in:
James Wyndham 2024-02-19 17:06:13 +08:00
parent efa8ef40d3
commit b11d5f8d9c
2 changed files with 8 additions and 31 deletions

View File

@ -7,6 +7,8 @@ import xButton from "@/images/icon-x.svg";
import getPostMetadata from "@/utils/getPostMetaData"; import getPostMetadata from "@/utils/getPostMetaData";
import { headers } from "next/headers"; import { headers } from "next/headers";
import React from "react"; import React from "react";
import Icon from "@/components/icon";
import Spacer from "@/components/Utilities/Spacer";
const getPostContent = (slug: string) => { const getPostContent = (slug: string) => {
const folder = "blogs/"; const folder = "blogs/";
@ -47,37 +49,10 @@ const PostPage = (props: any) => {
const post = getPostContent(slug); const post = getPostContent(slug);
const showModal = props.searchParams?.modal; const showModal = props.searchParams?.modal;
return ( return (
<> <div className="flex flex-col h-full w-full bg-white dark:bg-black px-8 md:max-w-3xl md:mx-auto">
{showModal ? ( <Spacer className="pt-32" />
<div className="relative bg-grey-950 w-full h-max z-40 py-24 px-6 flex justify-center pointer-events-none"> <BlogContent post={post} />
<div className="p-8 bg-gray-100 dark:bg-pink-900 w-full max-w-[700px] rounded-xl z-50 relative pointer-events-auto"> </div>
<div className="flex justify-between w-full">
<Link href="/blogs" className="text-primary">
Back to Blogs
</Link>
<div className="flex justify-end pb-2 select-none">
<Link href="/blogs">
<Image
className="rounded-full p-1 hover:bg-gray-500"
src={xButton}
alt="close button"
/>
</Link>
</div>
</div>
<div className="my-6 md:my-12 border-b border-gray-600 pb-2">
<BlogContent post={post} />
</div>
</div>
</div>
) : (
<div className="p-8 bg-grey-950">
<div className="max-w-5xl mx-auto mb-24 h-full w-full py-12 px-8 pt-32">
<BlogContent post={post} />
</div>
</div>
)}
</>
); );
}; };

View File

@ -1,3 +1,5 @@
"use client";
import React from "react"; import React from "react";
import * as FluentIcons from "@fluentui/react-icons"; import * as FluentIcons from "@fluentui/react-icons";
import { IconProps, iconSize } from "./types"; import { IconProps, iconSize } from "./types";