hotfix/disable hover states for mobile

app/info/page.tsx

@@ -95,12 +95,12 @@ const Contact = () => {
             <a
               href='mailto:[email protected]'
               target='_blank'
-              className='flex size-10 items-end justify-center transition-transform duration-300 ease-in-out hover:-translate-y-1 hover:translate-x-2 xl:size-16'
+              className='flex size-10 items-end justify-center transition-transform duration-300 ease-in-out xl:size-16 xl:hover:-translate-y-1 xl:hover:translate-x-2'
             >
               <EmailIcon />
             </a>
             <a
-              className='flex size-10 items-center justify-center transition-transform duration-300 ease-in-out hover:-translate-y-1 hover:translate-x-2 xl:size-16'
+              className='flex size-10 items-center justify-center transition-transform duration-300 ease-in-out xl:size-16 xl:hover:-translate-y-1 xl:hover:translate-x-2'
               href='https://github.com/dsmooot'
               target='_blank'
             >
@@ -109,7 +109,7 @@ const Contact = () => {
             <a
               href='https://www.linkedin.com/in/dustin-smoote/'
               target='_blank'
-              className='flex size-10 items-center justify-center transition-transform duration-300 ease-in-out hover:-translate-y-1 hover:translate-x-2 xl:size-16'
+              className='flex size-10 items-center justify-center transition-transform duration-300 ease-in-out xl:size-16 xl:hover:-translate-y-1 xl:hover:translate-x-2'
             >
               <LinkedInIcon />
             </a>

src/components/dom/common/Button.tsx

@@ -18,7 +18,7 @@ const Button = ({ button, className = '', ...props }: IButtonProps) => {
   return (
     <button
       className={cx(
-        'h-[48px] w-[100px] overflow-hidden whitespace-nowrap rounded-full bg-black text-2xl font-semibold transition-all duration-300 ease-in-out hover:-translate-y-1 hover:translate-x-2 hover:shadow-lg md:h-[64px] md:w-[200px]',
+        'h-[48px] w-[100px] overflow-hidden whitespace-nowrap rounded-full bg-black text-2xl font-semibold transition-all duration-300 ease-in-out md:h-[64px] md:w-[200px] xl:hover:-translate-y-1 xl:hover:translate-x-2 xl:hover:shadow-lg',
         className,
       )}
       onClick={async () => {

src/components/dom/pages/project/Project.tsx

@@ -73,7 +73,7 @@ const Project = ({ params }: { params: { project: string } }) => {
                 window.open(_currentProject.href, '_blank')
               },
             }}
-            className='min-w-[120px] border border-black bg-white text-black transition-all duration-300 ease-in-out hover:bg-white hover:shadow-lg xl:bg-transparent'
+            className='min-w-[120px] border border-black bg-white text-black transition-all duration-300 ease-in-out xl:bg-transparent xl:hover:bg-white xl:hover:shadow-lg'
           />
         </div>
       )}

src/components/dom/pages/projects/FilterButton.tsx

@@ -16,7 +16,7 @@ export default function FilterButton({
 }: IButtonProps) {
   return (
     <button
-      className={`w-[100px] rounded-full px-4 py-1 uppercase hover:bg-black hover:text-white ${isActive ? 'bg-black text-white' : 'border border-black bg-white text-black'} ${className}`}
+      className={`w-[100px] rounded-full px-4 py-1 uppercase lg:hover:bg-black lg:hover:text-white ${isActive ? 'bg-black text-white' : 'border border-black bg-white text-black'} ${className}`}
       {...props}
       onClick={onClick}
     >

src/components/dom/pages/projects/ProjectsList.tsx

@@ -104,7 +104,7 @@ const ProjectList = {
             >
               <li
                 key={project.title}
-                className='group flex w-full transform flex-col gap-4 overflow-visible py-4 transition-transform duration-300 ease-in-out hover:-translate-y-1 hover:translate-x-2 xl:flex-row xl:items-center'
+                className='group flex w-full transform flex-col gap-4 overflow-visible py-4 transition-transform duration-300 ease-in-out xl:flex-row xl:items-center xl:hover:-translate-y-1 xl:hover:translate-x-2'
                 onMouseOver={() => handleEnter(project)}
                 onMouseLeave={() => handleLeave()}
               >