From bc7de92f2da56f1481adfc10870fb3738b088155 Mon Sep 17 00:00:00 2001
From: Jared He <66887902+jaredjhe@users.noreply.github.com>
Date: Sun, 2 Oct 2022 14:20:15 -0400
Subject: [PATCH] Fix Sections

---
 components/Sections.module.css | 2 +-
 components/Sections.tsx        | 4 ++++
 components/Timeline.module.css | 4 ++--
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/components/Sections.module.css b/components/Sections.module.css
index 575dc97..2951cad 100644
--- a/components/Sections.module.css
+++ b/components/Sections.module.css
@@ -11,7 +11,7 @@
 }
 
 .separator {
-  flex: 1;
+  flex: 2;
   background-color: var(--label);
   height: calc(1rem / 16);
   width: 100%;
diff --git a/components/Sections.tsx b/components/Sections.tsx
index d09a0ff..8ba08b1 100644
--- a/components/Sections.tsx
+++ b/components/Sections.tsx
@@ -10,6 +10,8 @@ interface SectionsData {
 interface SectionsProps {
   /* Whether to display the "Sections" title and separator that appears on the left. */
   showHeader?: boolean;
+  /* Width of the entire Sections, in px. */
+  width?: number;
   data: SectionsData[];
   className?: string;
 }
@@ -17,6 +19,7 @@ interface SectionsProps {
 export function Sections({
   data,
   showHeader = true,
+  width = 800,
   className,
 }: SectionsProps) {
   return (
@@ -24,6 +27,7 @@ export function Sections({
       className={
         className ? `${className} ${styles.sections}` : `${styles.sections}`
       }
+      style={{ width: width }}
     >
       {showHeader ? (
         <>
diff --git a/components/Timeline.module.css b/components/Timeline.module.css
index cdd9be9..6672159 100644
--- a/components/Timeline.module.css
+++ b/components/Timeline.module.css
@@ -15,7 +15,7 @@
   display: flex;
   flex-direction: column;
   justify-content: space-around;
-  align-items: end;
+  align-items: flex-end;
   gap: calc(20rem / 16);
 }
 
@@ -23,7 +23,7 @@
   width: 100%;
   display: flex;
   flex-direction: row;
-  justify-content: end;
+  justify-content: flex-end;
 }
 
 .time {