fix fonts issue

app/nav-bar.tsx

@@ -83,7 +83,7 @@ const HeadBar = () => {
         <Link href="/">
           <span
             className={clsx(
-              'font-semibold font-Aref-Ruqaa',
+              'font-semibold',
               'text-3xl tracking-widest',
               'select-none'
             )}
@@ -161,4 +161,4 @@ const HeadBar = () => {
   );
 };
 
-export default memo(HeadBar);
+export default memo(HeadBar);

lib/fonts.ts

@@ -1,10 +1,4 @@
-import {
-  Aleo,
-  Aref_Ruqaa,
-  Barlow,
-  JetBrains_Mono,
-  Poppins,
-} from 'next/font/google';
+import { Aleo, Barlow, JetBrains_Mono, Poppins } from 'next/font/google';
 
 export const aleo = Aleo({
   weight: ['300', '400', '700'],
@@ -13,13 +7,6 @@ export const aleo = Aleo({
   subsets: ['latin'],
 });
 
-export const aref_ruqaa = Aref_Ruqaa({
-  weight: ['400', '700'],
-  variable: '--font-aref-ruqaa',
-  display: 'swap',
-  subsets: ['latin'],
-});
-
 export const barlow = Barlow({
   weight: ['100', '200', '300', '400', '500', '600', '700', '800', '900'],
   variable: '--font-barlow',
@@ -29,7 +16,7 @@ export const barlow = Barlow({
 
 export const jetbrains_mono = JetBrains_Mono({
   display: 'swap',
-  weight: ['300', '400', '700'],
+  weight: ['200', '300', '400', '700'],
   variable: '--font-jetbrains-mono',
   subsets: ['latin'],
 });
@@ -42,7 +29,6 @@ export const poppins = Poppins({
 
 const fonts = {
   aleo,
-  aref_ruqaa,
   barlow,
   jetbrains_mono,
   poppins,

styles/prism-one-dark.css

@@ -35,7 +35,7 @@
   text-shadow: 0 1px rgba(0, 0, 0, 0.3);
   /* font-family: 'Fira Code', 'Fira Mono', Menlo, Consolas, 'DejaVu Sans Mono',
       monospace; */
-  font-family: 'JetBrains Mono', -apple-system, 'DejaVu Sans Mono', monospace;
+  font-family: var(--font-jetbrains-mono), -apple-system, 'DejaVu Sans Mono', monospace;
   direction: ltr;
   text-align: left;
   white-space: pre;
@@ -520,4 +520,4 @@ pre
 /* Fill colour of the handle */
 .dark .prism-previewer-easing.prism-previewer-easing circle {
   fill: transparent;
-}
+}

styles/prism-one-light.css

@@ -34,7 +34,8 @@ pre {
   color: hsl(230, 8%, 24%);
   /* font-family: 'Fira Code', 'Fira Mono', Menlo, Consolas, 'DejaVu Sans Mono',
       monospace; */
-  font-family: 'JetBrains Mono', -apple-system, 'DejaVu Sans Mono', monospace;
+  font-family: var(--font-jetbrains-mono), -apple-system, 'DejaVu Sans Mono',
+    monospace;
   direction: ltr;
   text-align: left;
   white-space: pre;
@@ -432,4 +433,4 @@ pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection {
 /* Fill colour of the handle */
 .prism-previewer-easing.prism-previewer-easing circle {
   fill: transparent;
-}
+}

styles/rua.css

@@ -371,5 +371,5 @@ h6:hover::before {
 
 #article .cm-editor .cm-line {
   font-size: 15px;
-  font-family: 'JetBrains Mono', -apple-system, monospace;
-}
+  font-family: var(--font-jetbrains-mono), -apple-system, monospace;
+}

tailwind.config.js

@@ -10,10 +10,14 @@ module.exports = {
     extend: {
       fontFamily: {
         Aleo: ['--font-aleo'],
-        'Aref-Ruqaa': ['var(--font-aref-ruqaa)'],
         Barlow: ['var(--font-barlow)'],
         Poppins: ['var(--font-poppins)'],
-        Mono: ['var(--fonts-jetbrains-mono)', '-apple-system', 'monospace'],
+        Mono: [
+          'var(--fonts-jetbrains-mono)',
+          'DejaVu Sans Mono',
+          '-apple-system',
+          'monospace',
+        ],
       },
       colors: {
         bluish: {
@@ -41,4 +45,4 @@ module.exports = {
     },
   },
   plugins: [],
-};
+};