From 4ccb42f35faaed15ca1d55f239d7f6c20b7ae1c5 Mon Sep 17 00:00:00 2001
From: Arshnoorkc13 <akchadha@umass.edu>
Date: Thu, 6 Jun 2024 13:23:45 -0400
Subject: [PATCH] styling fixed for dropBoxLocations

---
 client/src/pages/ballotInfo/index.tsx       |  3 --
 client/src/pages/dropBoxLocations/index.tsx | 33 ++++++++++++++++-----
 2 files changed, 25 insertions(+), 11 deletions(-)

diff --git a/client/src/pages/ballotInfo/index.tsx b/client/src/pages/ballotInfo/index.tsx
index 35a910c29..ae604c85e 100644
--- a/client/src/pages/ballotInfo/index.tsx
+++ b/client/src/pages/ballotInfo/index.tsx
@@ -48,7 +48,6 @@ export default function BallotInfo() {
                             <h1 className='font-semibold'>155 days</h1>
                         </div>
                     </div>
-
                     <div className="space-y-4 w-full px-4">
                         <div className='flex justify-between items-center'>
                             <h1 className='text-xl text-gray-600'> Municipal Election</h1>
@@ -62,9 +61,7 @@ export default function BallotInfo() {
                         </div>
                     </div>
                 </div>
-
                 <div className='md:col-span-1 hidden md:block'>
-
                 </div>
             </div>
 
diff --git a/client/src/pages/dropBoxLocations/index.tsx b/client/src/pages/dropBoxLocations/index.tsx
index d169a74e4..a3acdcf46 100644
--- a/client/src/pages/dropBoxLocations/index.tsx
+++ b/client/src/pages/dropBoxLocations/index.tsx
@@ -29,14 +29,31 @@ export default function DropBoxLocations() {
                 <Box component="img"  alt="Map" src="/Map.png"/>
             </div>
 
-            <div className='flex flex-col justify-center items-center p-2' >
-            <Box sx={{ backgroundColor: 'gray.200', padding: 4, borderRadius: 2 }}>
-
-                    <p className='px-40 py-40 bg-gray-200 rounded-lg'>
-                        <strong>Ballot Dropbox:</strong>
-                        149 Dudley
-                    </p>
-                    </Box>
+            <div className='grid grid-cols-4'>
+                <div className='md:col-span-1 hidden md:block'>
+                </div>
+                <div className="space-y-8 mx-10 my-8 p-8 rounded-2xl shadow-2xl border border-gray-200  col-span-4 lg:col-span-2 bg-white">
+                    <div className="space-y-4 w-full px-4">
+                        <div className='flex justify-between items-center'>
+                            <h1 className='text-2xl text-black-600 font-semibold'>BALLOT DROPBOX: ROXBURY BRANCH LIBRARY</h1>
+                        </div>
+                        <div className="border-b border-gray-300"></div> {/* Line between rows */}
+                        <div className="flex justify-between items-center">
+                            <h1 className='text-gray-600 font-semibold'>149 Dudley St., Roxbury, MA 02119</h1>
+                        </div>
+                    </div>
+                    <div className="space-y-4 w-full px-4">
+                        <div className='flex justify-between items-center'>
+                            <h1 className='text-xl text-black-600 font-semibold'>Hours</h1>
+                        </div>
+                        <div className="border-b border-gray-300"></div> 
+                        <div className="flex justify-between items-center">
+                            <h1 className='text-gray-600 font-semibold'>Available every day all day before 8 P.M. on election day</h1>
+                        </div>
+                    </div>
+                </div>
+                <div className='md:col-span-1 hidden md:block'>
+                </div>
             </div>
 
             <div className='flex flex-col justify-center items-center p-4 my-10'>