chore: add heading & handwriting fonts

Signed-off-by: rajput-hemant <[email protected]>

app/layout.tsx

@@ -3,7 +3,7 @@ import "@/app/globals.css";
 import type { Metadata, Viewport } from "next";
 
 import { siteConfig } from "@/config/site";
-import { fontMono, fontSans } from "@/lib/fonts";
+import { fontHandwriting, fontHeading, fontMono, fontSans } from "@/lib/fonts";
 import { absoluteUrl, cn } from "@/lib/utils";
 import { Providers } from "@/components/providers";
 import { TailwindIndicator } from "@/components/tailwind-indicator";
@@ -68,6 +68,8 @@ export default function RootLayout({ children }: React.PropsWithChildren) {
         className={cn(
           fontSans.variable,
           fontMono.variable,
+          fontHeading.variable,
+          fontHandwriting.variable,
           "min-h-screen scroll-smooth font-sans antialiased"
         )}
       >

lib/fonts.ts

@@ -1,4 +1,5 @@
 import { Inter, JetBrains_Mono } from "next/font/google";
+import localFont from "next/font/local";
 
 /* -----------------------------------------------------------------------------------------------
  * Google Fonts
@@ -18,4 +19,14 @@ export const fontMono = JetBrains_Mono({
  * Local Fonts
  * -----------------------------------------------------------------------------------------------*/
 
+export const fontHeading = localFont({
+  src: "../public/fonts/CalSans-SemiBold.woff",
+  variable: "--font-heading",
+});
+
+export const fontHandwriting = localFont({
+  src: "../public/fonts/Virgil.woff2",
+  variable: "--font-handwriting",
+});
+
 // ...

tailwind.config.ts

@@ -60,6 +60,8 @@ const config = {
       fontFamily: {
         sans: ["var(--font-sans)", ...fontFamily.sans],
         mono: ["var(--font-mono)", ...fontFamily.mono],
+        heading: ["var(--font-heading)", ...fontFamily.sans],
+        handwriting: ["var(--font-handwriting)", ...fontFamily.sans],
       },
       keyframes: {
         "accordion-down": {