Updates

Author: va0ck

public/SocialsBanner.png

@@ -5,7 +5,7 @@ import { Home } from './pages/Home';
 import Navbar from './components/Navbar';
 import Footer from './components/Footer';
 import { Works } from './pages/Works';
-import { Tools } from './pages/Tools';
+import { Socials } from './pages/Socials';
 
 function App() {
   return (
@@ -16,7 +16,7 @@ function App() {
         <Routes>
           <Route index element={<Home />} />
           <Route path='/works' element={<Works />} />
-          <Route path='/tools' element={<Tools />} />
+          <Route path='/socials' element={<Socials />} />
         </Routes>
       </div>
 

public/WorkBanner.png

@@ -1,9 +1,16 @@
+/* 
+    This is super evil footer.
+    I could update every year manually.
+    But like... Why not automatically lol.
+*/
+
 const Footer = () => {
+    const currentYear = new Date().getFullYear();
 
     return <>
         <br/><br/>
         <footer className="z-50 flex justify-center fixed inset-x-0 bottom-0 p-2 bg-gray-800">
-            <p className="text-xs">@2025 Va0ck</p>
+            <p className="text-xs">@{currentYear} Va0ck</p>
         </footer>
     </>
 }

src/App.tsx

@@ -4,6 +4,7 @@ import DevforumLogo from '../assets/icons/Navbar/Roblox_Devforum_Logo.svg'
 import GithubLogo from '../assets/icons/Navbar/github-mark-white.svg'
 import DiscordLogo from '../assets/icons/Navbar/discord-icon.svg'
 import { useState, useLayoutEffect } from 'react';
+import { Link } from 'react-router-dom'
 
 const Navbar = () => {
     const [width, setWidth] = useState(0);
@@ -13,7 +14,7 @@ const Navbar = () => {
         function updateSize() {
             setWidth(window.innerWidth);
 
-            if (width < 480){
+            if (width < 530){
                 setDisplayLinks(false);
             } else {
                 setDisplayLinks(true);
@@ -26,10 +27,10 @@ const Navbar = () => {
       }, [width]);
 
     return (<nav className='nav'>
-        <a href="/" className="site-title hover:drop-shadow-[0_0_2em_rgba(255,255,255,1)] duration-300">Va0ck</a>
+        <Link to="/" className="site-title hover:drop-shadow-[0_0_2em_rgba(255,255,255,1)] duration-300">Va0ck</Link>
         <ul className='links'>
-            <li><a href="/works">Works</a></li>
-            <li><a href="/tools">Tools</a></li>
+            <li><Link to="/works">Works</Link></li>
+            <li><Link to="/socials">Socials</Link></li>
         </ul>
 
         {displayLinks ? (