From 2562e65d6603ab22fefb8f473443178a1a36ec71 Mon Sep 17 00:00:00 2001
From: Sriram Hariharan <sghsri@gmail.com>
Date: Wed, 8 Mar 2023 00:41:04 -0600
Subject: [PATCH] some styling

---
 src/background/handler/courseDataHandler.ts        |  2 +-
 src/views/components/common/Link/Link.tsx          |  1 +
 .../CourseDescription.module.scss                  |  2 ++
 .../CoursePopup/CourseHeader/CourseHeader.tsx      |  3 +--
 .../GradeDistribution/GradeDistribution.tsx        | 14 ++++++++++++--
 5 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/background/handler/courseDataHandler.ts b/src/background/handler/courseDataHandler.ts
index 0df33563..88100456 100644
--- a/src/background/handler/courseDataHandler.ts
+++ b/src/background/handler/courseDataHandler.ts
@@ -5,7 +5,7 @@ const courseDataHandler: MessageHandler<CourseDataMessages> = {
     getDistribution({ data, sendResponse }) {
         const { course } = data;
 
-        const dummyData = Array.from({ length: 18 }, () => Math.floor(Math.random() * 100));
+        const dummyData = Array.from({ length: 12 }, () => Math.floor(Math.random() * 100));
 
         sendResponse(dummyData);
     },
diff --git a/src/views/components/common/Link/Link.tsx b/src/views/components/common/Link/Link.tsx
index 6a4a9770..d0d49aaf 100644
--- a/src/views/components/common/Link/Link.tsx
+++ b/src/views/components/common/Link/Link.tsx
@@ -25,6 +25,7 @@ export default function Link(props: PropsWithChildren<Props>) {
 
     return (
         <Text
+            color='bluebonnet'
             {...passedProps}
             className={classNames(
                 styles.link,
diff --git a/src/views/components/injected/CoursePopup/CourseDescription/CourseDescription.module.scss b/src/views/components/injected/CoursePopup/CourseDescription/CourseDescription.module.scss
index 1e1ab5da..b560a21a 100644
--- a/src/views/components/injected/CoursePopup/CourseDescription/CourseDescription.module.scss
+++ b/src/views/components/injected/CoursePopup/CourseDescription/CourseDescription.module.scss
@@ -8,6 +8,8 @@
         list-style-type: disc;
         margin: 0px;
         padding-left: 20px;
+        max-height: 200px;
+        overflow-y: auto;
 
         li {
             padding: 0px 4px 4px;
diff --git a/src/views/components/injected/CoursePopup/CourseHeader/CourseHeader.tsx b/src/views/components/injected/CoursePopup/CourseHeader/CourseHeader.tsx
index be51e270..7916437b 100644
--- a/src/views/components/injected/CoursePopup/CourseHeader/CourseHeader.tsx
+++ b/src/views/components/injected/CoursePopup/CourseHeader/CourseHeader.tsx
@@ -52,7 +52,7 @@ export default function CourseHeader({ course, onClose }: Props) {
                     return (
                         <>
                             {numInstructors > 1 && index === course.instructors.length - 1 ? '& ' : ''}
-                            <Link key={name} span size='medium' weight='semi_bold' color='bluebonnet' url={url}>
+                            <Link key={name} span size='medium' weight='normal' url={url}>
                                 {name}
                             </Link>
                             {numInstructors > 2 && !isLast ? ', ' : ''}
@@ -81,7 +81,6 @@ export default function CourseHeader({ course, onClose }: Props) {
                         span
                         size='medium'
                         weight='normal'
-                        color='bluebonnet'
                         url={getBuildingUrl(meeting.location?.building)}
                         disabled={!meeting.location?.building}
                     >
diff --git a/src/views/components/injected/CoursePopup/GradeDistribution/GradeDistribution.tsx b/src/views/components/injected/CoursePopup/GradeDistribution/GradeDistribution.tsx
index f69f08f7..1154a32c 100644
--- a/src/views/components/injected/CoursePopup/GradeDistribution/GradeDistribution.tsx
+++ b/src/views/components/injected/CoursePopup/GradeDistribution/GradeDistribution.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable no-nested-ternary */
 import React, { useEffect, useState } from 'react';
 import HighchartsReact from 'highcharts-react-official';
 import Highcharts from 'highcharts';
@@ -73,7 +74,7 @@ export default function GradeDistribution({ course }: Props) {
             {
                 type: 'column',
                 name: 'Grades',
-                data: [],
+                data: Array.from({ length: 12 }, () => 0),
             },
         ],
     });
@@ -96,7 +97,16 @@ export default function GradeDistribution({ course }: Props) {
                             // eslint-disable-next-line no-nested-ternary
                             // color: i < 8 ? '#2ECC71' : i < 10 ? '#F1C40F' : '#E74C3C',
                             // eslint-disable-next-line no-nested-ternary
-                            color: i < 8 ? colors.cactus : i < 10 ? colors.sunshine : colors.speedway_brick,
+                            color:
+                                i < 3
+                                    ? colors.turtle_pond
+                                    : i < 5
+                                    ? colors.cactus
+                                    : i < 7
+                                    ? colors.sunshine
+                                    : i < 10
+                                    ? colors.tangerine
+                                    : colors.speedway_brick,
                         })),
                     },
                 ],