From ee9d0391f485da2adb76c041cd83ed7a917c8ddc Mon Sep 17 00:00:00 2001
From: IMXNOOBX <paraelmobil403@gmail.com>
Date: Wed, 3 Apr 2024 08:41:00 +0000
Subject: [PATCH] Hotfix to the ScrollTo Component

---
 app/components/navbar/navlink/index.tsx  | 1 +
 app/components/navbar/profiles/index.tsx | 2 +-
 app/components/utils/ScrollTo.tsx        | 4 ++--
 app/projects/page.tsx                    | 2 ++
 4 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/app/components/navbar/navlink/index.tsx b/app/components/navbar/navlink/index.tsx
index ad8c4f5..754b946 100644
--- a/app/components/navbar/navlink/index.tsx
+++ b/app/components/navbar/navlink/index.tsx
@@ -11,6 +11,7 @@ export default function Button({ image, to, isActive = false, className, childre
                     className={`flex transition-all duration-300 bg-transparent ${isActive ? 'py-2' : 'group-hover:py-2'}`}>
                     <Image 
                         src={image} 
+                        priority={true}
                         className={
                             `select-none w-8 transition-all duration-300 border-opacity-0 border-indigo-500 rounded-xl ${ isActive ? 
                                     'rotate-0 shadow-[#5D5DFF_0px_0px_30px] bg-indigo-500/50 border-2 border-opacity-100  p-1 translate-y-3'
diff --git a/app/components/navbar/profiles/index.tsx b/app/components/navbar/profiles/index.tsx
index 2543408..cbe0969 100644
--- a/app/components/navbar/profiles/index.tsx
+++ b/app/components/navbar/profiles/index.tsx
@@ -8,7 +8,7 @@ const Profile = ({ to, pfp, applicationp, className, full }: { to: string, pfp:
             className={`group transition ease-in-out select-none relative p-1 cursor-pointer ${className}`}
             onClick={() => window.open(to, '_blank')}
             >
-            <Image src={pfp} className={`w-full fill-current select-none hover:drop-shadow-2xl rounded-xl transition-all ease-in duration-300 group-hover:scale-105 aspect-square ${full && 'border-2 border-gray-700'}`} alt="icon" />
+            <Image src={pfp} priority={true} className={`w-full fill-current select-none hover:drop-shadow-2xl rounded-xl transition-all ease-in duration-300 group-hover:scale-105 aspect-square ${full && 'border-2 border-gray-700'}`} alt="icon" />
             <Image src={applicationp} className="h-6 w-6 absolute -bottom-1 select-none right-0 group-hover:-translate-x-10 group-hover:-translate-y-10 ease-out group-hover:rotate-full transition-all duration-300 drop-shadow-[#FFF_0px_0px_10px]" alt="icon" />
         </div>
     );
diff --git a/app/components/utils/ScrollTo.tsx b/app/components/utils/ScrollTo.tsx
index d09a796..ac3629d 100644
--- a/app/components/utils/ScrollTo.tsx
+++ b/app/components/utils/ScrollTo.tsx
@@ -50,7 +50,7 @@ export default function ScrollTo({ point }: { point: number | undefined }) {
                 },
                 scrolled: {
                     opacity: 1,
-                    position: 'fixed',
+                    // position: 'fixed',
                     x: '-40px',
                     bottom: '10%',
                     left: '50%',
@@ -63,7 +63,7 @@ export default function ScrollTo({ point }: { point: number | undefined }) {
                 }
             }}
             onClick={() => window.scrollTo({ top: scrolled ? 0 :point || window.innerHeight, behavior: 'smooth' })}
-            className="overflow-hidden absolute bottom-20 left-1/2 flex items-center justify-center w-20 h-20 cursor-pointer z-50 select-none"
+            className="overflow-hidden fixed bottom-20 left-1/2 flex items-center justify-center w-20 h-20 cursor-pointer z-50 select-none"
         >
             <span className="absolute inline-flex h-10 w-10 bg-white/10 animate-ping rounded-full opacity-75"></span>
             <Image src={Scroll} alt="scroll" className="w-10 h-10" priority={true} />
diff --git a/app/projects/page.tsx b/app/projects/page.tsx
index ff5ed32..efb0470 100644
--- a/app/projects/page.tsx
+++ b/app/projects/page.tsx
@@ -1,4 +1,5 @@
 import ProjectCard from "@/app/projects/card/index";
+import ScrollTo from "@/app/components/utils/ScrollTo";
 
 async function getProjects(username: string = "") {
     if (!username)
@@ -21,6 +22,7 @@ export default async  function Projects() {
 
   return (
     <div className="relative w-full grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 text-white my-20 pb-20 sm:animate-fade-in">
+        <ScrollTo point={undefined} />
         {repos.map((repo: any, i: number) => (
             <div key={i}>
                 <ProjectCard project={repo} index={i} />