From 0d8fce9100abea10b53af0bd786911af5a5f2d0f Mon Sep 17 00:00:00 2001
From: Rowan Molony <rowanmolony@gmail.com>
Date: Tue, 7 Feb 2023 12:39:42 +0000
Subject: [PATCH] Prevent overflow into dates (#245)

Previously "MAI in Mechanical Engineering" would overflow
into "2014 - 2019" at certain resolutions (iPads) as the
'time' <div> is not separated from <h3> or 'degree'.
Now they are in separate containers using the 'flex'
css attribute to in the parent <div> and in both elements
to keep them in two columns
---
 _sass/_base.scss | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/_sass/_base.scss b/_sass/_base.scss
index 870b3a4..1887447 100644
--- a/_sass/_base.scss
+++ b/_sass/_base.scss
@@ -186,6 +186,7 @@ p {
     position: relative;
     overflow: hidden;
     margin-bottom: 2px;
+    display: flex;
   }
   .job-title,
   .degree {
@@ -194,12 +195,14 @@ p {
     margin-top: 0;
     margin-bottom: 0;
     font-weight: 500;
+    flex: 75%;
   }
   .time {
     position: absolute;
     right: 0;
     top: 0;
     color: $text-grey;
+    flex: 25%;
   }
   .company,
   .university {