Restyle and restructure

2 files changed, 34 insertions, 20 deletions

diff --git a/html/main/about.tmpl.html b/html/main/about.tmpl.html
index c5b2d4e..1ea7e99 100644
--- a/html/main/about.tmpl.html
+++ b/html/main/about.tmpl.html
@@ -4,18 +4,20 @@
 {{ define "canonical" }}/about{{end}}
 
 {{ define "main" }}
-    <h1>About</h1>
-    <section class="postBackground">
-      <div class="postContent">
-        <img src="/static/media/alex_profile_512.jpg" alt="Highschool senior photo portrait of Alex next to Yerkes Observatory." style="margin-bottom: 3rem"/>
-        <p>My name is Alex Scerba, a Junior in the College for Creative Studies: Transportation Design program in Detroit, MI.</p>
-        <p>Growing up in Lake Geneva, WI, I developed a passion for making and tinkering, which lead me down the path of industrial design. I love working with my hands, fixing up and riding motorcycles and cars, and learning new skills.</p>
-        <p>In addition to sketching, rendering, and modeling, my hobby skills include programming (<a href="https://github.com/ascerba/personal-website" target="_blank" rel="noopener noreferrer">this website</a>), bookbinding, and woodworking.</p>
-        <blockquote>"It's just a machine. Open it up and see what's wrong."</blockquote>
-        <p>This summer, I hope to secure an internship to learn more skills in the design and manufacturing industry.</p>
-        <p>Connect with me on LinkedIn: <a href="https://linkedin.com/in/ascerba" target="_blank" rel="noopener noreferrer">linkedin.com/in/ascerba</a></p>
-        <p>Contact me at <a href="mailto:me@alexscerba.com">me@alexscerba.com</a></p>
-        <p>View my <a href="/static/documents/Resume_Scerba_Fall2023.pdf">résumé</a>
+    <div class="uneven-column-grid">
+      <h1>About</h1>
+      <img src="/static/media/alex_profile_512.jpg" alt="Highschool senior photo portrait of Alex next to Yerkes Observatory." style="margin-bottom: 3rem"/>
+      <div class="postBackground">
+        <div class="postContent">
+          <p>My name is Alex Scerba, a Junior in the College for Creative Studies: Transportation Design program in Detroit, MI.</p>
+          <p>Growing up in Lake Geneva, WI, I developed a passion for making and tinkering, which lead me down the path of industrial design. I love working with my hands, fixing up and riding motorcycles and cars, and learning new skills.</p>
+          <p>In addition to sketching, rendering, and modeling, my hobby skills include programming (<a href="https://github.com/ascerba/personal-website" target="_blank" rel="noopener noreferrer">this website</a>), bookbinding, and woodworking.</p>
+          <blockquote>"It's just a machine. Open it up and see what's wrong."</blockquote>
+          <p>This summer, I hope to secure an internship to learn more skills in the design and manufacturing industry.</p>
+          <p>Connect with me on LinkedIn: <a href="https://linkedin.com/in/ascerba" target="_blank" rel="noopener noreferrer">linkedin.com/in/ascerba</a></p>
+          <p>Contact me at <a href="mailto:me@alexscerba.com">me@alexscerba.com</a></p>
+          <p>View my <a href="/static/documents/Resume_Scerba_Fall2023.pdf">résumé</a>
+        </div>
       </div>
-    </section>
+    </div>
 {{ end }}
\ No newline at end of file
diff --git a/html/main/index.tmpl.html b/html/main/index.tmpl.html
index 9abcd59..561fcdf 100644
--- a/html/main/index.tmpl.html
+++ b/html/main/index.tmpl.html
@@ -4,14 +4,26 @@
 
 {{ define "main" }}
       <h1>Design Projects</h1>
-      <section class="projects even-2-col-grid">
+      <div class="uneven-column">
+        <div class="side-info">
+          <img src="/static/media/alex_profile_512.jpg" alt="Highschool senior photo portrait of Alex next to Yerkes Observatory." style="margin-bottom: 2.5rem;"/>
+          <div style="grid-column-start: 1;">
+            <p>My name is Alex Scerba, a Junior in the College for Creative Studies: Transportation Design program in Detroit, MI.</p>
+            <p>Growing up in Lake Geneva, WI, I developed a passion for making and tinkering, which lead me down the path of industrial design. I love working with my hands, fixing up and riding motorcycles and cars, and learning new skills.</p>
+            <p>In addition to sketching, rendering, and modeling, my hobby skills include programming (<a href="https://github.com/ascerba/personal-website" target="_blank" rel="noopener noreferrer">this website</a>), bookbinding, and woodworking.</p>
+            <p>This summer, I hope to secure an internship to learn more skills in the design and manufacturing industry.</p>
+            <p>Connect with me on LinkedIn: <br><a href="https://linkedin.com/in/ascerba" target="_blank" rel="noopener noreferrer"><b>linkedin.com/in/ascerba</b></a></p>
+            <p>Contact me at <a href="mailto:me@alexscerba.com"><b>me@alexscerba.com</b></a></p>
+            <p>View my <a href="/static/documents/Resume_Scerba_Fall2023.pdf"><b>résumé</b></a>
+          </div>
+        </div>
+        <div class="projects even-2-col-grid">
 {{ range .Posts.Contents }}
-        <a href="/projects/{{ .FileName }}" class="thumbnail">
-          <div class="img-zoom">
+          <a href="/projects/{{ .FileName }}" class="thumbnail">
             {{ .Image }}
-          </div>
-          <p>{{ .Title }}</p>
-        </a>
+            <span class="title">{{ .Title }}</span>
+          </a>
 {{ end }}
-      </section>
+        </div>
+      </div>
 {{ end }}
\ No newline at end of file