From 5560f95615c601984bdfc523f9253db8d8eea8ed Mon Sep 17 00:00:00 2001
From: Alvalen <alvalen.shafel04@gmail.com>
Date: Fri, 8 Sep 2023 08:47:28 +0700
Subject: [PATCH] [feat] responsive title sub-title in sub pages

---
 app/about/page.jsx    | 10 +++++-----
 app/projects/page.jsx |  6 +++---
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/app/about/page.jsx b/app/about/page.jsx
index fee3524..8cf262c 100644
--- a/app/about/page.jsx
+++ b/app/about/page.jsx
@@ -33,7 +33,7 @@ export default function Page() {
 						className="text-black pr-10"
 					/>
 				</FixedButon>
-				<div className="relative h-screen w-screen  gap-4 p-10 flex justify-center items-center flex-col mb-10 overflow-y-hidden">
+				<div className="relative h-screen w-screen  gap-4 p-10 flex justify-center items-center flex-col mb-10 overflow-hidden">
 					<div className="z-0 mb-48 md:mb-0  md:absolute top-1/4  md:right-[10%] md:-translate-y-16 ">
 						<motion.div
 							initial={{ scale: 1 }}
@@ -50,12 +50,12 @@ export default function Page() {
 						</motion.div>
 					</div>
 					<div className="z-10 w-full absolute md:w-auto md:left-[10%] top-[60%] md:top-1/3 col-span-2 flex flex-col justify-center items-start md:items-start text-start px-10 pt-4 backdrop-filter backdrop-blur-sm md:backdrop-blur-none bg-gray-100 bg-opacity-50 md:bg-transparent md:pt-0">
-						<h1 className="text-5xl md:text-8xl font-bold">
+						<h1 className="md:bg-white bg-transparent lg:bg-transparent bg-opacity-50 md-px-0 text-black text-5xl md:text-8xl font-bold">
 							About Me
 						</h1>
 						<Hr />
-						<p className="title  text-xl mt-4 tracking-wider text-gray-900 leading-[1.7rem] mb-5 ">
-							A brief introduction about me and my interest.
+						<p className="title text-xl mt-4 tracking-wider text-gray-900 leading-[1.7rem] mb-5 ">
+							A brief introduction about me and 										<span className="bg-transparent md:bg-gray-100 bg-opacity-50 xl:bg-transparent"> my interest.</span>
 						</p>
 						<motion.div
 							initial={{ opacity: 0 }}
@@ -67,7 +67,7 @@ export default function Page() {
 									behavior: "smooth",
 								});
 							}}
-							className="">
+							className="mb-3">
 							<Button variation="primary">Scroll Down</Button>
 						</motion.div>
 					</div>
diff --git a/app/projects/page.jsx b/app/projects/page.jsx
index 47a027b..ffc6858 100644
--- a/app/projects/page.jsx
+++ b/app/projects/page.jsx
@@ -117,13 +117,13 @@ export default function Page() {
 						</motion.div>
 					</div>
 					<div className="z-10 w-full absolute md:w-auto md:left-[10%] top-[60%] md:top-1/3 col-span-2 flex flex-col justify-center items-start md:items-start text-start px-10 pt-4 backdrop-filter backdrop-blur-sm md:backdrop-blur-none md:backdrop-filter-none bg-gray-100 bg-opacity-50 md:bg-transparent md:pt-0">
-						<h1 className="text-5xl md:text-8xl font-bold">
+						<h1 className="md:bg-white bg-transparent lg:bg-transparent bg-opacity-50 md-px-0 text-black text-5xl md:text-8xl font-bold">
 							My Projects
 						</h1>
 						<Hr />
 						<p className="title  text-xl mt-4 tracking-wider text-gray-900 leading-[1.7rem] mb-5">
-							List of my projects that I have done and currently
-							working on.
+							List of my projects that I have done and 								<span className="bg-transparent md:bg-gray-100 bg-opacity-50 xl:bg-transparent"> currently
+							working on.</span>
 						</p>
 						<motion.div
 							initial={{ opacity: 0, y: 100 }}