was able to add finishing touches

MohamedSy1 · Jan 18, 2024 · a551c5e · a551c5e
1 parent 3b8daf9
commit a551c5e
Show file tree

Hide file tree

Showing 6 changed files with 10 additions and 10 deletions.
diff --git a/dist/assets/index-1F52huS-.css b/dist/assets/index-1F52huS-.css
diff --git a/dist/assets/index-fM3KFmLP.js → dist/assets/index-P6m5uj3x.js b/dist/assets/index-fM3KFmLP.js → dist/assets/index-P6m5uj3x.js
diff --git a/dist/assets/index-czmACNtB.css b/dist/assets/index-czmACNtB.css
diff --git a/dist/index.html b/dist/index.html
@@ -4,8 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Gentrification</title>
-    <script type="module" crossorigin src="/gentrification-project/assets/index-fM3KFmLP.js"></script>
-    <link rel="stylesheet" crossorigin href="/gentrification-project/assets/index-czmACNtB.css">
+    <script type="module" crossorigin src="/gentrification-project/assets/index-P6m5uj3x.js"></script>
+    <link rel="stylesheet" crossorigin href="/gentrification-project/assets/index-1F52huS-.css">
   </head>
   <body>
     <div id="root"></div>

diff --git a/src/front-end/component/container1.jsx b/src/front-end/component/container1.jsx
@@ -1,23 +1,23 @@
 import React from "react";
 import picture from "../assets/picture.png"
 
-const SectionHeader = ({ title, children }) => {
+const SectionHeader = ({ title, children, picture }) => {
     return (
         <section className="w-full bg-black relative h-[55rem]">
-            <div className="flex w-full">
+            <div className="flex justify-between w-full">
                 <header className="text-white text-[90px] font-serif p-[10rem] pb-[20px]">
                     <h1>{title}</h1>
                 </header>
                 <div className="text-white text-wrap text-balance p-4 pt-[20rem] w-65">
                     {children}
                 </div>
             </div>
-            <div className="pt-[5rem] pl-[90rem] flex">
-                <img className="size-[20rem] rounded-full" src={picture}/>
+            <div className="absolute top-1/2 left-0 transform -translate-y-1/2 pl-[5rem]">
+                <img className="w-[15rem] h-[15rem] rounded-full" src={picture} />
             </div>
         </section>
     )
- }
+}
 
  const Container1 = () => {
     return (

diff --git a/src/front-end/pages/Home.jsx b/src/front-end/pages/Home.jsx
@@ -44,7 +44,7 @@ function HomePage() {
         <div>
             <Navbar/>
             <Container1/>
-            {/* <img className="w-[10rem] absolute" src={color} alt="color description"/> */}
+            <img className="pt-[25rem] absolute" src={color} alt="color description"/>
             <section>
                 <MapContainer className='flex flex-row justify-center' center={[40.73061, -73.935242]} zoom={11} scrollWheelZoom={false}>
                     <TileLayer