Merge pull request #29 from asimonson1125/projects-overhaul

Projects overhaul

src/app.py

@@ -71,29 +71,29 @@ def hotspotsRIT():
 def hotspotsProxy(path):
     return requests.get(f"{HotspotsURL}/{path}").content
 
-@app.errorhandler(Exception)
+# @app.errorhandler(Exception)
-def page404(e):
+# def page404(e):
-    eCode = e.code
+#     eCode = e.code
-    message = e.description
+#     message = e.description
-    try:
+#     try:
-        message = e.length
+#         message = e.length
-    finally:
+#     finally:
-        pagevars = {
+#         pagevars = {
-            "template": "error.html",
+#             "template": "error.html",
-            "title": f"{eCode} - Simonson",
+#             "title": f"{eCode} - Simonson",
-            "description": "Error on Andrew Simonson's Digital Portfolio",
+#             "description": "Error on Andrew Simonson's Digital Portfolio",
-            "canonical": "404",
+#             "canonical": "404",
-        }
+#         }
-        return (
+#         return (
-            flask.render_template(
+#             flask.render_template(
-                "header.html",
+#                 "header.html",
-                var=pagevars,
+#                 var=pagevars,
-                error=eCode,
+#                 error=eCode,
-                message=message,
+#                 message=message,
-                title=f"{eCode} - Simonson Portfolio",
+#                 title=f"{eCode} - Simonson Portfolio",
-            ),
+#             ),
-            eCode,
+#             eCode,
-        )
+#         )
 
 
 @app.route("/sitemap.xml")

src/static/css/App.css

@@ -259,7 +259,6 @@ a {
 
 .foregroundContent p {
   line-height: 1.5em;
-  max-width: min(90%, 40rem);
 }
 
 .homeground {
@@ -311,10 +310,6 @@ a {
   text-align: center;
 }
 
-#nametag *:not(h1) {
-  text-shadow: .1em .1em rgba(255, 255, 255, 0.2);
-}
-
 #nametag h2{
   font-size: medium;
 }
@@ -397,7 +392,6 @@ a {
   background-size: contain;
   background-repeat: no-repeat;
   background-position-y: center;
-  opacity: 0.4;
   height: 100%;
   width: 100%;
   position: absolute;
@@ -510,23 +504,13 @@ a {
   padding: 0px;
   display: flex;
   flex-wrap: wrap;
-  justify-content: center;
   margin-left: auto;
   margin-right: auto;
   width: 100%;
-  text-align: center;
 }
 
 .project {
-  display: inline-block;
+  border-top: .3rem rgba(156, 49, 45, .8) solid;
-  text-align: left;
-  margin: 1rem;
-  width: 20rem;
-  height: 22rem;
-  border: .3rem rgba(156, 49, 45, .8) solid;
-  background-color: rgba(22, 22, 22, .8);
-  transition: .3s;
-  overflow: hidden;
 }
 
 .projTitle>* {
@@ -536,9 +520,18 @@ a {
 .projBody {
   position: relative;
   z-index: 3;
+  display: flex;
 }
 
-.project .topBox, .project .bottomBox, .project .projTitle {
+.grow {
+  flex-grow: 1;
+}
+
+.projImage{
+  width: min(100%, 35em);
+}
+
+.project .projTitle {
   padding: 0 1rem;
   z-index: inherit;
 }
@@ -558,7 +551,7 @@ a {
   border-bottom: black solid .2rem;
 }
 
-.project img {
+.projectLink {
   margin-top: auto;
   height: 3rem;
 }
@@ -687,6 +680,7 @@ a {
   background-color: rgb(24, 24, 24, .85);
   padding: 0 8em;
   padding-top: 1em;
+  border-top: solid 4px rgba(139,36,36,0.5);
 }
 
 #homeProjects {

src/static/json/projects.json

@@ -13,6 +13,28 @@
       ]
     ]
   },
+  "Antietam-Conococheague Watershed Monitoring": {
+    "status": "complete",
+    "classes": "geospacial",
+    "bgi": "watershedTemps.png",
+    "content": "Geospacial analysis of Maryland's Antietam and Conococheague sub-watersheds, monitoring water quality and temperatures through the summer months for reporting to governmental review boards for environmental protection"
+  },
+  "Calorimetry Analysis Engineering": {
+    "status": "complete",
+    "classes": "pinned programming",
+    "bgi": "calorimeterAnalysis.png",
+    "content": "An analytical toolkit designed for reactive chemistry analysis, especially calorimetry.  Works include automatic analysis, alerting unusual and dangerous results derived from a wide range of testing envrionments and equipment",
+    "links": []
+  },
+  "Geography of Alternative Energy": {
+    "status": "complete",
+    "classes":"pinned geospacial",
+    "bgi": "energyGeography.png",
+    "content": "An ArcGIS geospacial analysis comparing the difference in effectiveness of wind, solar, and geothermal energy across the continental 48 United States.",
+    "links": [
+      ["globe", "https://ritarcgis.maps.arcgis.com/apps/dashboards/17d5bda01edc4a2eb6205a4922d889c9", "Dashboard"]
+    ]
+  },
   "OccupyRIT": {
     "status": "WIP",
     "classes": "pinned programming",
@@ -22,16 +44,6 @@
       ["github", "https://github.com/asimonson1125/Occupy-RIT", "git repo"]
     ]
   },
-  "Digital Portfolio": {
-    "status": "WIP",
-    "classes": "pinned programming",
-    "bgi": "website.png",
-    "content": "My personal portfolio website (you're on it now!)",
-    "links": [
-      ["github", "https://github.com/asimonson1125/asimonson1125.github.io", "git repo"],
-      ["globe", "https://asimonson.com", "site link"]
-    ]
-  },
   "Slate": {
     "status": "complete",
     "classes": "pinned programming",
@@ -42,7 +54,7 @@
       ["globe", "https://slate.csh.rit.edu", "site link"]
     ]
   },
-  "NationsGame Rolls Sim": {
+  "Monte Carlo Engine for NationsGame": {
     "status": "complete",
     "classes": "programming",
     "bgi": "ceoOfYugo.png",

src/templates/partials/project.html

@@ -1,33 +1,43 @@
 {% macro project(title, classes, status, bgi, content, links) %}
 <div class="project {{ classes }}" data-aos="fade-up">
-  <div class="vFlex">
   <div class="projTitle">
     <h3>{{ title }}</h3>
-      <p class="{{ status }} tab">⬤</p>
+    <p class=""><span class="{{ status }}">⬤</span> {{ status }}</p>
+  </div>
+  <div class="projBody mobileV">
+    {% if bgi|length > 0 %} {% set path = url_for('static',
+    filename='photos/projects/' + bgi) %}
+    <div class="projImage">
+      <img
+        class="projImage"
+        src="{{ path }}"
+        alt="Ref image for {{ title }} project"
+      />
     </div>
-    <div class="projBody vFlex spaceBetween">
-      {% if bgi|length > 0 %}
-      {% set path = url_for('static', filename='photos/' + bgi) %}
-      <div style="background-image: url('{{path}}');" class="bgi"></div>
     {% endif %}
-      <div class="topBox">
+
+    <div class="grow">
       <p class="backedBody">{{ content }}</p>
     </div>
-      <div class="bottomBox">
+    <div class="projLinks">
       {% for i in links %} {% set src = 'icons/' + i[0] + '.svg' %}
       <a href="{{i[1]}}">
-          <img src="{{ url_for('static', filename=src) }}" alt="{{i[0]}}" />
+        <img
+          class="projectLink"
+          src="{{ url_for('static', filename=src) }}"
+          alt="{{i[0]}}"
+        />
       </a>
       {% endfor %} {% if links|length == 0 %}
       <div class="placeholder">
         <img
           alt="no links!"
           src="{{ url_for('static', filename='photos/placeholder.png') }}"
+          class="projectLink"
         />
       </div>
       {% endif %}
     </div>
   </div>
-  </div>
 </div>
 {% endmacro %}

src/templates/projects.html

@@ -3,15 +3,7 @@
 <div class="foregroundContent">
     <div data-aos="fade-up">
       <h2 class="concentratedHead">Projects</h2>
-      <p>
+      <h2>This page is currently undergoing a reconstruction.  It's messy, but I needed to push some changes before I was ready for some very good and secret reasons.</h2>
-        Project status is indicated by the color of the project card:
-        <br />
-        <span class="complete">⬤</span> - Complete
-        <br />
-        <span class="WIP">⬤</span> - Work In Progress
-        <br />
-        <span class="incomplete">⬤</span> - Incomplete
-      </p>
     </div>
 
     <!-- >
@@ -39,7 +31,7 @@
       </div>
     </div>
     </!-->
-    <div class="projectList checkbox-client">
+    <div class="projectList vContainer">
         {% from 'partials/project.html' import project %} 
         {% for i in var["projects"] %}
         {{ project(i, var["projects"][i]["classes"], var["projects"][i]["status"], var["projects"][i]["bgi"], var["projects"][i]["content"], var["projects"][i]["links"]) }}