just a whole lot of things

src/app.py

@@ -27,6 +27,7 @@ def goto(location='home'):
     try:
         page = flask.render_template(pagevars["template"], var=pagevars)
     except Exception as e:
+        # raise e
         e = HTTPerror.InternalServerError(None, e)
         page = page404(e)
     return [pagevars, page]

src/static/css/App.css

@@ -318,7 +318,7 @@ a {
   max-width: 30em;
 }
 
-#nametag *:not(h6) {
+#nametag *:not(h1) {
   text-shadow: .1em .1em rgba(255, 255, 255, 0.2);
 }
 
@@ -406,10 +406,6 @@ a {
   max-height: min(30rem, 100%);
 }
 
-/* #aboutGrid{
-  display: grid;
-} */
-
 .col {
   width: calc(50% - 3rem);
   margin-bottom: 3em;
@@ -429,23 +425,72 @@ a {
   margin-right: auto;
 }
 
-.skills {
+#skillstag::after {
-  display: inline-block;
+  content: "Click for details...";
-  background-color: rgba(0, 0, 0, 0.3);
+  display: block;
-  border: solid rgba(156, 49, 45, .8) .3rem;
+  font-size: small;
-  text-align: center;
+  color: #a8a8a8;
-  padding: 1rem;
+}
+
+#skillTree {
+  border-left: rgb(139, 36, 36) solid 3px;
+  background: rgba(22,22,22,.8);
+  font-size: x-large;
+  margin-bottom: 10px;
 }
 
 .skill {
-  display: inline-block;
+  display: none;
-  border: rgba(156, 49, 45, .8) solid .15rem;
+  padding: .2em;
-  padding: .2rem;
+  color: rgb(235, 235, 235);
-  margin: .5rem;
-  background-color: rgba(11, 11, 11, .8);
-  color: rgb(212, 212, 212);
 }
 
+.skill.activeSkill > .skillname {
+  color: rgb(170, 170, 170);
+}
+
+.skill > .skillname:hover {
+  color: rgb(170, 170, 170);
+}
+
+#skillTree > .skill {
+  display: block;
+}
+
+.skill > .skill {
+  font-size: large !important;
+  padding-left: .5em;
+}
+
+.skill.activeSkill > .skill {
+  display: block !important;
+}
+
+.skill > .skillname {
+  text-decoration: underline;
+}
+
+.skill > .skillname::after {
+  content: " >";
+}
+
+.skill.activeSkill > .skillname::after {
+  content: " <";
+}
+
+.skill[data-length="0"].activeSkill > .skillname, .skill[data-length="0"] > .skillname:hover, .skill.activeSkill > .skillname:hover {
+  color: rgb(235, 235, 235);
+}
+
+.skill[data-length="0"] > .skillname::after {
+  content: ""
+}
+
+.skill[data-length="0"] > .skillname {
+  text-decoration: none;
+}
+
+
 .projectList {
   padding: 0px;
   display: flex;
@@ -974,7 +1019,7 @@ a {
 
   .col {
     width: 100%;
-    margin-bottom: 3rem;
+    margin-bottom: 0;
   }
 
   .rightCol {

src/static/icons/neonfinal3.svg

@@ -2,9 +2,9 @@
 <!-- Created with Inkscape (http://www.inkscape.org/) -->
 
 <svg
-   width="167.83667mm"
+   width="193.32394mm"
-   height="167.83669mm"
+   height="193.32397mm"
-   viewBox="0 0 167.83667 167.83669"
+   viewBox="0 0 193.32394 193.32397"
    version="1.1"
    id="svg1"
    inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
@@ -27,9 +27,9 @@
      inkscape:pagecheckerboard="0"
      inkscape:deskcolor="#d1d1d1"
      inkscape:document-units="mm"
-     inkscape:zoom="0.59949714"
+     inkscape:zoom="0.40896244"
-     inkscape:cx="179.31695"
+     inkscape:cx="204.17523"
-     inkscape:cy="437.86698"
+     inkscape:cy="272.64118"
      inkscape:window-width="1920"
      inkscape:window-height="1011"
      inkscape:window-x="0"
@@ -183,10 +183,10 @@
        inkscape:collect="always"
        style="color-interpolation-filters:sRGB"
        id="filter5"
-       x="-0.064230178"
+       x="-0.041894038"
-       y="-0.064230177"
+       y="-0.041893957"
-       width="1.1284604"
+       width="1.083788"
-       height="1.1284604">
+       height="1.0837879">
       <feGaussianBlur
          inkscape:collect="always"
          stdDeviation="1.0664778"
@@ -196,10 +196,10 @@
        inkscape:collect="always"
        style="color-interpolation-filters:sRGB"
        id="filter6"
-       x="-0.12459899"
+       x="-0.10226285"
-       y="-0.12459899"
+       y="-0.10226277"
-       width="1.249198"
+       width="1.2045257"
-       height="1.249198">
+       height="1.2045255">
       <feGaussianBlur
          inkscape:collect="always"
          stdDeviation="2.9222677"
@@ -209,10 +209,10 @@
        inkscape:collect="always"
        style="color-interpolation-filters:sRGB"
        id="filter8"
-       x="-0.33202635"
+       x="-0.30969021"
-       y="-0.33202634"
+       y="-0.30969013"
-       width="1.6640527"
+       width="1.6193804"
-       height="1.6640527">
+       height="1.6193802">
       <feGaussianBlur
          inkscape:collect="always"
          stdDeviation="10.040917"
@@ -222,13 +222,13 @@
        inkscape:collect="always"
        style="color-interpolation-filters:sRGB"
        id="filter10"
-       x="-0.03863471"
+       x="-0.01629857"
-       y="-0.038634709"
+       y="-0.01629849"
-       width="1.0772694"
+       width="1.0325971"
-       height="1.0772694">
+       height="1.032597">
       <feGaussianBlur
          inkscape:collect="always"
-         stdDeviation="1.6097795"
+         stdDeviation="0.49999998"
          id="feGaussianBlur10" />
     </filter>
     <inkscape:path-effect
@@ -270,7 +270,7 @@
      inkscape:label="Layer 1"
      inkscape:groupmode="layer"
      id="layer1"
-     transform="translate(-14.360103,-50.697192)">
+     transform="translate(-1.6164577,-37.953551)">
     <use
        x="0"
        y="0"
@@ -290,18 +290,18 @@
        id="star"
        style="display:inline;opacity:1;filter:url(#filter5)"
        transform="matrix(1.1617659,0,0,1.1617659,19.179777,39.028635)"
-       inkscape:export-filename="../../Documents/GitHub/asimonson1125.github.io/src/static/icons/neonfinal3.svg"
+       inkscape:export-filename="../../Documents/GitHub/asimonson1125.github.io/src/static/icons/neonfinal2.svg"
        inkscape:export-xdpi="96"
        inkscape:export-ydpi="96">
       <path
-         style="opacity:1;mix-blend-mode:normal;fill:#b3962d;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;filter:url(#filter10)"
+         style="opacity:1;mix-blend-mode:normal;fill:#b3962d;fill-opacity:1;fill-rule:evenodd;stroke:#ff9c00;stroke-width:0.860759;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;filter:url(#filter10)"
          d="m 65.084856,67.277241 c -1.287779,9.10845 -5.183319,11.28276 -12.694774,12 -7.511459,0.71725 -34.305226,3 -34.305226,3 0,0 25.891549,1.71223 35,3 9.108454,1.28778 11.282748,4.48855 12,12 0.717252,7.511459 3,34.999999 3,34.999999 0,0 1.712221,-25.89154 3,-34.999999 1.28778,-9.10844 4.488549,-11.28275 11.999999,-12 7.51146,-0.71724 34.999995,-3 34.999995,-3 0,0 -25.891545,-1.71222 -34.999995,-3 -9.10845,-1.28777 -11.282748,-4.48854 -11.999999,-12 -0.717252,-7.51145 -3,-34.999998 -3,-34.999998 0,0 -1.71222,25.891548 -3,34.999998 z"
          id="path3-6-8"
          sodipodi:nodetypes="sscsscsscsscs" />
     </g>
     <g
        id="neonHighlights"
-       style="display:inline">
+       style="display:inline;opacity:0.75">
       <use
          x="0"
          y="0"
@@ -319,7 +319,7 @@
          y="0"
          xlink:href="#neonTubing"
          id="use9"
-         style="filter:url(#filter9)" />
+         style="opacity:1;filter:url(#filter9)" />
     </g>
     <g
        id="neonTubing"

src/static/icons/withBackground.svg

@@ -0,0 +1,407 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="216.75919mm"
+   height="216.7592mm"
+   viewBox="0 0 216.75919 216.7592"
+   version="1.1"
+   id="svg1"
+   inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
+   sodipodi:docname="neon2.svg.2024_02_25_10_57_42.0.svg"
+   inkscape:export-filename="neonfinal.svg"
+   inkscape:export-xdpi="96"
+   inkscape:export-ydpi="96"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#333333"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     inkscape:zoom="0.40896244"
+     inkscape:cx="204.17523"
+     inkscape:cy="412.01828"
+     inkscape:window-width="1920"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs1">
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect17"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,7.9986979,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect16"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,8.0780818,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect9"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,9.6572028,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect8"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,7.5495738,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect8-2"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,7.5495738,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect9-9"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,9.6572028,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <filter
+       inkscape:collect="always"
+       style="color-interpolation-filters:sRGB"
+       id="filter9"
+       x="-0.030747933"
+       y="-0.028448841"
+       width="1.0614959"
+       height="1.0568977">
+      <feGaussianBlur
+         inkscape:collect="always"
+         stdDeviation="1.1764713"
+         id="feGaussianBlur9" />
+    </filter>
+    <filter
+       inkscape:collect="always"
+       style="color-interpolation-filters:sRGB"
+       id="filter29"
+       x="-0.090988795"
+       y="-0.084185358"
+       width="1.1819776"
+       height="1.1683707">
+      <feGaussianBlur
+         inkscape:collect="always"
+         stdDeviation="4.7058852"
+         id="feGaussianBlur29" />
+    </filter>
+    <filter
+       inkscape:collect="always"
+       style="color-interpolation-filters:sRGB"
+       id="filter30"
+       x="-0.23378194"
+       y="-0.21630154"
+       width="1.4675639"
+       height="1.4326031">
+      <feGaussianBlur
+         inkscape:collect="always"
+         stdDeviation="13.071903"
+         id="feGaussianBlur30" />
+    </filter>
+    <filter
+       inkscape:collect="always"
+       style="color-interpolation-filters:sRGB"
+       id="filter5"
+       x="-0.041894038"
+       y="-0.041893957"
+       width="1.083788"
+       height="1.0837879">
+      <feGaussianBlur
+         inkscape:collect="always"
+         stdDeviation="1.0664778"
+         id="feGaussianBlur5" />
+    </filter>
+    <filter
+       inkscape:collect="always"
+       style="color-interpolation-filters:sRGB"
+       id="filter6"
+       x="-0.10226285"
+       y="-0.10226277"
+       width="1.2045257"
+       height="1.2045255">
+      <feGaussianBlur
+         inkscape:collect="always"
+         stdDeviation="2.9222677"
+         id="feGaussianBlur6" />
+    </filter>
+    <filter
+       inkscape:collect="always"
+       style="color-interpolation-filters:sRGB"
+       id="filter8"
+       x="-0.30969021"
+       y="-0.30969013"
+       width="1.6193804"
+       height="1.6193802">
+      <feGaussianBlur
+         inkscape:collect="always"
+         stdDeviation="10.040917"
+         id="feGaussianBlur8" />
+    </filter>
+    <filter
+       inkscape:collect="always"
+       style="color-interpolation-filters:sRGB"
+       id="filter10"
+       x="-0.01629857"
+       y="-0.01629849"
+       width="1.0325971"
+       height="1.032597">
+      <feGaussianBlur
+         inkscape:collect="always"
+         stdDeviation="0.49999998"
+         id="feGaussianBlur10" />
+    </filter>
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect16-7"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,8.0780818,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect17-5"
+       is_visible="true"
+       lpeversion="1"
+       nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,7.9986979,0,1 @ F,0,0,1,0,0,0,1"
+       radius="0"
+       unit="px"
+       method="auto"
+       mode="F"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+  </defs>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-6.8045576,-27.991731)">
+    <circle
+       style="opacity:1;fill:#1a1a1a;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.09141;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:0;paint-order:markers stroke fill"
+       id="background"
+       cx="115.18415"
+       cy="136.37132"
+       r="108.37959" />
+    <use
+       x="0"
+       y="0"
+       xlink:href="#use6"
+       id="use7"
+       style="opacity:1;filter:url(#filter8)"
+       inkscape:export-filename="orangOutline.svg"
+       inkscape:export-xdpi="96"
+       inkscape:export-ydpi="96" />
+    <use
+       x="0"
+       y="0"
+       xlink:href="#star"
+       id="use6"
+       style="mix-blend-mode:normal;filter:url(#filter6)"
+       inkscape:export-filename="../../Documents/GitHub/asimonson1125.github.io/src/static/icons/neonfinal3.svg"
+       inkscape:export-xdpi="96"
+       inkscape:export-ydpi="96" />
+    <g
+       id="star"
+       style="display:inline;opacity:1;filter:url(#filter5)"
+       transform="matrix(1.1617659,0,0,1.1617659,37.635304,39.028635)"
+       inkscape:export-filename="../../Documents/GitHub/asimonson1125.github.io/src/static/icons/neonfinal2.svg"
+       inkscape:export-xdpi="96"
+       inkscape:export-ydpi="96">
+      <path
+         style="opacity:1;mix-blend-mode:normal;fill:#b3962d;fill-opacity:1;fill-rule:evenodd;stroke:#ff9c00;stroke-width:0.860759;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;filter:url(#filter10)"
+         d="m 65.084856,67.277241 c -1.287779,9.10845 -5.183319,11.28276 -12.694774,12 -7.511459,0.71725 -34.305226,3 -34.305226,3 0,0 25.891549,1.71223 35,3 9.108454,1.28778 11.282748,4.48855 12,12 0.717252,7.511459 3,34.999999 3,34.999999 0,0 1.712221,-25.89154 3,-34.999999 1.28778,-9.10844 4.488549,-11.28275 11.999999,-12 7.51146,-0.71724 34.999995,-3 34.999995,-3 0,0 -25.891545,-1.71222 -34.999995,-3 -9.10845,-1.28777 -11.282748,-4.48854 -11.999999,-12 -0.717252,-7.51145 -3,-34.999998 -3,-34.999998 0,0 -1.71222,25.891548 -3,34.999998 z"
+         id="path3-6-8"
+         sodipodi:nodetypes="sscsscsscsscs" />
+    </g>
+    <g
+       id="neonHighlights"
+       style="display:inline;opacity:0.75"
+       transform="translate(18.455527)">
+      <use
+         x="0"
+         y="0"
+         xlink:href="#neonTubing"
+         id="use30"
+         style="display:inline;mix-blend-mode:normal;filter:url(#filter30)"
+         transform="translate(-18.455527)" />
+      <use
+         x="0"
+         y="0"
+         xlink:href="#neonTubing"
+         id="use29"
+         style="display:inline;mix-blend-mode:normal;filter:url(#filter29)"
+         transform="translate(-18.455527)" />
+      <use
+         x="0"
+         y="0"
+         xlink:href="#neonTubing"
+         id="use9"
+         style="opacity:1;filter:url(#filter9)"
+         transform="translate(-18.455527)" />
+    </g>
+    <g
+       id="neonTubing"
+       style="fill:none;fill-opacity:1;stroke:#f8e0c3;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       transform="translate(18.455527)">
+      <g
+         id="g1"
+         style="display:none;stroke:#f8e0c3;stroke-width:3;stroke-dasharray:none;stroke-opacity:1">
+        <path
+           style="fill:none;fill-opacity:1;stroke:#f8e0c3;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 129.66155,74.179932 H 61.78218 a 9.6572028,9.6572028 135 0 0 -9.657203,9.657203 v 39.314015"
+           id="path1"
+           inkscape:path-effect="#path-effect9"
+           inkscape:original-d="M 129.66155,74.179932 H 52.124977 v 48.971218" />
+        <path
+           style="fill:none;fill-opacity:1;stroke:#f8e0c3;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 114.02977,84.567913 H 72.042986 a 7.4885845,7.4885845 134.76763 0 0 -7.488338,7.549325 l 0.186961,23.049192"
+           id="path2"
+           inkscape:path-effect="#path-effect8"
+           inkscape:original-d="M 114.02977,84.567913 H 64.493412 l 0.248197,30.598517"
+           transform="translate(-0.40337459,1.3209286)" />
+        <path
+           style="fill:none;fill-opacity:1;stroke:#f8e0c3;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 129.66155,74.179932 H 61.78218 a 9.6572028,9.6572028 135 0 0 -9.657203,9.657203 v 39.314015"
+           id="path1-2"
+           inkscape:path-effect="#path-effect9-9"
+           inkscape:original-d="M 129.66155,74.179932 H 52.124977 v 48.971218"
+           transform="rotate(180,96.802685,134.07745)" />
+        <path
+           style="fill:none;fill-opacity:1;stroke:#f8e0c3;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 114.02977,84.567913 H 72.042986 a 7.4885845,7.4885845 134.76763 0 0 -7.488338,7.549325 l 0.186961,23.049192"
+           id="path2-7"
+           inkscape:path-effect="#path-effect8-2"
+           inkscape:original-d="M 114.02977,84.567913 H 64.493412 l 0.248197,30.598517"
+           transform="rotate(180,97.004375,133.41698)" />
+      </g>
+      <g
+         id="g33"
+         transform="translate(-7.6804235,-33.343613)"
+         style="display:inline;stroke:#f8e0c3;stroke-width:3;stroke-dasharray:none;stroke-opacity:1">
+        <path
+           style="fill:none;stroke:#ededed;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 142.67883,102.44998 H 73.832338 a 10.424106,10.424106 142.5 0 0 -10.068913,7.72615 l -6.688692,24.96254"
+           id="path10"
+           inkscape:path-effect="#path-effect17"
+           inkscape:original-d="M 142.67883,102.44998 H 65.83364 l -8.758907,32.68869"
+           transform="translate(-6.0989631,2.1674006)" />
+        <path
+           style="fill:none;stroke:#ededed;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 156.95436,91.412872 H 56.426396 A 10.527561,10.527561 142.5 0 0 46.257553,99.2157 l -11.945382,44.58078"
+           id="path11"
+           inkscape:path-effect="#path-effect16"
+           inkscape:original-d="M 156.95436,91.412872 H 48.348314 L 34.312171,143.79648" />
+        <path
+           style="display:inline;fill:none;fill-opacity:1;stroke:#ededed;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 142.67883,102.44998 H 73.832338 a 10.424106,10.424106 142.5 0 0 -10.068913,7.72615 l -6.688692,24.96254"
+           id="path10-6"
+           inkscape:path-effect="#path-effect17-5"
+           inkscape:original-d="M 142.67883,102.44998 H 65.83364 l -8.758907,32.68869"
+           transform="rotate(180,105.40367,165.67111)" />
+        <path
+           style="display:inline;fill:none;fill-opacity:1;stroke:#ededed;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+           d="M 156.95436,91.412872 H 56.426396 a 10.496229,10.496229 142.41749 0 0 -10.146361,7.808817 l -13.97988,52.781241"
+           id="path11-2"
+           inkscape:path-effect="#path-effect16-7"
+           inkscape:original-d="M 156.95436,91.412872 H 48.348314 L 32.300155,152.00293"
+           transform="rotate(180,103.61221,167.4007)"
+           sodipodi:nodetypes="ccc" />
+      </g>
+    </g>
+  </g>
+</svg>

src/static/js/checkbox.js

@@ -25,3 +25,17 @@ function toggleCheckbox(dir) {
     }
   }
 }
+
+function activeSkill(obj) {
+  if (obj.parentElement.classList.contains("activeSkill")) {
+    obj.parentElement.classList.remove("activeSkill");
+    return;
+  }
+  // document.querySelectorAll(".skill").forEach((x) => {
+  //   x.classList.remove("activeSkill");
+  // });
+  while (obj.parentElement.classList.contains("skill")) {
+    obj = obj.parentElement;
+    obj.classList.add("activeSkill");
+  }
+}

src/static/json/skills.json

@@ -0,0 +1,27 @@
+{
+    "Data and AI": {
+        "Python": {
+            "PyTorch/TensorFlow": {},
+            "TensorFlow": {},
+            "Numpy/Pandas": {},
+            "Selenium/BS4": {}
+        },
+        "R": {},
+        "SQL": {}
+    },
+    "Frontend": {
+        "Flask (Python)": {},
+        "React (Javascript)": {},
+        "Angular (Typescript)": {}
+    },
+    "Backend & DevOps": {
+        "DevOps": {
+            "Docker": {},
+            "Microsoft Azure": {},
+            "Kubernetes/Openshift": {},
+            "Bash": {}
+        },
+        "C#": {},
+        "C++": {}
+    }
+}

src/templates/about.html

@@ -2,7 +2,6 @@
 <div class="foreground"></div>
 <div class="foregroundContent">
   <div class="relative">
-    <div id="aboutGrid">
       <div id="aboutMe" class="col" data-aos="fade-up">
         <h2 class="concentratedHead">About Me</h2>
         <p>
@@ -12,19 +11,15 @@
           science with a focus on predictive analytics.
         </p>
         <p>
-          <br /><br />
+          <br />
           Ominous positivity is kinda my thing.
         </p>
+        <br />
       </div>
       <div class="col rightCol" data-aos="fade-up">
         <div id="skills">
-          <!-- <h2>Skills</h2> -->
+          <h2 id="skillstag">Skills</h2>
-          {% from 'partials/skills.html' import skills %} {{ skills([ "Python",
+          {% from 'partials/skills.html' import skills %} {{ skills(var['skillList']) }}
-          "JavaScript", "Java", "C", "C++", "R", "MIPS Assembly", "Processing",
-          "P5.js", "SQL", "SQLite", "PostgreSQL", "SQLAlchemy", "HTML", "CSS",
-          "Docker", "LaTeX", "ArcGIS", "Git", "Github", "Linux", "OKD4",
-          "Kubernetes", "Openshift", "Nginx", "Angular", "Flask", "Jinja", "Web
-          Scraping", "Google API", "React", "Node.js", "ArcGIS", ]) }}
         </div>
         <div id="timeline">
           <h2>Timeline</h2>
@@ -85,37 +80,6 @@
             toggleCheckbox("up");
           </script>
         </div>
-      </div>
-      <!-- {/* <div data-aos="fade-up" class="elementBlock">
-      <h2>Extracirricular Awards</h2>
-      <MyCarousel class="carousel" data-aos="fade-up">
-        {[
-          {
-            original: img4,
-            description:
-              "High School VEX Robotics President and Team Leader",
-          },
-          {
-            original: img5,
-            description:
-              "We the People Civics Competition District Champions",
-          },
-          {
-            original: img6,
-            description: "We The People State Civics Competition Champions",
-          },
-          {
-            original: img7,
-            description:
-              "what it looks like to compete in We the People Nationals, circa 2020",
-          },
-          {
-            original: img3,
-            description: "Academic Team county championships",
-          },
-        ]}
-      </MyCarousel>
-    </div> */} -->
     </div>
   </div>
 </div>

src/templates/header.html

@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="{{ url_for('static', filename='icons/neonfinal3.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'] }}" />

src/templates/home.html

@@ -6,7 +6,7 @@
 />
 <h1 id="homeName" class='textGrad'>Andrew Simonson</h1>
 <h3>Computer Science student at Rochester Institute of Technology</h3>
-<h5>🦅 🦅 🦅 Raahhh wtf is homepage content, we don't do that here 🦅 🦅 🦅</h5>
+<h5>End-to-End Services in Data Science and AI</h5>
 {% endmacro %}
 
 <div class="foreground homeground"></div>
@@ -24,12 +24,6 @@
         </div>
       </div>
       <div class="onRight" data-aos="fade-up">
-        <img
-          src="{{ url_for('static', filename='readme-stats-vercel-01-25-2023.svg') }}"
-          class="langstats"
-          alt="Language stats"
-        />
-        <br />
         <div class="chess">
           {% from 'partials/chess.html' import chess %} {{
           chess('asimonson1125') }}

src/templates/partials/skills.html

@@ -1,5 +1,16 @@
+{% macro expandSkill(dict, name, classes="") %} 
+<div class='skill {{ classes }}' data-length='{{ dict[name]|length }}'>
+    <div onclick='activeSkill(this)' class='skillname'>{{ name }}</div>
+{% for child in dict[name] %}
+{{ expandSkill(dict[name], child) }}
+{% endfor %} 
+</div>
+{% endmacro %}
+
 {% macro skills(skills) %}
-<ul class='skills'>
+<div id="skillTree">
-    {% for i in skills %}<li class='skill'>{{i}}</li>{% endfor %}
+    {% for skill in skills %}
-</ul>
+    {{ expandSkill(skills, skill, 'activeSkill') }}
+    {% endfor %}
+</div>
 {% endmacro %}

src/templates/projects.html

@@ -3,6 +3,7 @@
 <div class="foregroundContent">
     <div data-aos="fade-up">
       <h2 class="concentratedHead">Projects</h2>
+      <h3>Shhh shh shh sh sh I know I know I'm gonna revamp this page later </h3>
       <p>
         Project status is indicated by the color of the project card:
         <br />