Merge pull request #28 from asimonson1125/master

catch up projects branch
2026-02-25 05:09:49 -06:00 · 2024-05-19 14:31:42 -04:00
parent c92cbf8abc 2981d4ccc2
commit cb27948649
11 changed files with 191 additions and 219 deletions
--- a/src/app.py
+++ b/src/app.py
@@ -10,8 +10,8 @@ books = json.load(open("./static/json/books.json", "r"))
 skillList = json.load(open("./static/json/skills.json", "r"))
 timeline = json.load(open("./static/json/timeline.json", "r"))
 pages = json.load(open("./static/json/pages.json", "r"))
-pages['about']['skillList'] = skillList
-pages['about']['timeline'] = timeline
+pages['home']['skillList'] = skillList
+# pages['about']['timeline'] = timeline
 pages['projects']['projects'] = proj
 pages['home']['books'] = books
 pages['books']['books'] = books
--- a/src/static/css/App.css
+++ b/src/static/css/App.css
@@ -79,17 +79,11 @@ body {
  filter: brightness(50%);
 }

-h1, h2 {
+h1 {
  color: #ecebeb;
 }

-h2 {
-  font-size: 2rem;
-  margin-top: 1rem;
-  margin-bottom: 2rem;
-}
-
-h3, h4, h5 {
+h2, h3, h4, h5 {
  color: #a8a8a8;
 }

@@ -134,7 +128,7 @@ a {
  background-color: #1a1a1a;
  width: 100vw;
  z-index: 99;
-  position: fixed;
+  position: sticky;
  top: 0;
  left: 0;
  transition: .4s;
@@ -150,6 +144,7 @@ a {

 #homeName {
  margin-top: .25em;
+  margin-bottom: 0;
 }

 #name-container {
@@ -257,7 +252,6 @@ a {
 }

 .foregroundContent {
-  padding-top: 4rem;
  padding-left: 8rem;
  max-width: calc(100%-8rem);
  padding-bottom: 1rem;
@@ -273,7 +267,7 @@ a {
 }

 .homegroundContent {
-  padding-top: 5em;
+  padding-top: 1em;
  padding-left: 0em;
 }

@@ -313,18 +307,18 @@ a {

 #nametag {
  padding: 2em 3em;
-  display: inline-block;
  background-color: rgb(44, 44, 44, .75);
-  border-radius: 1em;
-  border: solid black 4px;
  text-align: center;
-  max-width: 30em;
 }

 #nametag *:not(h1) {
  text-shadow: .1em .1em rgba(255, 255, 255, 0.2);
 }

+#nametag h2{
+  font-size: medium;
+}
+
 #nametag p {
  text-shadow: none;
  color: #a8a8a8;
@@ -349,6 +343,14 @@ a {
  justify-content: space-around;
 }

+.equalitems {
+  column-gap: 1em;
+}
+
+.equalitems > * {
+  flex: 1 1 0;
+}
+
 .vFlex {
  display: flex;
  flex-direction: column;
@@ -360,6 +362,10 @@ a {
  max-width: 100%;
 }

+#aboutCards > * {
+  margin: .25em;
+}
+
 .spaceBetween {
  justify-content: space-between;
 }
@@ -368,6 +374,11 @@ a {
  justify-content: left;
 }

+.hSpacer {
+  width: 2em;
+  height: 0;
+}
+
 .relative {
  position: relative;
 }
@@ -586,6 +597,12 @@ a {
  left: 0;
 }

+#contentStuffer {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
 .socials {
  margin-left: 1rem;
  width: 0px;
@@ -662,6 +679,26 @@ a {
  background-size: cover;
 }

+#desktopSpacer {
+  height: min(20em, 30vh);
+}
+
+.homeSubContent {
+  background-color: rgb(24, 24, 24, .85);
+  padding: 0 8em;
+  padding-top: 1em;
+}
+
+#homeProjects {
+  padding: 1em;
+}
+
+.homeProject {
+  width: 20em;
+  height:5em;
+
+}
+
 .heightBox {
  height: 100%;
  display: flex;
@@ -672,9 +709,6 @@ a {
 .chess {
  max-width: 300px;
  border: none;
-  overflow: scroll;
-  /* transform: scale(.8);
-  float: right; */
 }

 #chessProfile {
@@ -969,6 +1003,22 @@ a {
    border-bottom: solid 3px rgb(156, 49, 45, .4);
  }

+  .footer {
+    position: unset;
+  }
+
+  #footerSpacer {
+    flex-grow: 1;
+  }
+
+  #aboutCards {
+    flex-direction: column;
+  }
+  
+  #aboutCards > * {
+    margin: .25em auto;
+  }  
+
  .header h1 {
    font-size: 1.5rem;
  }
@@ -991,6 +1041,10 @@ a {
    margin: 0;
  }

+  .vertOnMobile {
+    flex-direction: column;
+  }
+
  .projectList {
    width: 95%;
  }
@@ -1015,6 +1069,10 @@ a {
    padding-top: 5em;
  }

+  .homeSubContent {
+    padding: 1em;
+  }
+
  .onRight {
    margin: unset;
    margin-top: 3rem;
--- a/src/static/js/responsive.js
+++ b/src/static/js/responsive.js
@@ -1,35 +1,8 @@
-window.onload = function () {
-  onLoaded();
-};
-function onLoaded() {
-  window.onresize = function () {
-    resizer();
-  };
-  resizer();
-}
-
-function resizer() {
-  const e = document.querySelector(".navControl");
-  if (window.innerWidth > 1400) {
-    // desktop view
-    e.style.maxHeight = `${e.scrollHeight + 10}px`;
-  } else {
-    // mobile view
-    document.querySelector(".header").style.borderBottomWidth = "3px";
-    e.style.maxHeight = "0px";
-    document.querySelectorAll(".navElement *").forEach((x) => {
-      x.style.paddingTop = ".3rem";
-      x.style.paddingBottom = ".3rem";
-      x.style.fontSize = "1rem";
-    });
-  }
-}
-
-function toggleMenu() {
+function toggleMenu(collapse=false) {
  if (window.innerWidth < 1400) {
    const e = document.querySelector(".navControl");
    const bar = document.querySelector(".header");
-    if (e.style.maxHeight === "0px") {
+    if (e.style.maxHeight === "0px" && !collapse) {
      e.style.maxHeight = `${e.scrollHeight + 10}px`;
      bar.style.borderBottomWidth = "0px";
    } else {
@@ -39,7 +12,7 @@ function toggleMenu() {
  }
 }

-async function goto(location, { push = true, toggle = true } = {}) {
+async function goto(location, { push = true } = {}) {
  let a = await fetch("/api/goto/" + location, {
    credentials: "include",
    method: "GET",
@@ -56,9 +29,7 @@ async function goto(location, { push = true, toggle = true } = {}) {
  root.querySelectorAll("script").forEach((x) => {
    eval(x.innerHTML);
  });
-  if (toggle) {
-    toggleMenu();
-  }
+  toggleMenu(collapse=true);
  document.querySelector("title").textContent = metadata["title"];
  if (push) {
    history.pushState(null, null, metadata["canonical"]);
--- a/src/static/json/pages.json
+++ b/src/static/json/pages.json
@@ -11,12 +11,6 @@
        "description": "Recent projects by Andrew Simonson on his lovely portfolio website :)",
        "canonical": "/projects"
    },
-    "about": {
-        "template": "about.html",
-        "title": "Andrew Simonson - About Me",
-        "description": "About Andrew Simonson",
-        "canonical": "/about"
-    },
    "books": {
        "template": "books.html",
        "title": "Andrew Simonson - Bookshelf",
--- a/src/static/json/skills.json
+++ b/src/static/json/skills.json
@@ -1,5 +1,14 @@
 {
    "Data and AI": {
+        "Tools": {
+            "Microsoft Azure": {
+                "Databricks": {},
+                "Data Factory": {},
+                "Stream Analytics": {}
+            },
+            "Apache Spark": {},
+            "Visual Basic for Applications (Excel)": {}
+        },
        "Python": {
            "PyTorch/TensorFlow": {},
            "Numpy/Pandas": {},
@@ -11,16 +20,19 @@
    "Frontend": {
        "Flask (Python)": {},
        "React (Javascript)": {},
-        "Angular (Typescript)": {}
+        "SASS/SCSS": {}
    },
    "Backend & DevOps": {
+        "Backend": {
+            "Rust": {},
+            "C#": {},
+            "C++": {}
+        },
        "DevOps": {
            "Docker": {},
            "Microsoft Azure": {},
            "Kubernetes/Openshift": {},
            "Bash": {}
-        },
-        "C#": {},
-        "C++": {}
+        }
    }
 }
--- a/src/static/sitemap.xml
+++ b/src/static/sitemap.xml
@@ -2,9 +2,9 @@
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://asimonson.com</loc>
-    <loc>https://asimonson.com/about</loc>
    <loc>https://asimonson.com/projects</loc>
    <loc>https://asimonson.com/Resume</loc>
-    <lastmod>2022-06-04</lastmod>
+    <loc>https://asimonson.com/duck</loc>
+    <lastmod>2024-05-19</lastmod>
  </url>
 </urlset>
--- a/src/templates/about.html
+++ b/src/templates/about.html
@@ -1,86 +0,0 @@
-{% block content %}
-<div class="foreground"></div>
-<div class="foregroundContent">
-  <div class="relative">
-      <div id="aboutMe" class="col" data-aos="fade-up">
-        <h2 class="concentratedHead">About Me</h2>
-        <p>
-          I'm Andrew Simonson, a senior undergrad at
-          <strong>Rochester Institute of Technology </strong>
-          in the <b>Computer Science BS</b> program (international relations minor), pursuing a career in data
-          science with a focus on predictive analytics.
-        </p>
-        <p>
-          <br />
-          Ominous positivity is kinda my thing.
-        </p>
-        <br />
-      </div>
-      <div class="col rightCol" data-aos="fade-up">
-        <div id="skills">
-          <h2 id="skillstag">Skills</h2>
-          {% from 'partials/skills.html' import skills %} {{ skills(var['skillList']) }}
-        </div>
-        <div id="timeline">
-          <h2>Timeline</h2>
-          <div class="checkbox-wrapper">
-            <div class="flex start">
-              <label class="switch" htmlFor="pinned">
-                <input
-                  type="checkbox"
-                  id="pinned"
-                  onClick='toggleCheckbox("up")'
-                  checked
-                />
-                <div class="slider round"></div>
-                <strong>Pinned</strong>
-              </label>
-            </div>
-            <div class="flex start">
-              <label class="switch" htmlFor="education">
-                <input
-                  type="checkbox"
-                  id="education"
-                  onClick="toggleCheckbox('up')"
-                />
-                <div class="slider round"></div>
-                <strong>Education</strong>
-              </label>
-            </div>
-            <div class="flex start">
-              <label
-                class="switch"
-                htmlFor="experience"
-                onClick="toggleCheckbox('up')"
-              >
-                <input type="checkbox" id="experience" />
-                <div class="slider round"></div>
-                <strong>Work Experience</strong>
-              </label>
-            </div>
-            <div class="flex start">
-              <label
-                class="switch"
-                htmlFor="technical"
-                onClick="toggleCheckbox('up')"
-              >
-                <input type="checkbox" id="technical" />
-                <div class="slider round"></div>
-                <strong>Technical</strong>
-              </label>
-            </div>
-          </div>
-          <div class="timeline checkbox-client">
-            {% from 'partials/timeline.html' import timeitem %} {% for i in
-            var["timeline"] %} {{ timeitem(i, var["timeline"][i]["classes"],
-            var["timeline"][i]["date"], var["timeline"][i]["content"])}} {%
-            endfor %}
-          </div>
-          <script>
-            toggleCheckbox("up");
-          </script>
-        </div>
-    </div>
-  </div>
-</div>
-{% endblock %}
--- a/src/templates/duck.html
+++ b/src/templates/duck.html
@@ -1,12 +1,12 @@
 {% block content %}
 <div class="foreground"></div>
 <div class="foregroundContent">
-  <h2>What the duck?</h2>
+  <h1>What the duck?</h1>
  <img
    alt="mega spinney duck"
    src="{{ url_for('static', filename='photos/gifs/duck-spinning.gif') }}"
    style="max-width: calc(100% - 2em);"
  />
-  <h3>Stop disturbing the duck, can't you see he's busy spinning?</h3>
 </div>
+<!-- BONUS DUCKS! -->
 {% endblock %}
--- a/src/templates/header.html
+++ b/src/templates/header.html
@@ -2,7 +2,10 @@
 <html lang="en">
  <head>
    <meta charset="utf-8" />
-    <link rel="icon" href="{{ url_for('static', filename='icons/withBackground.svg') }}" />
+    <link
+      rel="icon"
+      href="{{ url_for('static', filename='icons/withBackground.svg') }}"
+    />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta name="description" content="{{ var['description'] }}" />
@@ -47,10 +50,11 @@
      rel="stylesheet"
      href="{{ url_for('static', filename='css/checkbox.css') }}"
    />
+    <!--
    <link
      rel="stylesheet"
      href="{{ url_for('static', filename='css/head.css') }}"
-    />
+    /></!-->

    <link rel="canonical" href="https://asimonson.com{{ var['canonical'] }}" />
    <script src="{{ url_for('static', filename='js/checkbox.js') }}"></script>
@@ -62,15 +66,13 @@
  <body onpopstate="backButton()">
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <iframe src="/hotspots?legend=false" title="HotspotsRIT" id="map"></iframe>
-    <div class="App">
+    <div id="contentStuffer">
      <div class="header">
-        <div id="name-container" onclick="goto('home', {toggle:false})">
-          <div class="glitch">
+        <div id="name-container" onclick="goto('home')">
          <div class="line name">
            <span class="textGrad">Andrew Simonson</span>
          </div>
        </div>
-        </div>

        <img
          src="{{ url_for('static', filename='icons/menu.svg')}}"
@@ -89,20 +91,15 @@
            <div onclick="goto('projects')" class="navElement">
              <p>Projects</p>
            </div>
-            <!-- <a href="/activities">Activities</a> -->
-            <div onclick="goto('about')" class="navElement">
-              <p>About Me</p>
          </div>
        </div>
      </div>
-      </div>
-    </div>
-    {% endblock %}
-    {% block content%}
+      {% endblock %} {% block content%}
      <div id="root">{% include var['template'] %}</div>
-    {% endblock %}
-    {% block footer %}
+      {% endblock %} {% block footer %}
+      <div id="footerSpacer"></div>
      <div class="footer">{% include 'partials/socials.html' %}</div>
      {% endblock %}
+    </div>
  </body>
 </html>
--- a/src/templates/home.html
+++ b/src/templates/home.html
@@ -1,54 +1,76 @@
 {% block content %} {% macro nameplate() %}
-<img
+<div>
+  <img
    src="{{ url_for('static', filename='icons/neonfinal3.svg') }}"
    id="homeIcon"
    alt="logo"
-/>
-<h1 id="homeName" class='textGrad'>Andrew Simonson</h1>
-<h3>Computer Science student at Rochester Institute of Technology</h3>
-<h5>End-to-End Services in Data Science and AI</h5>
+  />
+  <h1 id="homeName" class="textGrad">Andrew Simonson</h1>
+  <h2 class="textGrad">Data Science Beyond Theoretical Environments</h2>
+</div>
 {% endmacro %}

 <div class="foreground homeground"></div>
-<div class="foregroundContent homegroundContent">
-  <div class="relative">
-    <div id="homepage" class="flex">
-      <div id="HomeContent">
-        <div class="flex">
-          <div id="nametag" class="transparent unsetPos" data-aos="fade-up">
-            {{ nameplate() }}
+<div class="relative">
+  <div id="nametag" class="flex" data-aos="fade-up">{{ nameplate() }}</div>
+  <!--<INSERT SMALL BANNER HERE FOR PROJECT IMAGECARD CAROUSEL>-->
+  <div id="desktopSpacer"></div>
+  <div class="homeSubContent">
+    <div class="flex equalitems vertOnMobile">
+      <div>
+        <h2>About Me</h2>
+        <p>
+          I'm Andrew Simonson<!--, CEO of the anti-thermodynamics syndicate.-->,
+          a senior undergrad at
+          <strong>Rochester Institute of Technology </strong>
+          in the <b>Computer Science BS</b> program (international relations
+          minor), pursuing a career in data science. I have study clusters in
+          Data Science and AI and run independent studies in probability theory.
+          <br />
+          <br />
+          I've worked on a variety of projects, from building analytical tools
+          performing reactive chemical safety to live feed processing for
+          frantic work environments looking to improve service. I also do
+          personal experimentation leveraging open source info streams ranging
+          from human traffic around campus to watershed temperature monitoring.
+          <br />
+          <br />
+          My philosophy is that if it isn't explainable then you didn't learn
+          anything. Data without sound methodology is at best meaningless and at
+          worst counterproductive and costly. Bringing logical transparency and
+          literal deductions back into digital analysis enables us to learn
+          about the world through computing, rather than letting computers make
+          decisions for the world we think we know. We as data scientists
+          shouldn't just be building heuristics. We should be making discoveries
+          and building new knowledge.
+          <br />
+          <br />
+          <strong>Bring the scientific method to AI.</strong>
+          <br />
+          <br />
+        </p>
      </div>
-          <div id="nametagContainer">
-            <div id="nametag" data-aos="fade-up">{{ nameplate() }}</div>
+      <div id="skills">
+        <h2 id="skillstag">Skills</h2>
+        {% from 'partials/skills.html' import skills %} {{
+        skills(var['skillList']) }}
      </div>
    </div>
-      </div>
-      <div class="onRight" data-aos="fade-up">
+    <div id="aboutCards" class="flex">
      <div class="chess">
-          {% from 'partials/chess.html' import chess %} {{
-          chess('asimonson1125') }}
+        {% from 'partials/chess.html' import chess %} {{ chess('asimonson1125')
+        }}
      </div>
      <br />
      {% from 'partials/bookshelf.html' import bookshelf %} {{
      bookshelf(var.books) }}
      <br />
-          <div class="flex pointer" onclick="goto('duck')">
+      <div class="pointer" onClick="goto('duck')">
        <img
          alt="duck spinning"
          src="{{ url_for('static', filename='photos/gifs/duck-spinning.gif') }}"
          class="smallImg"
        />
-            <img
-              alt="duck spinning"
-              src="{{ url_for('static', filename='photos/gifs/duck-spinning.gif') }}"
-              class="smallImg"
-            />
-            <img
-              alt="duck spinning"
-              src="{{ url_for('static', filename='photos/gifs/duck-spinning.gif') }}"
-              class="smallImg"
-            />
-          </div>
      </div>
    </div>
  </div>
--- a/src/templates/partials/skills.html
+++ b/src/templates/partials/skills.html
@@ -10,7 +10,11 @@
 {% macro skills(skills) %}
 <div id="skillTree">
    {% for skill in skills %}
-    {{ expandSkill(skills, skill, 'activeSkill') }}
+    {% set classes = "" %}
+    {% if skill == skills|first %}
+        {% set classes = "activeSkill" %}
+    {% endif %}
+    {{ expandSkill(skills, skill, classes) }}
    {% endfor %}
 </div>
 {% endmacro %}