From 4da1a4e7f34de622c8fdf89eda839964091af1db Mon Sep 17 00:00:00 2001
From: Cos <77969841+cos-glitch@users.noreply.github.com>
Date: Tue, 3 Sep 2024 00:40:09 +0200
Subject: [PATCH] migrated layout grid -> flex

---
 aboutme.html | 34 ++++++++++++++++++++++++++--------
 styles.css   | 24 ++++++++++++++++++------
 2 files changed, 44 insertions(+), 14 deletions(-)

diff --git a/aboutme.html b/aboutme.html
index f9d5da0..a548cb5 100644
--- a/aboutme.html
+++ b/aboutme.html
@@ -120,19 +120,37 @@ <h3>Languages:</h3>
         
         
         <div class="layout-div2">
-            <h2> About Me: </h2>
-            
-            <p>I'm a BSc Computer Science graduate with First Class Honours from Swansea University, equipped with a strong foundation in logic, ML, and software development.</p>
-
-            <p>In my final year of university I wrote my dissertation titled "Machine Learning Assessment of Novel Biomarkers for Aggressive Prostate Cancer," which earned a 95% score. This project highlights my proficiency in applying ML to real-world healthcare challenges, a field I'm deeply passionate about.</p>
+            <div class="layout-div2-inner">
+                <h2> About Me: </h2>
                 
-            <p>I have developed skills in Python, SQL, and Git, and I'm continually expanding my knowledge in ML, as well as medicine, through both academic and personal projects. My goal is to use these skills to innovate within the healthcare industry, using ML to advance medical research and improve patient outcomes.</p>
+                <p>I'm a BSc Computer Science graduate with First Class Honours from Swansea University, equipped with a strong foundation in logic, ML, and software development.</p>
+
+                <p>In my final year of university I wrote my dissertation titled "Machine Learning Assessment of Novel Biomarkers for Aggressive Prostate Cancer," which earned a 95% score. This project highlights my proficiency in applying ML to real-world healthcare challenges, a field I'm deeply passionate about.</p>
+                    
+                <p>I have developed skills in Python, SQL, and Git, and I'm continually expanding my knowledge in ML, as well as medicine, through both academic and personal projects. My goal is to use these skills to innovate within the healthcare industry, using ML to advance medical research and improve patient outcomes.</p>
+            </div>
+
+            <div class="layout-div2-inner">
+                <h2>Education:</h2>
 
+                <p style="font-size: 24px; margin-bottom: 5px;">Swansea University 2021 - 2024</p>
+
+                <p class="italics" style="margin-top: 5px;">First Class Honours BSc in Computer Science</p>
+
+                <p>Course Highlights:</p>
+                <ul>
+                    <li>Dissertation project: 95%: <p style="font-style: italic;"> Data Science, Medical Data, ML prediction, Excel, Prostate Cancer grading, Python + Libraries</p></li>
+                    <li>Algorithms: 77%: <p style="font-style: italic;"> Data structures, Algorithms, Complexities</p></li>
+                    <li>Database Systems: 74%: <p style="font-style: italic;"> MySQL, Relational databases, ACID properties</p></li>
+                    <li>Big Data & Machine Learning: 69%: <p style="font-style: italic;">Big Data handling, ML algorithms, Pipelines, ETL, Python, SciKit, Feature selection, Analysis</p></li>
+                    <li>Logic for Computer Science: 87%: <p style="font-style: italic;">Propositional, Normal Forms, Natural Deduction, Predicate, Gödel</p></li>
+                </ul>
+            </div>
         </div>
     
         
         
-        <div class="layout-div2">
+        <!-- <div class="layout-div2">
             <h2>Education:</h2>
 
             <p style="font-size: 24px; margin-bottom: 5px;">Swansea University 2021 - 2024</p>
@@ -147,7 +165,7 @@ <h2>Education:</h2>
                 <li>Big Data & Machine Learning: 69%: <p style="font-style: italic;">Big Data handling, ML algorithms, Pipelines, ETL, Python, SciKit, Feature selection, Analysis</p></li>
                 <li>Logic for Computer Science: 87%: <p style="font-style: italic;">Propositional, Normal Forms, Natural Deduction, Predicate, Gödel</p></li>
             </ul>
-        </div>
+        </div> -->
         
     </div>
 
diff --git a/styles.css b/styles.css
index e72223a..1fb4ae6 100644
--- a/styles.css
+++ b/styles.css
@@ -92,17 +92,19 @@ h3 {
 /* Layout */
 
 .layout-container {
-    display: grid;
-    grid-template-columns: 1fr 2fr;
+    /* display: grid; */
+    display: flex;
+    /* grid-template-columns: 1fr 2fr; */
     margin-top: 25px;
     gap: 20px;
 }
 
 .layout-div1 {
+    flex: 1;
     width: auto;
     max-width: fit-content;
     position: relative;
-    grid-column: 1/2;
+    /* grid-column: 1/2; */
     padding: 10px;
     background-color: #fff;
     /* padding: 20px; */
@@ -111,19 +113,29 @@ h3 {
 }
 
 .layout-div2 {
+    display: flex;
+    flex: 2;
+    flex-direction: column;
     width: auto;
     max-width: 600px;
     height: auto;
-    grid-column: 2/3;
-    position: relative;
+    /* grid-column: 2/3; */
+    /* position: relative; */
     padding: 20px;
     padding-right: 20px;
     background-color: #fff;
-    /* padding: 20px; */
     border-radius: 10px;
     /* box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); */
 }
 
+.layout-div2-inner {
+    padding: 20px;
+    padding-right: 20px;
+    background-color: #fff;
+    border-radius: 10px;
+    
+}
+
 /* .layout-div1 h2,
 .layout-div2 h2 {
     position: absolute;