mirror of
https://github.com/jakejarvis/jarv.is.git
synced 2026-06-05 19:15:30 -04:00
refactor: replace react-countup with @number-flow/react
This commit is contained in:
+2
-2
@@ -1,4 +1,4 @@
|
||||
import { ArrowUpRight } from "lucide-react";
|
||||
import { IconArrowUpRight } from "@tabler/icons-react";
|
||||
import Image, { type StaticImageData } from "next/image";
|
||||
import Link from "next/link";
|
||||
|
||||
@@ -97,7 +97,7 @@ const Page = () => (
|
||||
</div>
|
||||
<span className="text-muted-foreground ml-9 text-xs text-pretty sm:ml-auto">
|
||||
{project.tagline}
|
||||
<ArrowUpRight
|
||||
<IconArrowUpRight
|
||||
className="group-hover:text-primary ml-1 inline size-3.5 shrink-0 transition-transform group-hover:translate-x-0.5 group-hover:-translate-y-0.5"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
|
||||
+10
-16
@@ -1,10 +1,4 @@
|
||||
import {
|
||||
CalendarDaysIcon,
|
||||
EyeIcon,
|
||||
MessagesSquareIcon,
|
||||
SquarePenIcon,
|
||||
TagIcon,
|
||||
} from "lucide-react";
|
||||
import { IconCalendarEvent, IconEdit, IconEye, IconMessages, IconTag } from "@tabler/icons-react";
|
||||
import type { Metadata } from "next";
|
||||
import Link from "next/link";
|
||||
import { notFound } from "next/navigation";
|
||||
@@ -110,14 +104,14 @@ const Page = async ({ params }: { params: Promise<{ slug: string }> }) => {
|
||||
}}
|
||||
/>
|
||||
|
||||
<div className="text-foreground/70 flex flex-wrap justify-items-start space-y-2.5 space-x-4 text-[13px] tracking-wide">
|
||||
<div className="text-foreground/70 flex flex-wrap items-center gap-x-4 gap-y-2.5 text-[13px] tracking-wide">
|
||||
<Link
|
||||
href={`/${POSTS_DIR}/${frontmatter?.slug}`}
|
||||
className={
|
||||
"text-foreground/70 flex flex-nowrap items-center gap-1.5 whitespace-nowrap hover:no-underline"
|
||||
"flex flex-nowrap items-center gap-1.5 whitespace-nowrap text-inherit hover:no-underline"
|
||||
}
|
||||
>
|
||||
<CalendarDaysIcon className="inline size-3 shrink-0" aria-hidden="true" />
|
||||
<IconCalendarEvent className="inline size-3.5 shrink-0" aria-hidden="true" />
|
||||
<time
|
||||
dateTime={formattedDates.dateISO}
|
||||
title={formattedDates.dateTitle}
|
||||
@@ -129,7 +123,7 @@ const Page = async ({ params }: { params: Promise<{ slug: string }> }) => {
|
||||
|
||||
{frontmatter?.tags && (
|
||||
<div className="flex flex-wrap items-center gap-1.5">
|
||||
<TagIcon className="inline size-3 shrink-0" aria-hidden="true" />
|
||||
<IconTag className="inline size-3.5 shrink-0" aria-hidden="true" />
|
||||
{frontmatter?.tags.map((tag) => (
|
||||
<span
|
||||
key={tag}
|
||||
@@ -146,23 +140,23 @@ const Page = async ({ params }: { params: Promise<{ slug: string }> }) => {
|
||||
href={`https://github.com/${process.env.NEXT_PUBLIC_GITHUB_REPO}/blob/main/${POSTS_DIR}/${frontmatter?.slug}/index.mdx`}
|
||||
title={`Edit "${frontmatter?.title}" on GitHub`}
|
||||
className={
|
||||
"text-foreground/70 flex flex-nowrap items-center gap-1.5 whitespace-nowrap hover:no-underline"
|
||||
"flex flex-nowrap items-center gap-1.5 whitespace-nowrap text-inherit hover:no-underline"
|
||||
}
|
||||
>
|
||||
<SquarePenIcon className="inline size-3 shrink-0" aria-hidden="true" />
|
||||
<IconEdit className="inline size-3.5 shrink-0" aria-hidden="true" />
|
||||
<span>Improve This Post</span>
|
||||
</Link>
|
||||
|
||||
<Link
|
||||
href={`/${POSTS_DIR}/${frontmatter?.slug}#comments`}
|
||||
className="text-foreground/70 flex flex-nowrap items-center gap-1.5 whitespace-nowrap hover:no-underline"
|
||||
className="flex flex-nowrap items-center gap-1.5 whitespace-nowrap text-inherit hover:no-underline"
|
||||
>
|
||||
<MessagesSquareIcon className="inline size-3 shrink-0" aria-hidden="true" />
|
||||
<IconMessages className="inline size-3.5 shrink-0" aria-hidden="true" />
|
||||
<CommentCount slug={`${POSTS_DIR}/${frontmatter?.slug}`} />
|
||||
</Link>
|
||||
|
||||
<div className="flex min-w-14 flex-nowrap items-center gap-1.5 whitespace-nowrap">
|
||||
<EyeIcon className="inline size-3 shrink-0" aria-hidden="true" />
|
||||
<IconEye className="inline size-3.5 shrink-0" aria-hidden="true" />
|
||||
<ViewCounter slug={`${POSTS_DIR}/${frontmatter?.slug}`} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { ExternalLinkIcon, GitForkIcon, StarIcon } from "lucide-react";
|
||||
import { IconExternalLink, IconGitFork, IconStar } from "@tabler/icons-react";
|
||||
import { notFound } from "next/navigation";
|
||||
import { Suspense } from "react";
|
||||
|
||||
@@ -113,7 +113,7 @@ const Page = async () => {
|
||||
rel="noopener noreferrer"
|
||||
className="text-muted-foreground hover:text-primary inline-flex flex-nowrap items-center gap-1.5 hover:no-underline"
|
||||
>
|
||||
<StarIcon className="inline-block size-3.5 shrink-0" aria-hidden="true" />
|
||||
<IconStar className="inline-block size-3.5 shrink-0" aria-hidden="true" />
|
||||
<span>
|
||||
{Intl.NumberFormat(process.env.NEXT_PUBLIC_SITE_LOCALE).format(
|
||||
repo?.stargazerCount,
|
||||
@@ -130,7 +130,7 @@ const Page = async () => {
|
||||
title={`${Intl.NumberFormat(process.env.NEXT_PUBLIC_SITE_LOCALE).format(repo?.forkCount)} ${repo?.forkCount === 1 ? "fork" : "forks"}`}
|
||||
className="text-muted-foreground hover:text-primary inline-flex flex-nowrap items-center gap-1.5 hover:no-underline"
|
||||
>
|
||||
<GitForkIcon className="inline-block size-3.5 shrink-0" aria-hidden="true" />
|
||||
<IconGitFork className="inline-block size-3.5 shrink-0" aria-hidden="true" />
|
||||
<span>
|
||||
{Intl.NumberFormat(process.env.NEXT_PUBLIC_SITE_LOCALE).format(
|
||||
repo?.forkCount,
|
||||
@@ -169,7 +169,7 @@ const Page = async () => {
|
||||
}
|
||||
>
|
||||
View all
|
||||
<ExternalLinkIcon className="inline-block size-3.5 shrink-0" aria-hidden="true" />
|
||||
<IconExternalLink className="inline-block size-3.5 shrink-0" aria-hidden="true" />
|
||||
</Button>
|
||||
</p>
|
||||
</FadeTransition>
|
||||
|
||||
Reference in New Issue
Block a user