From 5a87f0c3e9addd4f112f211281de7da7609505ac Mon Sep 17 00:00:00 2001
From: Alvalen <alvalen.shafel04@gmail.com>
Date: Wed, 6 Sep 2023 16:39:25 +0700
Subject: [PATCH] [feat] change back button

---
 app/(root)/page.jsx           |  4 +++-
 app/about/page.jsx            |  2 +-
 app/projects/[slug]/page.jsx  | 13 +++++++++++--
 app/projects/archive/page.jsx | 16 ++++++++++++----
 app/projects/page.jsx         |  2 +-
 components/Hr.jsx             |  2 +-
 6 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/app/(root)/page.jsx b/app/(root)/page.jsx
index 2c4180a..28afdd1 100644
--- a/app/(root)/page.jsx
+++ b/app/(root)/page.jsx
@@ -103,7 +103,9 @@ const MyPage = () => {
 											Download CV
 										</Button>
 										<Button variation="secondary">
-											Contact Me
+											<a href="#contact">
+												Contact Me
+											</a>
 										</Button>
 									</motion.div>
 								</motion.div>
diff --git a/app/about/page.jsx b/app/about/page.jsx
index 0f65861..92163b9 100644
--- a/app/about/page.jsx
+++ b/app/about/page.jsx
@@ -22,7 +22,7 @@ export default function Page() {
 
 	
 	const handleBack = () => {
-		window.history.back();
+		window.location.href = "/";
 	};
 	return (
 		<>
diff --git a/app/projects/[slug]/page.jsx b/app/projects/[slug]/page.jsx
index b62389c..292ab12 100644
--- a/app/projects/[slug]/page.jsx
+++ b/app/projects/[slug]/page.jsx
@@ -7,6 +7,8 @@ import { faGithub } from "@fortawesome/free-brands-svg-icons";
 import { faArrowUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";
 import NotFound from "@/app/not-found";
 import Image from "next/image";
+import FixedButon from "@/components/FixedButton";
+import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
 
 function Page({ params }) {
 	const [data, setData] = useState(null);
@@ -28,7 +30,6 @@ function Page({ params }) {
 			</>
 		);
 	} else if (!data) {
-		// skleton loading
 		return (
 			<div className="relative min-h-screen w-full  gap-4 p-10 flex justify-center items-center flex-col mb-10 ">
 				<div className="min-h-screen flex justify-center items-center w-full">
@@ -54,9 +55,17 @@ function Page({ params }) {
 			</div>
 		);
 	}
-
+			const handleBack = () => {
+				window.history.back();
+			};
 	return (
 		<div className="relative min-h-screen w-full  gap-4 p-10 flex justify-center items-center flex-col mb-10 ">
+			<FixedButon onClick={handleBack}>
+				<FontAwesomeIcon
+					icon={faChevronLeft}
+					className="text-black pr-10"
+				/>
+			</FixedButon>
 			<div className="min-h-screen flex justify-center items-center">
 				<div className="mx-auto grid grid-cols-1 md:grid-cols-2  mt-10 md:mt-0">
 					<div className="flex justify-center items-start flex-col mb-5 space-y-10 mx-auto">
diff --git a/app/projects/archive/page.jsx b/app/projects/archive/page.jsx
index 83e8b03..a1e6a06 100644
--- a/app/projects/archive/page.jsx
+++ b/app/projects/archive/page.jsx
@@ -4,7 +4,8 @@ import { motion } from "framer-motion";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faGithub } from "@fortawesome/free-brands-svg-icons";
 import { faArrowUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";
-
+import FixedButon from "@/components/FixedButton";
+import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
 const projects = [
 	{
 		year: "2023",
@@ -84,9 +85,18 @@ const projects = [
 	},
 ];
 export default function Page () {
+		const handleBack = () => {
+			window.history.back();
+		};
   return (
 		<>
 			<main className="overflow-hidden">
+				<FixedButon onClick={handleBack}>
+					<FontAwesomeIcon
+						icon={faChevronLeft}
+						className="text-black pr-10"
+					/>
+				</FixedButon>
 				<div className="min-h-screen w-screen mt-10 md:mt-0  p-10 flex justify-center items-center flex-col mb-10">
 					<div className="flex justify-center items-center flex-col my-5 self-start ">
 						<motion.div
@@ -171,9 +181,7 @@ export default function Page () {
 												)}
 												{project.preview && (
 													<a
-														href={
-															project.preview
-														}
+														href={project.preview}
 														title="Link to project preview">
 														<FontAwesomeIcon
 															icon={
diff --git a/app/projects/page.jsx b/app/projects/page.jsx
index 3acca8e..3cbe55a 100644
--- a/app/projects/page.jsx
+++ b/app/projects/page.jsx
@@ -89,7 +89,7 @@ export default function Page() {
 		window.scrollTo(0, 0);
 	}, []);
 	const handleBack = () => {
-		window.history.back();
+		window.location.href = "/";
 	};
 	return (
 		<>
diff --git a/components/Hr.jsx b/components/Hr.jsx
index 6625452..f0d301a 100644
--- a/components/Hr.jsx
+++ b/components/Hr.jsx
@@ -7,7 +7,7 @@ export default function Hr() {
 				className="bg-gray-700 w-20 h-1 rounded-full mb-2"
 				initial={{
 					opacity: 0,
-					x: -50,
+					x: -45,
 				}}
 				whileInView={{
 					opacity: 1,