fix accepted review coloring

cornell-dti · Oct 23, 2023 · 2351d90 · 2351d90
1 parent 7f7ff65
commit 2351d90
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 6 deletions.
diff --git a/client/src/modules/Course/Components/ReviewCard.tsx b/client/src/modules/Course/Components/ReviewCard.tsx
@@ -174,25 +174,55 @@ export default function ReviewCard({
           <div
             className={styles.ratingsContainer + ' ' + ratings_container_color}
           >
-            <div className={styles.ratingElem}>
+            <div
+              className={
+                review.visible
+                  ? styles.ratingElem + ' ' + styles.ratingElemColor
+                  : styles.ratingElem
+              }
+            >
               <span>Overall{windowWidth <= 480 ? ':' : ''}</span>
-              <span className={styles.ratingNum}>
+              <span className={styles.ratingNum + ' ' + styles.ratingElemColor}>
                 {_review.rating ? _review.rating : '-'}
               </span>
               {windowWidth <= 480 ? (
-                <div className={styles.divider}></div>
+                <div
+                  className={
+                    review.visible
+                      ? styles.divider + ' ' + styles.acceptedReviewDividerColor
+                      : styles.divider
+                  }
+                ></div>
               ) : null}
             </div>
-            <div className={styles.ratingElem}>
+            <div
+              className={
+                review.visible
+                  ? styles.ratingElem + ' ' + styles.ratingElemColor
+                  : styles.ratingElem
+              }
+            >
               <span>Difficulty{windowWidth <= 480 ? ':' : ''}</span>
               <span className={styles.ratingNum}>
                 {_review.difficulty ? _review.difficulty : '-'}
               </span>
               {windowWidth <= 480 ? (
-                <div className={styles.divider}></div>
+                <div
+                  className={
+                    review.visible
+                      ? styles.divider + ' ' + styles.acceptedReviewDividerColor
+                      : styles.divider
+                  }
+                ></div>
               ) : null}
             </div>
-            <div className={styles.ratingElem}>
+            <div
+              className={
+                review.visible
+                  ? styles.ratingElem + ' ' + styles.ratingElemColor
+                  : styles.ratingElem
+              }
+            >
               <span>Workload{windowWidth <= 480 ? ':' : ''}</span>
               <span className={styles.ratingNum}>
                 {_review.workload ? _review.workload : '-'}

diff --git a/client/src/modules/Course/Styles/Review.module.css b/client/src/modules/Course/Styles/Review.module.css
@@ -199,6 +199,10 @@
     margin-left: 0;
   }
 
+  .ratingElemColor {
+    color: #4d8dd8;
+  }
+
   .divider {
     display: inline;
     content: '';
@@ -208,6 +212,10 @@
     left: 0.5rem;
   }
 
+  .acceptedReviewDividerColor {
+    border-left: 1px solid #4d8dd8;
+  }
+
   .ratingNum {
     float: none;
     margin-left: 0.2rem;
@@ -243,4 +251,8 @@
     margin-right: 2px;
     margin-top: 2px;
   }
+
+  .courseTitle {
+    color: #0076ff;
+  }
 }