feat: ✨ add mali font

soyricardodev · Apr 24, 2024 · 9422899 · 9422899
1 parent 3f63b00
commit 9422899
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 15 deletions.
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -9,6 +9,8 @@ import { cn } from "~/lib/utils";
 import { CSPostHogProvider } from "./_analytics/provider";
 import { SideNav } from "./_components/side-nav";
 import { ourFileRouter } from "./api/uploadthing/core";
+import { FloatingNav } from "./_components/floating-nav";
+import { Mali } from "next/font/google";
 
 export const metadata = {
 	title: "PENIN - Pensamientos Intrusivos",
@@ -17,6 +19,13 @@ export const metadata = {
 	icons: [{ rel: "icon", url: "/favicon.ico" }],
 };
 
+const fontSans = Mali({
+	subsets: ["latin"],
+	weight: ["400", "500", "600", "700"],
+	display: "swap",
+	variable: "--font-mali",
+});
+
 export default function RootLayout({
 	children,
 }: {
@@ -29,17 +38,19 @@ export default function RootLayout({
 				<html lang="es">
 					<NextSSRPlugin routerConfig={extractRouterConfig(ourFileRouter)} />
 					<body
-						className={cn("font-sans bg-background", GeistSans.variable)}
+						className={cn("font-sans", GeistSans.variable, fontSans.variable)}
 						style={{ scrollbarColor: "rgb(185, 202, 211) rgb(247, 249, 249)" }}
 					>
+						<div className="absolute inset-0 -z-10 h-full w-full bg-white bg-[linear-gradient(to_right,#8080800a_1px,transparent_1px),linear-gradient(to_bottom,#8080800a_1px,transparent_1px)] bg-[size:14px_24px]">
+							<div className="absolute left-0 right-0 top-0 -z-10 m-auto h-[310px] w-[310px] rounded-full bg-green-400 opacity-20 blur-[100px]" />
+						</div>
 						<div className="css-175 pointer-events-none [flex:1_1_0%]">
-							<div className="css-175 pointer-events-none [flex:1_1_0%]">
-								<div className="css-175 pointer-events-auto z-0 min-h-dvh w-full flex-row">
-									<SideNav />
-									<main className="css-175 w-full shrink grow items-start overflow-y-scroll">
-										{children}
-									</main>
-								</div>
+							<div className="css-175 pointer-events-auto z-0 min-h-dvh w-full flex-row">
+								<SideNav />
+								<FloatingNav />
+								<main className="css-175 w-full shrink grow items-start overflow-y-scroll">
+									{children}
+								</main>
 							</div>
 						</div>
 						<TailwindIndicator />

diff --git a/tailwind.config.ts b/tailwind.config.ts
@@ -3,12 +3,7 @@ import { withUt } from "uploadthing/tw";
 
 const config = withUt({
   darkMode: ["class"],
-  content: [
-    "./pages/**/*.{ts,tsx}",
-    "./components/**/*.{ts,tsx}",
-    "./app/**/*.{ts,tsx}",
-    "./src/**/*.{ts,tsx}",
-  ],
+  content: ["./src/**/*.{ts,tsx}"],
   prefix: "",
   theme: {
     container: {
@@ -74,7 +69,8 @@ const config = withUt({
         "accordion-up": "accordion-up 0.2s ease-out",
       },
       fontFamily: {
-        sans: ["var(--font-geist-sans)"],
+        geist: ["var(--font-geist-sans)"],
+        sans: ["var(--font-mali)"],
       },
     },
   },