From 690f39e0cbefaa68a406110b2885a88d3d1fe22b Mon Sep 17 00:00:00 2001
From: Ridho Perdana <ridho.perdana@wartek.belajar.id>
Date: Tue, 17 Dec 2024 11:58:24 +0700
Subject: [PATCH] fix: temp fix footer on both menu

---
 src/AnimalFacts.jsx |  9 ++++++++-
 src/AnimalStory.jsx | 41 +++++++++++++++++++++++++++++++----------
 src/App.jsx         |  7 -------
 3 files changed, 39 insertions(+), 18 deletions(-)

diff --git a/src/AnimalFacts.jsx b/src/AnimalFacts.jsx
index 8815436..444b0ec 100644
--- a/src/AnimalFacts.jsx
+++ b/src/AnimalFacts.jsx
@@ -445,12 +445,19 @@ const AnimalFacts = ({ IsMenuOpen }) => {
             {/* Animal Placeholder */}
             <div
                 id="book-content"
-                className="flex flex-col items-center w-full mb-8"
+                className="flex flex-col items-center w-full"
                 style={{ paddingBottom: '160px' }} // Adjusted bottom padding for the floating section height
             >
                 {randomizedImageUploader.map((animal) => (
                     <Card key={animal.id} animal={animal} cardId={animal.id} />
                 ))}
+                {/* Footer Section */}
+                <footer className="w-full bg-gray-800 text-white text-center py-4 mt-8 p-4">
+                    <p className='text-sm'>
+                        Semua audio diambil dari <a href="https://pixabay.com" className="underline">Pixabay</a> dan gambar hewan dihasilkan oleh AI.
+                    </p>
+                    <p className='text-sm'>Web dibuat oleh <a href="https://ridho.work" className="underline">Ridho Perdana</a></p>
+                </footer>
             </div>
 
             <div
diff --git a/src/AnimalStory.jsx b/src/AnimalStory.jsx
index 7137934..2dd1c47 100644
--- a/src/AnimalStory.jsx
+++ b/src/AnimalStory.jsx
@@ -3,17 +3,38 @@ import React from 'react';
 
 const AnimalStory = () => {
     return (
-        <div style={{
-            backgroundImage: 'url("/background.jpg")',
-            backgroundRepeat: 'repeat',
-            backgroundSize: 'auto',
-        }} className="p-8">
-            <h2 className="text-2xl font-bold mb-4">Cerita Hewan</h2>
-            <p className="text-gray-700">
-                Yuk baca cerita hewan yang terus update setiap hari!
-            </p>
+        <div
+            style={{
+                backgroundImage: 'url("/background.jpg")',
+                backgroundRepeat: 'repeat',
+                backgroundSize: 'auto',
+            }}
+            className="flex flex-col min-h-screen"
+        >
+            <div className="flex-grow p-8">
+                <h2 className="text-2xl font-bold mb-4">Cerita Hewan</h2>
+                <p className="text-gray-700">
+                    Yuk baca cerita hewan yang terus update setiap hari!
+                </p>
+            </div>
+
+            <footer className="w-full bg-gray-800 text-white text-center py-4 p-4">
+                <p className="text-sm">
+                    Semua audio diambil dari{' '}
+                    <a href="https://pixabay.com" className="underline">
+                        Pixabay
+                    </a>{' '}
+                    dan gambar hewan dihasilkan oleh AI.
+                </p>
+                <p className="text-sm">
+                    Web dibuat oleh{' '}
+                    <a href="https://ridho.work" className="underline">
+                        Ridho Perdana
+                    </a>
+                </p>
+            </footer>
         </div>
     );
 };
 
-export default AnimalStory;
\ No newline at end of file
+export default AnimalStory;
diff --git a/src/App.jsx b/src/App.jsx
index 1fe58d8..9c8b933 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -51,13 +51,6 @@ const App = () => {
                     <Route path="/" element={<AnimalFacts isMenuOpen={isMenuOpen} IsMenuOpen={isMenuOpen} />} />
                     <Route path="/story" element={<AnimalStory />} />
                 </Routes>
-                {/* Footer Section */}
-                <footer className="w-full bg-gray-800 text-white text-center py-4 mt-8 p-4">
-                    <p className='text-sm'>
-                        Semua audio diambil dari <a href="https://pixabay.com" className="underline">Pixabay</a> dan gambar hewan dihasilkan oleh AI.
-                    </p>
-                    <p className='text-sm'>Web dibuat oleh <a href="https://ridho.work" className="underline">Ridho Perdana</a></p>
-                </footer>
             </div>
     );
 };