feat(stats-web): ✨ added geist font + update nextjs (#165)

akash-network · Apr 25, 2024 · 8bbd191 · 8bbd191
1 parent 9fa4bd5
commit 8bbd191
Show file tree

Hide file tree

Showing 13 changed files with 88 additions and 99 deletions.
diff --git a/api/.env.functional.test b/api/.env.functional.test
diff --git a/stats-web/package-lock.json b/stats-web/package-lock.json
diff --git a/stats-web/package.json b/stats-web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "stats-web",
-  "version": "0.19.2",
+  "version": "0.19.3",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -33,10 +33,11 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
     "cmdk": "^0.2.0",
+    "geist": "^1.3.0",
     "iconoir-react": "^7.3.0",
     "jotai": "^2.5.1",
     "lucide-react": "^0.292.0",
-    "next": "^14.1.0",
+    "next": "^14.2.2",
     "next-nprogress-bar": "^2.1.2",
     "next-qrcode": "^2.5.1",
     "next-themes": "^0.2.1",

diff --git a/stats-web/src/app/graph/[snapshot]/GraphContainer.tsx b/stats-web/src/app/graph/[snapshot]/GraphContainer.tsx
@@ -73,12 +73,12 @@ export default function GraphContainer({ snapshot }: IGraphProps) {
         <>
           <div className="mb-4 flex flex-col flex-wrap items-center justify-between sm:flex-row sm:flex-nowrap">
             <div className="mb-4 basis-full sm:mb-0 sm:basis-0">
-              <h3 className="flex items-center text-4xl font-bold sm:justify-center">
+              <h3 className="flex items-center text-4xl font-bold tracking-tight sm:justify-center">
                 <FormattedNumber value={metric.modifiedValue || metric.value} maximumFractionDigits={2} notation="compact" compactDisplay="short" />
                 &nbsp;{metric.unit ? `${metric.unit} ` : ""}
                 <DiffPercentageChip value={percIncrease(snapshotData.compareValue, snapshotData.currentValue)} size="medium" className="ml-2" />
                 &nbsp;
-                <DiffNumber value={metricDiff.modifiedValue || metricDiff.value} unit={metricDiff.unit} className="text-sm font-light whitespace-nowrap" />
+                <DiffNumber value={metricDiff.modifiedValue || metricDiff.value} unit={metricDiff.unit} className="whitespace-nowrap text-sm font-light" />
               </h3>
             </div>
 

diff --git a/stats-web/src/app/graph/[snapshot]/page.tsx b/stats-web/src/app/graph/[snapshot]/page.tsx
@@ -39,7 +39,7 @@ export default function GraphPage({ params: { snapshot: snapshotUrlParam } }: IG
         </div>
 
         <div className="mb-2">
-          <h1 className="text-center text-3xl font-normal sm:text-left">{title}</h1>
+          <h1 className="text-center text-3xl font-normal tracking-tight sm:text-left">{title}</h1>
         </div>
 
         <GraphContainer snapshot={snapshot} />

diff --git a/stats-web/src/app/layout.tsx b/stats-web/src/app/layout.tsx
@@ -1,5 +1,4 @@
 import type { Metadata, Viewport } from "next";
-import { Inter } from "next/font/google";
 import "./globals.css";
 import { cn } from "@/lib/utils";
 import { Nav } from "@/components/layout/Nav";
@@ -8,38 +7,12 @@ import { Toaster } from "@/components/ui/toaster";
 import { cookies } from "next/headers";
 import { customColors } from "@/lib/colors";
 import GoogleAnalytics from "@/components/layout/CustomGoogleAnalytics";
-import localFont from "next/font/local";
 import { Footer } from "@/components/layout/Footer";
 import getConfig from "next/config";
+import { GeistSans } from "geist/font/sans";
 
 const { publicRuntimeConfig } = getConfig();
 
-// const inter = Inter({
-//   subsets: ["latin"],
-//   variable: "--font-sans"
-// });
-
-const satoshi = localFont({
-  src: [
-    {
-      path: "./fonts/Satoshi-Variable.woff",
-      weight: "400",
-      style: "normal"
-    },
-    {
-      path: "./fonts/Satoshi-Variable.woff2",
-      weight: "400",
-      style: "normal"
-    },
-    {
-      path: "./fonts/Satoshi-Variable.ttf",
-      weight: "400",
-      style: "normal"
-    }
-  ]
-  // variable: "--font-sans"
-});
-
 export const metadata: Metadata = {
   title: "Akash Network Stats",
   description: "Akash Network Stats",
@@ -123,7 +96,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
     <html lang="en" className={theme} style={{ colorScheme: theme }} suppressHydrationWarning>
       <GoogleAnalytics />
 
-      <body className={cn("min-h-screen bg-background tracking-wide antialiased", satoshi.className)}>
+      <body className={cn("min-h-screen bg-background tracking-wide antialiased font-sans", GeistSans.variable)}>
         <Providers>
           <Nav />
           <div className="flex min-h-[calc(100vh-60px)] flex-col justify-between">

diff --git a/stats-web/src/app/not-found.tsx b/stats-web/src/app/not-found.tsx
@@ -1,9 +1,7 @@
 import Link from "next/link";
 import PageContainer from "@/components/PageContainer";
 import { Title } from "@/components/Title";
-import { buttonVariants } from "@/components/ui/button";
 import { UrlService } from "@/lib/urlUtils";
-import { cn } from "@/lib/utils";
 import { ArrowLeft } from "iconoir-react";
 import { Metadata } from "next";
 
@@ -16,11 +14,11 @@ export default function FourOhFour({}: React.PropsWithChildren<{}>) {
     <PageContainer>
       <div className="mt-10 text-center">
         <Title className="mb-2">404</Title>
-        <h3 className="text-2xl">Page not found.</h3>
+        <h3 className="text-xl">Page not found.</h3>
 
-        <div className="pt-6">
-          <Link href={UrlService.home()} className={cn(buttonVariants({ variant: "default" }), "inline-flex items-center")}>
-            <ArrowLeft className="mr-4" />
+        <div className="pt-8">
+          <Link href={UrlService.home()} className="inline-flex items-center text-2xl">
+            <ArrowLeft className="mr-4 text-lg" />
             Go to homepage
           </Link>
         </div>

diff --git a/stats-web/src/app/provider-graph/[snapshot]/GraphContainer.tsx b/stats-web/src/app/provider-graph/[snapshot]/GraphContainer.tsx
@@ -73,7 +73,7 @@ export default function GraphContainer({ snapshot }: IGraphProps) {
         <>
           <div className="mb-4 flex flex-col flex-wrap items-center justify-between sm:flex-row sm:flex-nowrap">
             <div className="mb-4 basis-full sm:mb-0 sm:basis-0">
-              <h3 className="flex items-center text-4xl font-bold sm:justify-center">
+              <h3 className="flex items-center text-4xl font-bold tracking-tight sm:justify-center">
                 <FormattedNumber value={metric.modifiedValue || metric.value} maximumFractionDigits={2} notation="compact" compactDisplay="short" />
                 &nbsp;{metric.unit ? `${metric.unit} ` : ""}
                 <DiffPercentageChip value={percIncrease(snapshotData.compareValue, snapshotData.currentValue)} size="medium" className="ml-2" />

diff --git a/stats-web/src/app/provider-graph/[snapshot]/page.tsx b/stats-web/src/app/provider-graph/[snapshot]/page.tsx
@@ -39,7 +39,7 @@ export default function ProviderGraphPage({ params: { snapshot: snapshotUrlParam
         </div>
 
         <div className="mb-2">
-          <h1 className="text-center text-3xl font-normal sm:text-left">{title}</h1>
+          <h1 className="text-center text-3xl font-normal tracking-tight sm:text-left">{title}</h1>
         </div>
 
         <GraphContainer snapshot={snapshot} />