From 22af99d7ffacf3e353373acd0ccb4b4c7ba7176c Mon Sep 17 00:00:00 2001
From: Jared He <66887902+jaredjhe@users.noreply.github.com>
Date: Wed, 7 Sep 2022 21:03:13 -0400
Subject: [PATCH] Some code review fixes

---
 components/Timeline.module.css |  2 --
 components/Timeline.tsx        | 19 +++----------------
 2 files changed, 3 insertions(+), 18 deletions(-)

diff --git a/components/Timeline.module.css b/components/Timeline.module.css
index 20f5bee..f3bb6ef 100644
--- a/components/Timeline.module.css
+++ b/components/Timeline.module.css
@@ -1,6 +1,5 @@
 .wrapper {
   position: relative;
-  height: 100%;
 }
 
 .line {
@@ -22,7 +21,6 @@
 
 .timelineSection {
   width: 100%;
-  height: 100%;
   display: flex;
   flex-direction: row;
   justify-content: center;
diff --git a/components/Timeline.tsx b/components/Timeline.tsx
index 89ad303..65e81ac 100644
--- a/components/Timeline.tsx
+++ b/components/Timeline.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React from "react";
 
 import styles from "./Timeline.module.css";
 
@@ -111,30 +111,19 @@ function TimelineSection({
   textWidth,
   gap,
 }: TimelineSectionProps) {
-  const [onHover, setHover] = useState(false);
-
-  const handleMouseEnter = () => {
-    setHover(true);
-  };
-  const handleMouseLeave = () => setHover(false);
-
   return (
     <div className={styles.timelineSection} style={{ gap: gap }}>
       <div
-        className={onHover ? `${styles.time} ${styles.timeHover}` : styles.time}
+        className={styles.time}
         style={{
           width: timeWidth,
           marginLeft: (width - 2 * gap - outerCircleWidth) / 2 - timeWidth,
         }}
-        onMouseEnter={handleMouseEnter}
-        onMouseLeave={handleMouseLeave}
       >
         {isTimeUppercase ? datum.time.toUpperCase() : datum.time}
       </div>
       <div
         className={styles.circle}
-        onMouseEnter={handleMouseEnter}
-        onMouseLeave={handleMouseLeave}
         style={{
           width: outerCircleWidth,
           height: outerCircleWidth,
@@ -151,13 +140,11 @@ function TimelineSection({
         />
       </div>
       <div
-        className={onHover ? `${styles.text} ${styles.textHover}` : styles.text}
+        className={styles.text}
         style={{
           width: textWidth,
           marginRight: (width - 2 * gap - outerCircleWidth) / 2 - textWidth,
         }}
-        onMouseEnter={handleMouseEnter}
-        onMouseLeave={handleMouseLeave}
       >
         {datum.text}
       </div>