From aa73de873d6e666f81d01c1d92cd57470f4b42d1 Mon Sep 17 00:00:00 2001
From: Ryan Aulia <hello@aulianza.id>
Date: Thu, 31 Aug 2023 08:55:42 +0700
Subject: [PATCH] fix: mobile view

---
 src/app/layout.tsx                               | 12 ++++++------
 src/common/components/PageWrapper.tsx            |  1 +
 src/modules/homepage/components/ChitChat.tsx     |  6 ++++--
 src/modules/homepage/components/Contact.tsx      |  8 ++++----
 src/modules/homepage/components/Home.tsx         |  2 +-
 src/modules/homepage/components/ServicesItem.tsx |  4 ++--
 6 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index bad0b87..7076a56 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -9,12 +9,12 @@ export const metadata: Metadata = {
   title: "Ryan Aulia - Aulianza Landing Page",
   description: "My Personal Landing Page",
   icons: "/images/aulianza.png",
-  openGraph: {
-    images: "/images/aulianza.png",
-    url: "https://aulianza.com",
-    siteName: "Ryan Aulia - Aulianza Landing Page",
-    type: "website",
-  },
+  // openGraph: {
+  //   images: "/images/aulianza.png",
+  //   url: "https://aulianza.com",
+  //   siteName: "Ryan Aulia - Aulianza Landing Page",
+  //   type: "website",
+  // },
 };
 
 export default function RootLayout({
diff --git a/src/common/components/PageWrapper.tsx b/src/common/components/PageWrapper.tsx
index aaefc08..034397e 100644
--- a/src/common/components/PageWrapper.tsx
+++ b/src/common/components/PageWrapper.tsx
@@ -10,6 +10,7 @@ const PageWrapper = ({ children }: { children: React.ReactNode }) => {
     AOS.init({
       duration: 800,
       delay: 50,
+      disable: "mobile",
     });
   }, []);
 
diff --git a/src/modules/homepage/components/ChitChat.tsx b/src/modules/homepage/components/ChitChat.tsx
index de2bace..2cdd24b 100644
--- a/src/modules/homepage/components/ChitChat.tsx
+++ b/src/modules/homepage/components/ChitChat.tsx
@@ -12,8 +12,10 @@ const ChitChat = () => {
     >
       <div className="flex gap-5 items-start justify-between">
         <div className="space-y-1">
-          <div className="text-lg font-medium">1 on 1 Chit-chat Session</div>
-          <p className="text-neutral-400">
+          <div className="text-base md:text-lg font-medium">
+            1 on 1 Chit-chat Session
+          </div>
+          <p className="text-neutral-400 text-sm md:text-base">
             Let’s find some time to talk about anything!{" "}
           </p>
         </div>
diff --git a/src/modules/homepage/components/Contact.tsx b/src/modules/homepage/components/Contact.tsx
index cae1afb..d7bc8d9 100644
--- a/src/modules/homepage/components/Contact.tsx
+++ b/src/modules/homepage/components/Contact.tsx
@@ -19,7 +19,7 @@ const Contact = () => {
   };
 
   return (
-    <div className="space-y-5">
+    <div className="space-y-4">
       <div className="flex items-center gap-2 px-3">
         <ContactIcon size={26} />
         <h2 className="font-medium text-xl">Get in Touch</h2>
@@ -32,15 +32,15 @@ const Contact = () => {
       >
         <EmailIcon size={24} className="text-neutral-800" />
         <div className="space-y-3">
-          <h6 className="font-medium text-xl">Drop Me an Email</h6>
+          <h6 className="font-medium text-lg md:text-xl">Drop Me an Email</h6>
           <div
-            className="hover:underline text-neutral-800 text-lg"
+            className="hover:underline text-neutral-800 text-lg md:text-lg"
             onClick={() => handleEmailClick("aulianza.dev@gmail.com")}
           >
             {copiedEmail ? "Copied!" : "aulianza.dev@gmail.com"}
           </div>
         </div>
-        <p className="text-sm text-neutral-600 leading-relaxed">
+        <p className="text-sm md:text-base text-neutral-600 leading-relaxed">
           Expect my rapid and eager reply – your message won't be kept waiting!
         </p>
       </div>
diff --git a/src/modules/homepage/components/Home.tsx b/src/modules/homepage/components/Home.tsx
index ba138eb..f2508f4 100644
--- a/src/modules/homepage/components/Home.tsx
+++ b/src/modules/homepage/components/Home.tsx
@@ -10,7 +10,7 @@ import Socials from "./Socials";
 
 const Home = () => {
   return (
-    <div className="p-6 mb-16 space-y-6" data-aos="fade-down">
+    <div className="p-6 mb-2 space-y-6" data-aos="fade-down">
       <Hero />
       <Socials />
       <ButtonLink />
diff --git a/src/modules/homepage/components/ServicesItem.tsx b/src/modules/homepage/components/ServicesItem.tsx
index 561ba0d..5e0abb6 100644
--- a/src/modules/homepage/components/ServicesItem.tsx
+++ b/src/modules/homepage/components/ServicesItem.tsx
@@ -24,8 +24,8 @@ const ServicesItem = ({
         <Image src={icon} alt={title} width={40} height={40} />
       </div>
       <div className={clsx("space-y-1", className)}>
-        <h5 className="text-lg font-medium">{title}</h5>
-        <p className="text-neutral-600">{description}</p>
+        <h5 className="text-base md:text-lg font-medium">{title}</h5>
+        <p className="text-neutral-600 text-sm md:text-base">{description}</p>
       </div>
     </div>
   );