feat: replace Google Fonts with local font files

Switch from Google Fonts CDN to self-hosted fonts for better privacy,
faster loading, and offline support. Download and configure local fonts
for Roboto, Inter, Merriweather, Merriweather Sans, and Alexandria.

app/(prizes)/layout.tsx

@@ -3,12 +3,27 @@ import Footer from '@/components/Footer';
 import MobileMenu from '@/components/MobileMenu';
 import Nav from '@/components/Nav';
 import MainProvider from '@/providers/MainProvider';
-import { Roboto } from 'next/font/google';
+import localFont from 'next/font/local';
 import React, { PropsWithChildren } from 'react';
 
-const roboto = Roboto({
-  subsets: ['latin'],
-  weight: ['300', '400', '500', '700'],
+const roboto = localFont({
+  src: [
+    {
+      path: '../../fonts/roboto/Roboto-Light.ttf',
+      weight: '300',
+      style: 'normal',
+    },
+    {
+      path: '../../fonts/roboto/Roboto-Regular.ttf',
+      weight: '400',
+      style: 'normal',
+    },
+    {
+      path: '../../fonts/roboto/Roboto-Bold.ttf',
+      weight: '700',
+      style: 'normal',
+    },
+  ],
   variable: '--font-roboto',
 });
 

app/layout.tsx

@@ -1,37 +1,66 @@
 import localFont from "next/font/local";
 import Script from "next/script";
 
-import { Roboto } from "next/font/google";
-import { Merriweather } from "next/font/google";
-import { Merriweather_Sans } from "next/font/google";
-import { Alexandria } from "next/font/google";
-
 import "swiper/swiper-bundle.css";
 import "./globals.css";
 import QueryProvider from "@/providers/QueryProvider";
-import { HtmlContext } from "next/dist/shared/lib/html-context.shared-runtime";
-// FONTS
+
+// FONTS - All local fonts
 const aeroport = localFont({
   src: "../fonts/Aeroport.otf",
   variable: "--font-aeroport",
 });
-const roboto = Roboto({
-  subsets: ["latin"],
-  weight: ["300", "400", "700"],
+
+const roboto = localFont({
+  src: [
+    {
+      path: "../fonts/roboto/Roboto-Light.ttf",
+      weight: "300",
+      style: "normal",
+    },
+    {
+      path: "../fonts/roboto/Roboto-Regular.ttf",
+      weight: "400",
+      style: "normal",
+    },
+    {
+      path: "../fonts/roboto/Roboto-Bold.ttf",
+      weight: "700",
+      style: "normal",
+    },
+  ],
   variable: "--font-roboto",
 });
-const mw = Merriweather({
-  subsets: ["cyrillic", "cyrillic-ext", "latin", "latin-ext"],
+
+const mw = localFont({
+  src: "../fonts/merriweather/Merriweather-Bold.ttf",
   weight: "700",
   variable: "--font-mw",
 });
-const mw_sans = Merriweather_Sans({
-  subsets: ["cyrillic-ext", "latin", "latin-ext"],
-  weight: ["300", "400", "700"],
+
+const mw_sans = localFont({
+  src: [
+    {
+      path: "../fonts/merriweather-sans/MerriweatherSans-Light.ttf",
+      weight: "300",
+      style: "normal",
+    },
+    {
+      path: "../fonts/merriweather-sans/MerriweatherSans-Regular.ttf",
+      weight: "400",
+      style: "normal",
+    },
+    {
+      path: "../fonts/merriweather-sans/MerriweatherSans-Bold.ttf",
+      weight: "700",
+      style: "normal",
+    },
+  ],
   variable: "--font-mwsans",
 });
-const alexandria = Alexandria({
-  subsets: ["latin", "latin-ext"],
+
+const alexandria = localFont({
+  src: "../fonts/alexandria/Alexandria-Regular.woff2",
   variable: "--font-alexandria",
 });
 

components/dashboard/Dashboard.tsx

@@ -4,7 +4,7 @@ import { useContext, useEffect, useState } from 'react';
 import { FitlerNumber } from '@/components/table/FitlerNumber';
 import { Search } from '@/components/table/Search';
 import { Sort } from '@/components/table/Sort';
-import { Inter } from 'next/font/google';
+import localFont from 'next/font/local';
 import { AuthContext } from '@/context/AuthContext';
 import ProtectedRoute from '@/components/sms/ProtectedRoute';
 import { setDate } from 'date-fns';
@@ -14,11 +14,30 @@ import SmsTable from '@/components/sms/smsTable/SmsTable';
 import Loader from '@/components/Loader';
 import GradientTitle from '@/components/vote/GradientTitle';
 import FilterTable from './FilterTable';
-// import FilterTable from './FilterTable';
 
-const inter = Inter({
-  weight: ['400', '600', '700', '500'],
-  subsets: ['cyrillic', 'latin'],
+const inter = localFont({
+  src: [
+    {
+      path: '../../fonts/inter/Inter-Regular.woff2',
+      weight: '400',
+      style: 'normal',
+    },
+    {
+      path: '../../fonts/inter/Inter-Medium.woff2',
+      weight: '500',
+      style: 'normal',
+    },
+    {
+      path: '../../fonts/inter/Inter-SemiBold.woff2',
+      weight: '600',
+      style: 'normal',
+    },
+    {
+      path: '../../fonts/inter/Inter-Bold.woff2',
+      weight: '700',
+      style: 'normal',
+    },
+  ],
 });
 
 const Dashboard = () => {