resume and website update

app/page.js

@@ -3,24 +3,27 @@ const Home = () => {
   return (
     <div
       className="py-10 gap-4 flex flex-row justify-center h-[550px] w-full h-full bg-no-repeat bg-cover
-    bg-[url('https://cdn.pixabay.com/photo/2024/01/30/14/02/road-8542123_1280.jpg')]"
+    bg-[url('https://images.unsplash.com/photo-1689718107045-513b35f1a356?blend=000000&blend-alpha=10&blend-mode=normal&blend-w=1&crop=faces%2Cedges&h=630&mark=https%3A%2F%2Fimages.unsplash.com%2Fopengraph%2Flogo.png&mark-align=top%2Cleft&mark-pad=50&mark-w=64&w=1200&auto=format&fit=crop&q=60&ixid=M3wxMjA3fDB8MXxhbGx8fHx8fHx8fHwxNzE0NzE4MTI0fA&ixlib=rb-4.0.3')]"
     >
       <div className="px-10 pt-10 drop-shadow-lg">
         <img
           src="https://media.licdn.com/dms/image/C4D03AQEh5TQYOVabFg/profile-displayphoto-shrink_400_400/0/1658277944683?e=1715817600&v=beta&t=6wJXkNsW_zn2-UwrWLKllZBJK_oglZziLGyoAbSV_Sc"
-          class="rounded-full h-auto max-w-sm mx-auto border border-4 border-white"
+          className="rounded-full h-auto max-w-sm mx-auto border border-4 border-white"
           alt="Self Picture"
         />
       </div>
 
       <div className="drop-shadow-lg">
-        <h1 className="mt-10 text-center text-6xl font-sans-bold leading-9 tracking-tight text-white">
+        <h1 className="mt-10 text-center text-7xl font-bold leading-9 tracking-tight text-white">
           Satyam Singh
         </h1>
         <div className="flex flex-col items-center justify-center mt-10">
-          <p className="text-3xl text-center"> Computer Engineering</p>
-          <p className="text-3xl text-center py-5">
+          <p className="text-3xl text-center font-bold"> Computer Engineering</p>
+          <p className="text-3xl text-center py-5 ">
             {" "}
+            Hoeft Technology and Management Minor
+          </p>
+          <p className="text-3xl text-center">
             Innovation, Leadership & Engineering Entrepreneurship
           </p>
           <div className="flex flex-row space-x-10">

components/Navbar.js

@@ -2,9 +2,9 @@ import React from "react";
 
 const Navbar = () => {
   return (
-    <nav class="bg-light">
+    <nav className="bg-light">
 
-      <div class="max-w-screen-xl flex flex-wrap  justify-between mx-auto p-4">
+      <div className="max-w-screen-xl flex flex-wrap  justify-between mx-auto p-4">
         <div className="flex flex-row space-x-12 ">
         <img
               src="../images/web-logo-white.png"
@@ -29,8 +29,8 @@ const Navbar = () => {
             href="https://github.com/satyams1107"
           >
             <img
-              src="https://png2.cleanpng.com/sh/dcaa84daee2a9ad9ecef29f927ecfbcd/L0KzQYm3WMA4N6ttiZH0aYP2gLBuTfdqfJl6ep95YXfog37zjBdwNaNqiNH8aYTygsq0hv9zc15sgeZxdXKwfLFuj70yNZ5mf9d3dIn2PYbpVsllbWg2eqc6Mka4Pom8WMYxP2c7Sac8M0a5RImBUcc1OWgziNDw/kisspng-github-pages-logo-repository-fork-github-logo-1-magentys-5b69de71b51265.8586076615336648817417.png"
-              className="h-auto h-10 w-10 mr-2"
+              src="https://cdn-icons-png.flaticon.com/512/25/25231.png"
+              className="h-auto h-10 w-10 mr-2 invert"
               alt="Github"
             />
           </a>
@@ -69,7 +69,7 @@ const Navbar = () => {
             <li>
               <a
                 target="_blank"
-                href="https://drive.google.com/file/d/1q8AObve7Di_mKBGlMzJ2uEyZLu7s6E5h/view?usp=sharing"
+                href="https://drive.google.com/file/d/1Qk4CB-7gZX26lD9Lseom6hTUKLJBMns0/view?usp=sharing"
                 className="block py-2 px-5 text-gray-900 rounded-xl w-[110px] h-[40px] flex items-center justify-center hover:bg-dark md:hover:bg-dark md:border-0 md:hover:text-blue-700 md:p-0 dark:text-white md:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-dark bg-opacity-60 hover:scale-105 ease-in-out duration-200"
               >
                 Resume

components/Projects.js

@@ -1,15 +1,39 @@
+'use client';
 import React from "react";
+import { MdChevronLeft, MdChevronRight } from 'react-icons/md';
 export const project = [
   {
     id: 1,
-    logo: "../images/ufit.png",
-    name: "U-Fit",
+    logo: "https://img2.svgdesigns.com/printart/xlarge/Sew_Sweet_Paradise/PGSSP1774.webp",
+    name: "Final Score",
     description:
-      "Developed the UI layout using Figma and translated it over to a Flutter application using Dart to create an app responsible for scheduling daily workouts and facilitated machine-learning capabilities into the app. Implemented Google Firebase as the primary backend and database for user authentication and data storage",
-    skills: ["flutter", "firebase", "dart", "authentication", "app-dev"],
+      "Developed a comprehensive, real-time web application using MySQL and Google Cloud Platform (GCP) to display the last two minutes of NBA data, enabling users to compare players, teams, and referees. Created API endpoints with MySQL, GCP, and REST to service and query 80k+ data entries across various tables in SQL database.",
+    skills: [
+      "MySQL",
+      "Google Cloud Platform",
+      "Javascript",
+      "Next",
+      "Node.js",
+      "Git",
+    ],
   },
   {
     id: 2,
+    logo: "https://seeklogo.com/images/L/linux-logo-76B2B1C6AD-seeklogo.com.png",
+    name: "391OS",
+    description:
+      "Constructed an operating system based on the IA-32 Intel Architecture, incorporating features such as file systems, segmentation, paging, context switching, system calls, interrupt handling, real-time clock, programmable interval timer and scheduling. Allows users to execute various basic commands in a terminal.",
+    skills: [
+      "C",
+      "x86 Assembly",
+      "OS",
+      "IA-32 Intel Architecture",
+      "GDB",
+      "Git",
+    ],
+  },
+  {
+    id: 3,
     logo: "https://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Full-protection-shackle-frwiki.svg/1446px-Full-protection-shackle-frwiki.svg.png",
     name: "PassSafe",
     description:
@@ -25,7 +49,15 @@ export const project = [
     ],
   },
   {
-    id: 3,
+    id: 4,
+    logo: "../images/ufit.png",
+    name: "U-Fit",
+    description:
+      "Developed the UI layout using Figma and translated it over to a Flutter application using Dart to create an app responsible for scheduling daily workouts and facilitated machine-learning capabilities into the app. Implemented Google Firebase as the primary backend and database for user authentication and data storage",
+    skills: ["flutter", "firebase", "dart", "authentication", "app-dev"],
+  },
+  {
+    id: 5,
     logo: "../images/web-logo.png",
     name: "Portfolio Website",
     description:
@@ -42,14 +74,25 @@ export const project = [
 ];
 
 const Projects = () => {
+  const slideLeft = () => {
+    var slider = document.getElementById('slider_projects');
+    slider.scrollLeft = slider.scrollLeft - 500;
+  };
+
+  const slideRight = () => {
+    var slider = document.getElementById('slider_projects');
+    slider.scrollLeft = slider.scrollLeft + 500;
+  };
+
   return (
     <>
       <div className="bg-dark px-10 pt-5 pb-2 text-5xl font-bold">
         <h>Projects</h>
       </div>
       <div className="relative flex items-center content-center bg-dark py-5">
+        <MdChevronLeft className="opacity-75 hover:opacity-100 bg-silver bg-opacity-50" onClick={slideLeft} size={100} />
         <div
-          id="slider"
+          id="slider_projects"
           className="w-auto h-[auto] items-center content-center soverflow-x-scroll overflow-y-hidden scroll whitespace-nowrap scroll-smooth scrollbar-hide space-x-10"
         >
           {project.map((item) => (
@@ -67,7 +110,7 @@ const Projects = () => {
                       alt="/"
                     />
                     <div className="flex flex-col w-[400px]">
-                      <div class=" text-3xl mb-2 text-center">
+                      <div className=" text-3xl mb-2 text-center">
                         <p className="text-black font-bold">{item.name}</p>
                       </div>
                       <div className="text-lg text-center text-black text-wrap">
@@ -88,6 +131,7 @@ const Projects = () => {
             </div>
           ))}
         </div>
+        <MdChevronRight className="opacity-75 hover:opacity-100 bg-silver bg-opacity-50" onClick={slideRight} size={100} />
       </div>
     </>
   );

package.json

@@ -12,6 +12,7 @@
     "next": "14.1.3",
     "react": "^18",
     "react-dom": "^18",
+    "react-icons": "^5.2.0",
     "tailwind-scrollbar-hide": "^1.1.7"
   },
   "devDependencies": {