From e549beedbe365d39845979141f75ca9a2a85d2d0 Mon Sep 17 00:00:00 2001
From: Lynette Okoth <lynokoth79@gmail.com>
Date: Fri, 26 Jan 2024 21:21:35 -0500
Subject: [PATCH] Update Header.jsx

---
 src/Components/Header/Header.jsx | 49 ++++++++++++++++++++++++++++++++
 1 file changed, 49 insertions(+)

diff --git a/src/Components/Header/Header.jsx b/src/Components/Header/Header.jsx
index e69de29..6737230 100644
--- a/src/Components/Header/Header.jsx
+++ b/src/Components/Header/Header.jsx
@@ -0,0 +1,49 @@
+import React from 'react'
+import './Header.css'
+import BlockRevealAnimation from 'react-block-reveal-animation';
+import { images, headerData } from '../../constants';
+import { Link } from 'react-router-dom';
+
+
+
+
+ // put in header-container div when page is ready
+const Header = () => {
+ 
+  return ( 
+    <header>
+        
+        <div className="app__header-data">
+            <BlockRevealAnimation color="#F4CE14">
+                <h1>
+                    {headerData.title}
+                </h1>
+            </BlockRevealAnimation>
+            <BlockRevealAnimation color='#EDEFEE'>
+                <h3>
+                    {headerData.location}
+                </h3>
+                <p>
+                   {headerData.description}
+                </p>
+            </BlockRevealAnimation>
+            <BlockRevealAnimation color="#F4CE14">
+                <Link to= "/reservations">
+                <button>
+                    {headerData.btnName}
+                </button>
+                </Link>
+            </BlockRevealAnimation>
+            
+        </div>
+        <BlockRevealAnimation color='#333333'>
+      
+                <div 
+                    className="app__header-image"
+                    style={{backgroundImage:`url(${images.restaurantFood})`}}
+                />
+      
+        </BlockRevealAnimation>
+    </header> );
+}
+export default Header; 
\ No newline at end of file