From 9ab6bb51ad9e0330b5b2f3412ac2f1b27a008a09 Mon Sep 17 00:00:00 2001
From: john <me@johnbotr.is>
Date: Tue, 7 May 2024 17:08:02 +0200
Subject: [PATCH] add stufgf

---
 README.md                    |  2 +-
 assets/icon-academic-cap.svg |  5 +++++
 assets/icon-briefcase.svg    |  4 ++++
 assets/icon-user.svg         |  3 +++
 cv.html                      | 16 ++++++++++++----
 styles/style.css             | 26 ++++++++++++++++++++------
 6 files changed, 45 insertions(+), 11 deletions(-)
 create mode 100644 assets/icon-academic-cap.svg
 create mode 100644 assets/icon-briefcase.svg
 create mode 100644 assets/icon-user.svg

diff --git a/README.md b/README.md
index a2c330a..a8e391c 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,7 @@
 # My CV Repo
 
 ## Icons
-Im using some heroicons icons
+Im using some [heroicons](https://heroicons.dev/) icons (or [alternatively](https://heroicons.com/))
 
 ## Original Resume PDF
 I was originally using [resume.io](https://resume.io) to maintain my resume (login with a magic link.), if you ever need to get back to it
diff --git a/assets/icon-academic-cap.svg b/assets/icon-academic-cap.svg
new file mode 100644
index 0000000..dbc882e
--- /dev/null
+++ b/assets/icon-academic-cap.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
+    <path d="M11.7 2.805a.75.75 0 0 1 .6 0A60.65 60.65 0 0 1 22.83 8.72a.75.75 0 0 1-.231 1.337 49.948 49.948 0 0 0-9.902 3.912l-.003.002c-.114.06-.227.119-.34.18a.75.75 0 0 1-.707 0A50.88 50.88 0 0 0 7.5 12.173v-.224c0-.131.067-.248.172-.311a54.615 54.615 0 0 1 4.653-2.52.75.75 0 0 0-.65-1.352 56.123 56.123 0 0 0-4.78 2.589 1.858 1.858 0 0 0-.859 1.228 49.803 49.803 0 0 0-4.634-1.527.75.75 0 0 1-.231-1.337A60.653 60.653 0 0 1 11.7 2.805Z" />
+    <path d="M13.06 15.473a48.45 48.45 0 0 1 7.666-3.282c.134 1.414.22 2.843.255 4.284a.75.75 0 0 1-.46.711 47.87 47.87 0 0 0-8.105 4.342.75.75 0 0 1-.832 0 47.87 47.87 0 0 0-8.104-4.342.75.75 0 0 1-.461-.71c.035-1.442.121-2.87.255-4.286.921.304 1.83.634 2.726.99v1.27a1.5 1.5 0 0 0-.14 2.508c-.09.38-.222.753-.397 1.11.452.213.901.434 1.346.66a6.727 6.727 0 0 0 .551-1.607 1.5 1.5 0 0 0 .14-2.67v-.645a48.549 48.549 0 0 1 3.44 1.667 2.25 2.25 0 0 0 2.12 0Z" />
+    <path d="M4.462 19.462c.42-.419.753-.89 1-1.395.453.214.902.435 1.347.662a6.742 6.742 0 0 1-1.286 1.794.75.75 0 0 1-1.06-1.06Z" />
+</svg>
diff --git a/assets/icon-briefcase.svg b/assets/icon-briefcase.svg
new file mode 100644
index 0000000..9bbac08
--- /dev/null
+++ b/assets/icon-briefcase.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
+    <path fill-rule="evenodd" d="M7.5 5.25a3 3 0 0 1 3-3h3a3 3 0 0 1 3 3v.205c.933.085 1.857.197 2.774.334 1.454.218 2.476 1.483 2.476 2.917v3.033c0 1.211-.734 2.352-1.936 2.752A24.726 24.726 0 0 1 12 15.75c-2.73 0-5.357-.442-7.814-1.259-1.202-.4-1.936-1.541-1.936-2.752V8.706c0-1.434 1.022-2.7 2.476-2.917A48.814 48.814 0 0 1 7.5 5.455V5.25Zm7.5 0v.09a49.488 49.488 0 0 0-6 0v-.09a1.5 1.5 0 0 1 1.5-1.5h3a1.5 1.5 0 0 1 1.5 1.5Zm-3 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z" clip-rule="evenodd" />
+    <path d="M3 18.4v-2.796a4.3 4.3 0 0 0 .713.31A26.226 26.226 0 0 0 12 17.25c2.892 0 5.68-.468 8.287-1.335.252-.084.49-.189.713-.311V18.4c0 1.452-1.047 2.728-2.523 2.923-2.12.282-4.282.427-6.477.427a49.19 49.19 0 0 1-6.477-.427C4.047 21.128 3 19.852 3 18.4Z" />
+</svg>
diff --git a/assets/icon-user.svg b/assets/icon-user.svg
new file mode 100644
index 0000000..c2d64b7
--- /dev/null
+++ b/assets/icon-user.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
+    <path fill-rule="evenodd" d="M7.5 6a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0ZM3.751 20.105a8.25 8.25 0 0 1 16.498 0 .75.75 0 0 1-.437.695A18.683 18.683 0 0 1 12 22.5c-2.786 0-5.433-.608-7.812-1.7a.75.75 0 0 1-.437-.695Z" clip-rule="evenodd" />
+</svg>
diff --git a/cv.html b/cv.html
index b122ee5..41ef0a1 100644
--- a/cv.html
+++ b/cv.html
@@ -16,7 +16,10 @@
 
 <main>
     <section id=profile>
-        <h2>Profile</h2>
+        <hgroup class="experiences-heading">
+            <img src="/assets/icon-user.svg"/>
+            <h2>About Me</h2>
+        </hgroup>
         <p>
             I am a software developer, with passion for creativity and learning. My
             ultimate goal as a developer is to make cool things that help people in
@@ -25,8 +28,10 @@
     </section>
 
     <section id=employment-history class="experiences">
-        <h2>Employment History</h2>
-
+        <hgroup class="experiences-heading">
+            <img src="/assets/icon-briefcase.svg"/>
+            <h2>Employment History</h2>
+        </hgroup>
         <section id=lead-software-engineer-hyre class=experience>
             <hgroup>
                 <h3>Lead Software Engineer @ HYRE Solutions, Berlin</h3>
@@ -105,7 +110,10 @@
     </section>
 
     <section id=education class="experiences">
-        <h2>Education</h2>
+        <hgroup class="experiences-heading">
+            <img src="/assets/icon-academic-cap.svg"/>
+            <h2>Education</h2>
+        </hgroup>
 
         <section id=bacherlor-cs-rmit class=experience>
             <hgroup>
diff --git a/styles/style.css b/styles/style.css
index 581ead5..f1b643c 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -1,12 +1,12 @@
 :root {
     --primary: #000;
     --primary-light: #8a8a8a;
-    --primary-lightest: #eaeaea
-}
+    --primary-lightest: #eaeaea;
 
-html {
     font-family: "JetBrains Mono", Arial, sans-serif;
-    font-size: 10pt;
+    @media print {
+        font-size: 9pt;
+    }
 }
 
 body {
@@ -31,8 +31,9 @@ body {
     column-gap: 2rem;
 
     padding-top: 2rem;
+    padding-bottom: 2rem;
     @media print {
-        padding-top: 0;
+        padding: 0;
     }
 }
 
@@ -67,6 +68,19 @@ main > *:not(:last-child) {
     margin-bottom: 1.5rem
 }
 
+.experiences-heading {
+    display: flex;
+    flex-direction: row;
+    /*align-items: baseline;*/
+    justify-content: start;
+    gap: 0.5rem;
+
+    & img {
+        width: 2rem;
+        height: 2rem;
+    }
+}
+
 .experience:not(:last-child) {
     margin-bottom: 1rem
 }
@@ -153,4 +167,4 @@ a {
     &:hover {
         color: var(--primary);
     }
-}
+}
\ No newline at end of file