Round corners around scrolbar

pennlabs · Feb 13, 2024 · 3f8b417 · 3f8b417
1 parent e495c55
commit 3f8b417
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 964 deletions.
diff --git a/frontend/degree-plan/components/Infobox/CourseInfo.js b/frontend/degree-plan/components/Infobox/CourseInfo.js
@@ -1,7 +1,6 @@
 import React from "react";
 import reactStringReplace from "react-string-replace";
 import styled from "styled-components";
-import './base.module.css';
 
 import { CourseDetails } from "./common/CourseDetails";
 import { Popover, PopoverTitle } from "./common/Popover";
@@ -220,50 +219,6 @@ export const CourseHeader = ({
 
       {!data?.last_offered_sem_if_superceded && (
         <span className="float-right">
-          {inCourseCart ? (
-            <span
-              onClick={handleRemove}
-              className="courseCart btn btn-action"
-              title="Remove from Cart"
-            >
-              <i className="fa fa-fw fa-trash-alt" />
-            </span>
-          ) : (
-            <Popover
-              button={
-                <span className="courseCart btn btn-action" title="Add to Cart">
-                  <i className="fa fa-fw fa-cart-plus" />
-                </span>
-              }
-            >
-              <div className="popover-title">Add to Cart</div>
-              <div
-                className="popover-content"
-                style={{ maxHeight: 400, overflowY: "auto" }}
-              >
-                <div id="divList">
-                  <ul className="professorList">
-                    <li>
-                      <button onClick={() => handleAdd("average")}>
-                        Average Professor
-                      </button>
-                    </li>
-                    {Object.keys(instructors)
-                      .sort((a, b) =>
-                        instructors[a].name.localeCompare(instructors[b].name)
-                      )
-                      .map(key => (
-                        <li key={key}>
-                          <button onClick={() => handleAdd(key)}>
-                            {instructors[key].name}
-                          </button>
-                        </li>
-                      ))}
-                  </ul>
-                </div>
-              </div>
-            </Popover>
-          )}{" "}
           <a
             target="_blank"
             rel="noopener noreferrer"

diff --git a/frontend/degree-plan/components/Infobox/InfoRatings.js b/frontend/degree-plan/components/Infobox/InfoRatings.js
@@ -1,5 +1,4 @@
 import React from "react";
-import './base.module.css';
 
 /**
  * Three colored boxes with numerical rating values, used in the course description box.

diff --git a/frontend/degree-plan/components/Infobox/ReviewPanel.tsx b/frontend/degree-plan/components/Infobox/ReviewPanel.tsx
@@ -10,16 +10,21 @@ interface ReviewPanelProps {
     currentSemester?: string;
 }
 
-const ReviewPanelContainer = styled.div`
+const ReviewPanelWrapper = styled.div`
     position: absolute;
     z-index: 100;
-    background-color: white;
+    height: 80vh;
+    width: 25rem;
+    overflow: hidden;
+    box-shadow: 0px 0px 10px 6px rgba(0, 0, 0, 0.05);
     border-radius: 10px;
-    width: 30rem;
-    padding: 1rem;
-    max-height: 80vh;
+`
+
+const ReviewPanelContainer = styled.div`
+    background-color: white;
+    padding: .5rem;
     overflow: auto;
-    box-shadow: 0px 0px 10px 6px rgba(0, 0, 0, 0.05);
+    height: 100%;
 `
 
 const ReviewPanel = ({ full_code, currentSemester }: ReviewPanelProps) => {
@@ -37,15 +42,17 @@ const ReviewPanel = ({ full_code, currentSemester }: ReviewPanelProps) => {
 
     return (
         <Draggable hidden={!!data}>
-            <ReviewPanelContainer>
-                {data ?
-                    <InfoBox
-                        data={data}
-                        liveData={liveData}
-                        style={{ position: 'absolute'}}
-                    />
-                    : <div></div>}
-            </ReviewPanelContainer>
+            <ReviewPanelWrapper>
+                <ReviewPanelContainer>
+                    {data ?
+                        <InfoBox
+                            data={data}
+                            liveData={liveData}
+                            style={{ position: 'absolute'}}
+                        />
+                        : <div></div>}
+                </ReviewPanelContainer>
+            </ReviewPanelWrapper>
         </Draggable>
     )
 }