Improved portfolio

src/app/api/contribs/route.ts

@@ -27,8 +27,8 @@ export async function GET(req: NextRequest) {
 
   const data = await response.json();
   const total =
-    data.data.user.contributionsCollection.contributionCalendar
+    data?.data?.user?.contributionsCollection?.contributionCalendar
-      .totalContributions;
+      ?.totalContributions;
 
   return NextResponse.json({ total }, { status: 200 });
 }

src/app/layout.tsx

@@ -17,7 +17,7 @@ export default function RootLayout({
     <html lang="en">
       <body className="antialiased bg-black">
         <Background>
-          <div className="relative h-screen overflow-y-scroll">{children}</div>
+          <div className="relative h-screen">{children}</div>
         </Background>
       </body>
     </html>

src/app/page.tsx

@@ -31,16 +31,14 @@ export default function App() {
   }, []);
 
   return (
-    <div>
-      <div className="content-center w-full lg:mx-auto pt-5 relative z-20 pb-5 animate-fadeIn">
     <div className="w-full max-w-screen-lg mx-auto">
       <div className="px-8 md:px-10 lg:px-15 xl:px-24">
         <h1 className="py-2 text-gray-300">Hey, I'm Klesti! 👋🏻</h1>
         <p className="font-semibold text-gray-300">
-              A 15 year old Software Engineer from Tirane, Albania, with 6 years
+          A 15 year old Software Engineer from Tirane, Albania, with 6 years of
-              of experience, specializing in full-stack web development, desktop
+          experience, specializing in full-stack web development, desktop
-              applications, TUI apps, and hacking. I also have a deep interest
+          applications, TUI apps, and hacking. I also have a deep interest in
-              in low-level programming.
+          low-level programming.
         </p>
 
         {/* Socials and skill */}
@@ -62,10 +60,7 @@ export default function App() {
                 className="text-slate-300 size-[2.3rem]"
               />
             </a>
-                <a
+            <a href="https://www.instagram.com/selimaj.dev/" target="blank_">
-                  href="https://www.instagram.com/selimaj.dev/"
-                  target="blank_"
-                >
               <FontAwesomeIcon
                 icon={faInstagram}
                 className="text-slate-300 size-[2.3rem]"
@@ -115,7 +110,7 @@ export default function App() {
             }}
           />
         </section>
-            <footer className="mt-8 border-t pt-3">
+        <footer className="mt-8 border-t pt-3 pb-8">
           If you see this i ❤️ you
           <p className="text-slate-300 mx-auto w-max mt-2">
             © 2025 Klesti. All rights reserved.
@@ -123,7 +118,5 @@ export default function App() {
         </footer>
       </div>
     </div>
-      </div>
-    </div>
   );
 }

src/components/Background.tsx

@@ -72,9 +72,9 @@ export default function Background({
         }}
         src="/logo.png"
         alt="Logo"
-        className="size-24 rounded-full border-slate-500 border"
+        className="size-24 rounded-full border-slate-500 border z-10 absolute"
       />
-      <div className="relative z-10">{children}</div>
+      <div className="relative z-50 overflow-y-scroll">{children}</div>
     </div>
   );
 }