AderKonstantin/aderktech-chronark.com-
1
0
Fork 0
mirror of https://github.com/AderKonstantin/aderktech-chronark.com-.git synced 2025-06-08 13:48:42 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix hydration issue in #4 (#5)

Browse Source 
Co-authored-by: Xuan <liuxuan30@noreply.github.com>
This commit is contained in:
Xuan 2023-04-28 17:15:06 +08:00 committed by GitHub
parent 74ffd5f3d8
commit a54e382283
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 36 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
app/projects/page.tsx
View File

@ -55,47 +55,45 @@ export default async function ProjectsPage() {
<div className="grid grid-cols-1 gap-8 mx-auto lg:grid-cols-2 "> <div className="grid grid-cols-1 gap-8 mx-auto lg:grid-cols-2 ">
<Card> <Card>
<Link href={`/projects/${featured.slug}`}> <article className="relative h-full w-full p-4 md:p-8">
<article className="relative h-full w-full p-4 md:p-8"> <div className="flex justify-between gap-2 items-center">
<div className="flex justify-between gap-2 items-center"> <div className="text-xs text-zinc-100">
<div className="text-xs text-zinc-100"> {featured.date ? (
{featured.date ? ( <time dateTime={new Date(featured.date).toISOString()}>
<time dateTime={new Date(featured.date).toISOString()}> {Intl.DateTimeFormat(undefined, {
{Intl.DateTimeFormat(undefined, { dateStyle: "medium",
dateStyle: "medium", }).format(new Date(featured.date))}
}).format(new Date(featured.date))} </time>
</time> ) : (
) : ( <span>SOON</span>
<span>SOON</span> )}
)}
</div>
<span className="text-zinc-500 text-xs flex items-center gap-1">
<Eye className="w-4 h-4" />{" "}
{Intl.NumberFormat("en-US", { notation: "compact" }).format(
views[featured.slug] ?? 0,
)}
</span>
</div> </div>
<span className="text-zinc-500 text-xs flex items-center gap-1">
<Eye className="w-4 h-4" />{" "}
{Intl.NumberFormat("en-US", { notation: "compact" }).format(
views[featured.slug] ?? 0,
)}
</span>
</div>
<h2 <h2
id="featured-post" id="featured-post"
className="mt-4 text-3xl font-bold text-zinc-100 group-hover:text-white sm:text-4xl font-display" className="mt-4 text-3xl font-bold text-zinc-100 group-hover:text-white sm:text-4xl font-display"
>
{featured.title}
</h2>
<p className="mt-4 leading-8 duration-150 text-zinc-400 group-hover:text-zinc-300">
{featured.description}
</p>
<div className="absolute bottom-4 md:bottom-8">
<Link
className="text-zinc-200 hover:text-zinc-50 hidden lg:block"
href={`/projects/${featured.slug}`}
> >
{featured.title} Read more <span aria-hidden="true">&rarr;</span>
</h2> </Link>
<p className="mt-4 leading-8 duration-150 text-zinc-400 group-hover:text-zinc-300"> </div>
{featured.description} </article>
</p>
<div className="absolute bottom-4 md:bottom-8">
<Link
className="text-zinc-200 hover:text-zinc-50 hidden lg:block"
href={`/projects/${featured.slug}`}
>
Read more <span aria-hidden="true">&rarr;</span>
</Link>
</div>
</article>
</Link>
</Card> </Card>
<div className="flex flex-col w-full gap-8 mx-auto border-t border-gray-900/10 lg:mx-0 lg:border-t-0 "> <div className="flex flex-col w-full gap-8 mx-auto border-t border-gray-900/10 lg:mx-0 lg:border-t-0 ">