From ca37dcdd7edeb2d2fbfcee86cf34cea1dbf713aa Mon Sep 17 00:00:00 2001
From: hhpr98 <39483775+hhpr98@users.noreply.github.com>
Date: Sun, 29 Oct 2023 22:32:56 +0700
Subject: [PATCH] I-51 Added footer for site

---
 package-lock.json                |  4 ++--
 package.json                     |  2 +-
 src/App.tsx                      | 26 +++++++++++++++-----------
 src/components/Footer/Footer.tsx | 16 ++++++++++++++++
 4 files changed, 34 insertions(+), 14 deletions(-)
 create mode 100644 src/components/Footer/Footer.tsx

diff --git a/package-lock.json b/package-lock.json
index b6d2ebb..84fc560 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "my-travel",
-  "version": "0.3.10",
+  "version": "0.3.11",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "my-travel",
-      "version": "0.3.10",
+      "version": "0.3.11",
       "dependencies": {
         "@testing-library/jest-dom": "^5.16.5",
         "@testing-library/react": "^13.3.0",
diff --git a/package.json b/package.json
index c881e63..f841abe 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "my-travel",
-  "version": "0.3.10",
+  "version": "0.3.11",
   "private": true,
   "homepage": "https://hhpr98.github.io/my-travel",
   "dependencies": {
diff --git a/src/App.tsx b/src/App.tsx
index b909f38..fc06d59 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -8,20 +8,24 @@ import { HashRouter as Router } from "react-router-dom";
 import MainPage from './components/MainPage/MainPage';
 import PlaceDetails from './components/PlaceDetails/PlaceDetails';
 import PlaceGallery from './components/PlaceGallery/PlaceGallery';
+import Footer from './components/Footer/Footer';
 
 function App(): JSX.Element {
   return (
-    <Router>
-      <Routes>
-        <Route path="/" element={<MainPage />} />
-        <Route path="/places/:id" element={<PlaceDetails />} />
-        <Route path="/gallery" element={<PlaceGallery />} />
-        <Route
-          path="*"
-          element={<Navigate to="/" replace />}
-        />
-      </Routes>
-    </Router>
+    <>
+      <Router>
+        <Routes>
+          <Route path="/" element={<MainPage />} />
+          <Route path="/places/:id" element={<PlaceDetails />} />
+          <Route path="/gallery" element={<PlaceGallery />} />
+          <Route
+            path="*"
+            element={<Navigate to="/" replace />}
+          />
+        </Routes>
+      </Router>
+      <Footer />
+    </>
   );
 }
 
diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx
new file mode 100644
index 0000000..78dc28c
--- /dev/null
+++ b/src/components/Footer/Footer.tsx
@@ -0,0 +1,16 @@
+import React from "react";
+
+const Footer = (): JSX.Element => {
+  return (<div
+    className="fixed bottom-0 left-0 right-0 z-40 px-4 py-3 text-center text-white bg-gray-800"
+  >
+    © All rights reserved <a
+      className="text-gray-200 underline"
+      href="https://github.com/hhpr98"
+    >
+      @hhpr98
+    </a>
+  </div>);
+};
+
+export default Footer;