Merge pull request #91 from Z-100/feature/fonts-and-navbar

Fix fonts and Navbar active tab

src/components/navigation/Navbar.tsx

@@ -1,22 +1,24 @@
-import React, {useState} from 'react'
+import React, {useEffect, useState} from 'react'
 import {routerData} from "../router";
-import {Link} from "react-router-dom";
+import {Link, useLocation} from "react-router-dom";
 
 export const Navbar = () => {
 
-    const [active, setActive] = useState(routerData[0].name)
+    const location = useLocation();
+    const [url, setUrl] = useState('');
+    useEffect(() => {
+        setUrl(location.pathname);
+    }, [location]);
 
     return (
         <>
             <div className="fixed top-0 w-full bg-dark-1 h-16">
                 <div className="w-[50%] ml-[25%] h-full flex gap-6 items-center justify-center">
                     {routerData.map(route => (
                         <Link key={route.name}
-                              to={route.path}
-                              onClick={() => setActive(route.name)}
-                              className="">
+                              to={route.path}>
 
-                            <p className={active === route.name ? "font-bold" : "text-light-2"}>{route.name}</p>
+                            <p className={url === route.path ? "font-bold" : "text-light-2"}>{route.name}</p>
                         </Link>
                     ))}
                 </div>

src/components/navigation/contact/components/contact-form/ContactFormContainer.tsx

@@ -1,4 +1,4 @@
-import React, {useRef, useState} from 'react'
+import React, {useState} from 'react'
 
 export const ContactFormContainer = () => {
 

src/index.css

@@ -12,6 +12,11 @@
     }
 }
 
+@font-face {
+    font-family: 'Montserrat';
+    src: url('/public/Montserrat-Regular.ttf');
+}
+
 h1 {
     font-size: 2rem;
 }