parsa/parsaaghayi-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: self-host Google Fonts (Inter, JetBrains Mono) via localFont; fix tailwind border-border color

Browse Source
This commit is contained in:
DevOps 2026-06-28 17:15:13 +00:00
parent adda6ae880
commit be6e37b11f
4 changed files with 72 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/app/layout.tsx
View File

@ -1,23 +1,24 @@
import localFont from "next/font/local"; import localFont from 'next/font/local';
import { Inter, JetBrains_Mono } from "next/font/google"; import './globals.css';
import "./globals.css"; import { getDefaultLocale } from './lib/functions/utils';
import { getDefaultLocale } from "./lib/functions/utils"; import { ThemeProvider } from './lib/providers/theme-provider';
import { ThemeProvider } from "./lib/providers/theme-provider";
const mikhak = localFont({ const mikhak = localFont({
src: "lib/fonts/mikhak-v32/variable/Mikhak[DSTY,KSHD,wght].woff2", src: 'lib/fonts/mikhak-v32/variable/Mikhak[DSTY,KSHD,wght].woff2',
variable: "--font-mikhak", variable: '--font-mikhak',
weight: "100 900", weight: '100 900',
}); });
const inter = Inter({ const inter = localFont({
subsets: ["latin"], src: 'lib/fonts/inter/variable/Inter-Variable.woff2',
variable: "--font-inter", variable: '--font-inter',
weight: '100 900',
}); });
const jetbrainsMono = JetBrains_Mono({ const jetbrainsMono = localFont({
subsets: ["latin"], src: 'lib/fonts/jetbrains-mono/variable/JetBrainsMono-Variable.woff2',
variable: "--font-jetbrains-mono", variable: '--font-jetbrains-mono',
weight: '100 800',
}); });
export default async function RootLayout({ export default async function RootLayout({
@ -28,18 +29,18 @@ export default async function RootLayout({
const defaultLocale = await getDefaultLocale(); const defaultLocale = await getDefaultLocale();
return ( return (
<html lang={defaultLocale} dir={defaultLocale === "fa" ? "rtl" : "ltr"} suppressHydrationWarning> <html lang={defaultLocale} dir={defaultLocale === 'fa' ? 'rtl' : 'ltr'} suppressHydrationWarning>
<body <body
suppressHydrationWarning={true} suppressHydrationWarning={true}
className={`${mikhak.variable} ${inter.variable} ${jetbrainsMono.variable} relative flex h-full w-full flex-col items-center justify-between antialiased`} className={${mikhak.variable} relative flex h-full w-full flex-col items-center justify-between antialiased}
> >
<ThemeProvider <ThemeProvider
attribute="class" attribute='class'
defaultTheme="dark" defaultTheme='dark'
enableSystem enableSystem
disableTransitionOnChange disableTransitionOnChange
> >
<div className="main flex h-full w-full flex-wrap justify-center"> <div className='main flex h-full w-full flex-wrap justify-center'>
{children} {children}
</div> </div>
</ThemeProvider> </ThemeProvider>

BIN
src/app/lib/fonts/inter/variable/Inter-Variable.woff2 Normal file
View File

Binary file not shown.

BIN
src/app/lib/fonts/jetbrains-mono/variable/JetBrainsMono-Variable.woff2 Normal file
View File

Binary file not shown.

73
tailwind.config.ts
View File

@ -1,35 +1,66 @@
import type { Config } from "tailwindcss"; import type { Config } from 'tailwindcss';
const config: Config = { const config: Config = {
content: [ content: [
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}", './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
"./src/components/**/*.{js,ts,jsx,tsx,mdx}", './src/components/**/*.{js,ts,jsx,tsx,mdx}',
"./src/app/**/*.{js,ts,jsx,tsx,mdx}", './src/app/**/*.{js,ts,jsx,tsx,mdx}',
], ],
theme: { theme: {
extend: { extend: {
fontFamily: { fontFamily: {
sans: ["var(--font-inter)", "var(--font-mikhak)", "ui-sans-serif", "system-ui"], sans: ['var(--font-inter)', 'var(--font-mikhak)', 'ui-sans-serif', 'system-ui'],
mono: ["var(--font-jetbrains-mono)", "ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"], mono: ['var(--font-jetbrains-mono)', 'ui-monospace', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', 'monospace'],
mikhak: ["var(--font-mikhak)", "ui-sans-serif", "system-ui"], mikhak: ['var(--font-mikhak)', 'ui-sans-serif', 'system-ui'],
}, },
colors: { colors: {
background: "var(--background)", border: 'hsl(var(--border))',
foreground: "var(--foreground)", input: 'hsl(var(--input))',
ring: 'hsl(var(--ring))',
background: 'hsl(var(--background))',
foreground: 'hsl(var(--foreground))',
primary: {
DEFAULT: 'hsl(var(--primary))',
foreground: 'hsl(var(--primary-foreground))',
},
secondary: {
DEFAULT: 'hsl(var(--secondary))',
foreground: 'hsl(var(--secondary-foreground))',
},
destructive: {
DEFAULT: 'hsl(var(--destructive))',
foreground: 'hsl(var(--destructive-foreground))',
},
muted: {
DEFAULT: 'hsl(var(--muted))',
foreground: 'hsl(var(--muted-foreground))',
},
accent: {
DEFAULT: 'hsl(var(--accent))',
foreground: 'hsl(var(--accent-foreground))',
},
popover: {
DEFAULT: 'hsl(var(--popover))',
foreground: 'hsl(var(--popover-foreground))',
},
card: {
DEFAULT: 'hsl(var(--card))',
foreground: 'hsl(var(--card-foreground))',
},
blog: { blog: {
red: "#FF5480", red: '#FF5480',
purple: "#9283E0", purple: '#9283E0',
orange: "#FFA599", orange: '#FFA599',
yellow: "#FFD581", yellow: '#FFD581',
violet: "#FE90EC", violet: '#FE90EC',
blue: "#27AEFF", blue: '#27AEFF',
green: "#00DC90", green: '#00DC90',
background: "#F9F9Fb", background: '#F9F9Fb',
text: { text: {
default: "#000000", default: '#000000',
passive: "#9B9B9B", passive: '#9B9B9B',
quote: "#9283E0", quote: '#9283E0',
hover: "#FF5480", hover: '#FF5480',
}, },
}, },
}, },