Merge pull request #41 from ami-day/moving-text-on-components

fixed-content
ami-day · Oct 25, 2023 · bf9da6d · bf9da6d
2 parents 0a94eea + 89c36b6
commit bf9da6d
Show file tree

Hide file tree

Showing 5 changed files with 46 additions and 8 deletions.
diff --git a/frontend/src/components/upcomingevents/BookLabel.js b/frontend/src/components/upcomingevents/BookLabel.js
@@ -45,13 +45,13 @@ const BookLabel = ({ session }) => {
         {session ? (
           <div>
             <div>
-              <h3>Title: {bookIdToTitle(session.chosen_book)}</h3>
+              <h3 className="sessions-font">Title: {bookIdToTitle(session.chosen_book)}</h3>
             </div>
             <div>
-              <h3>Author: {bookIdToAuthors(session.chosen_book)}</h3>
+              <h3 className="sessions-font">Author: {bookIdToAuthors(session.chosen_book)}</h3>
             </div>
             <div>
-              <h3>
+              <h3 className="sessions-font">
                 Year Published: {bookIdToYearPublished(session.chosen_book)}
               </h3>
             </div>

diff --git a/frontend/src/components/upcomingevents/SessionLabel.js b/frontend/src/components/upcomingevents/SessionLabel.js
@@ -7,9 +7,9 @@ const SessionLabel = ({ session, membersAttending }) => {
       <div className="upcoming-session-information">
         {session ? (
           <div>
-            <h3>Date: {session.date}</h3>
-            <h3>Location: {session.location}</h3>
-            <div className="members-attending">
+            <h3 className="sessions-font">Date: {session.date}</h3>
+            <h3 className="sessions-font">Location: {session.location}</h3>
+            <div className="members-attending sessions-font">
               Members Attending: {membersAttending}
             </div>
           </div>

diff --git a/frontend/src/components/upcomingevents/booklabel.css b/frontend/src/components/upcomingevents/booklabel.css
@@ -3,7 +3,7 @@
     width: 451px;
   }
 
-  .label .how-innovation-works {
+.label .how-innovation-works {
     color: #000000;
     font-family: "Roboto-Bold", Helvetica;
     font-size: 25px;
@@ -13,4 +13,24 @@
     width: 451px;
   }
 
+.sessions-font {
+
+    color: #000000;
+    font-family: "Roboto-Bold", Helvetica;
+    font-size: 12px;
+    font-weight: 700;
+    letter-spacing: 0.7px;
+    margin-left: 40px;
+    margin-top: 60px;
+    width: 200px;
+
+  }
+
+.upcoming-bookclub-book-information {
+
+  text-align: center;
+  display: grid;
+  align-items: center;
+
+}
 
diff --git a/frontend/src/components/upcomingevents/box.css b/frontend/src/components/upcomingevents/box.css
@@ -1,6 +1,8 @@
 .box {
     height: 293px;
     width: 586px;
+    display: grid;
+    align-items: center;
   }
 
   .box .book-information {
@@ -9,4 +11,7 @@
     position: fixed;
     top: 0;
     width: 586px;
+    display: grid;
+    align-items: center;
+    justify-content: center;
   }
diff --git a/frontend/src/components/upcomingevents/sessionlabel.css b/frontend/src/components/upcomingevents/sessionlabel.css
@@ -12,4 +12,17 @@
     line-height: 52.5px;
     width: 472px;
   }
-
+
+
+  .sessions-font {
+
+    color: #000000;
+    font-family: "Roboto-Bold", Helvetica;
+    font-size: 12px;
+    font-weight: 700;
+    letter-spacing: 0.7px;
+    margin-left: 40px;
+    margin-top: 60px;
+    width: 200px;
+
+  }