From fa1ad2b37141046977ae1182506c1b30a65687b4 Mon Sep 17 00:00:00 2001
From: hosead6168 <dominique11h@yahoo.com>
Date: Sun, 20 Mar 2022 03:55:47 -0500
Subject: [PATCH] feat(shop): added shop page

---
 src/Pages/Shop/Shop.css | 13 +++++++++++++
 src/Pages/Shop/Shop.jsx | 25 ++++++++++++++++++++-----
 2 files changed, 33 insertions(+), 5 deletions(-)
 create mode 100644 src/Pages/Shop/Shop.css

diff --git a/src/Pages/Shop/Shop.css b/src/Pages/Shop/Shop.css
new file mode 100644
index 00000000..e099c4d1
--- /dev/null
+++ b/src/Pages/Shop/Shop.css
@@ -0,0 +1,13 @@
+.wrapper {
+  padding-top: 130px;
+}
+.shop-container {
+  display: flex;
+  grid-template-columns: 30rem auto;
+  width: 100%;
+}
+
+.sidebar {
+  width: 100%;
+  margin: 0;
+}
diff --git a/src/Pages/Shop/Shop.jsx b/src/Pages/Shop/Shop.jsx
index 35a35e16..0a8eb193 100755
--- a/src/Pages/Shop/Shop.jsx
+++ b/src/Pages/Shop/Shop.jsx
@@ -1,12 +1,27 @@
 import React from 'react';
+import Footer from '../../Components/Footer/Footer';
+import NavBar from '../../Components/NavBar/NavBar';
+// import NavBar from '../../Components/NavBar/NavBar';
+import Products from '../../Components/Product/Products';
+import Sidebar from './Header';
+import './Shop.css';
 
 const Shop = () => {
     return (
-        <div>
-            <iframe title='hoseacodes-store' src='https://teespring.com/stores/hoseacodes-2'>
-            </iframe>
-        </div>
+          <div>
+            {/* <iframe title='hoseacodes-store' src='https://teespring.com/stores/hoseacodes-2'>
+            </iframe> */}
+            <NavBar/>
+            <div className="wrapper">
+              {/* <NavBar/> */}
+              <div className="shop-container">
+                  <Sidebar className="sidebar" />
+                  <Products/>
+              </div>
+            </div>
+            <Footer/>
+          </div>
     )
 }
 
-export default Shop;
\ No newline at end of file
+export default Shop;