Light and Dark mode Colour scheme changes (#360)

added visual improvements to CourseCard, Navbar, ReviewCard and tailwind.config.js

Author: ajzombie123

frontend/src/components/CourseCard/CourseCard.tsx

@@ -19,7 +19,7 @@ export default function CourseCard({
   terms,
 }: CourseCardProps) {
   return (
-    <div className='box-border px-6 py-7 bg-unilectives-card dark:bg-slate-700/40 hover:bg-gray-100 dark:hover:bg-slate-700/10 shadow-lg rounded-xl space-y-2 cursor-pointer duration-150'>
+    <div className='box-border px-6 py-7 bg-unilectives-card dark:bg-slate-700/40 hover:bg-[#eff0f2] dark:hover:bg-slate-700/10 shadow-lg rounded-xl space-y-2 cursor-pointer duration-150'>
       {/* Course courseCode + Ratings */}
       <div className='flex flex-wrap justify-between text-2xl gap-x-4'>
         <h2 className='font-bold w-[8ch] text-black dark:text-white'>

frontend/src/components/Navbar/Navbar.tsx

@@ -67,7 +67,7 @@ export default function Navbar({ userZid }: NavbarProps) {
       ref={ref}
       className={
         collapsed
-          ? "fixed flex flex-col items-center w-20 h-screen gap-4 p-4 duration-150 bg-gray-50 dark:bg-slate-700 z-50 xs:p-2 xs:w-15 xs:gap-2"
+          ? "fixed flex flex-col items-center w-20 h-screen gap-4 p-4 duration-150 bg-gray-100 dark:bg-slate-700 z-50 xs:p-2 xs:w-15 xs:gap-2"
           : "fixed flex flex-col w-72 h-screen gap-4 p-4 bg-gray-50 dark:bg-slate-700 z-40 duration-150"
       }
     >

frontend/src/components/ReviewCard/ReviewCard.tsx

@@ -88,7 +88,7 @@ export default function ReviewCard({
   };
 
   return (
-    <div className='px-10 py-5 space-y-2 shadow-review-card rounded-md bg-white dark:bg-slate-800 dark:shadow-slate-700/90 duration-150 isolate'>
+    <div className='px-10 py-5 space-y-2 shadow-review-card rounded-md bg-[#fafafa] dark:bg-[#273346] dark:shadow-slate-700/90 duration-150 isolate'>
       {/* Title + Date */}
       <div className='flex items-center gap-2 flex-wrap justify-between'>
         <h2 className='font-bold'>{review.title ? review.title : "-"}</h2>

frontend/tailwind.config.js

@@ -25,7 +25,7 @@ module.exports = {
         "unilectives-subheadings": "#989898",
         "unilectives-placeholder": "#606060",
         "unilectives-tags": "#CCEBF6",
-        "unilectives-card": "#FAFAFA",
+        "unilectives-card": "#f6f6f6",
         "unilectives-light-blue": "#84CEE7",
         "unilectives-purple": "#B789E5",
         "unilectives-indigo": "#9BADE8",