fix: responsiveness (#274)

leowrites · Dec 7, 2023 · f93c349 · f93c349
1 parent f9d81a9
commit f93c349
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/P3/frontend/src/components/review/Review.jsx b/P3/frontend/src/components/review/Review.jsx
@@ -15,9 +15,9 @@ const Review = ({ review }) => {
 
     return (
         <div class="review py-4 flex flex-row items-start gap-4">
-            <Avatar src={reviewUser?.avatar === null ? '/logo.svg' : reviewUser?.avatar} alt="profile" className="w-16 h-16" />
-            <div className="w-full">
-                <div class="flex flex-row justify-between">
+            <Avatar src={reviewUser?.avatar === null ? '/logo.svg' : reviewUser?.avatar} alt="profile" className="size-16" />
+            <div className="w-10/12">
+                <div class="flex flex-col xl:flex-row justify-between">
                     <p class="text-md font-semibold">{reviewUser?.username}</p>
                     <p class="text-md font-semibold text-[#ff9447]">{(new Date(review.date_created)).toLocaleTimeString('en-US', {
                         year: "numeric",

diff --git a/P3/frontend/src/pages/ShelterDetail.js b/P3/frontend/src/pages/ShelterDetail.js
@@ -175,7 +175,7 @@ const ShelterDetail = () => {
                 </div>
                 </Container> 
             )}
-            <Container className="px-12 py-8">
+            <Container className="px-4 md:px-12 py-8">
                 <div className="flex flex-row justify-between items-center">
                     <Heading><h1 class="mt-0 text-[1.75rem] font-semibold mb-4">Reviews</h1></Heading>
                     {