polish projects

src/content/projects/-index.mdx

@@ -7,14 +7,15 @@ description: Reed Nelson's projects.
 <ProjectHeader
     title="MiNAA: Microbiome Network Alignment Algorithm"
     tech=" | C | C++ | R"
+    technologies={["C", "C++", "R"]}
     github="https://github.com/solislemuslab/minaa"
 />
 
 Microbes in the soil interact in complex ways, and these microbiomes can be represented by large, sparse graphs. Currently this kind of data is available, but tools for interpreting it are very limited. The project is to develop an algorithm to efficiently and accurately align microbial networks based on topological and biological input data. This is an ongoing research project with Dr. Claudia Solís-Lemus. For more details, see our software note on [arXiv](https://arxiv.org/abs/2212.05880).
 
 <ProjectHeader
     title="AAG Key Exchange Implementation"
-    tech=" | Python | SageMath"
+    technologies={["Python", "SageMath"]}
     github="https://github.com/reednel/aag"
 />
 
@@ -24,7 +25,7 @@ This progect provides the first generic implementation of AAG, using the SageMat
 
 <ProjectHeader
     title="De Bruijn Tools"
-    tech=" | Java"
+    technologies={["Java"]}
     github="https://github.com/reednel/debruijn"
 />
 
@@ -34,7 +35,7 @@ The De Bruijn Tools are a set of algorithms developed for Ben Cartford, an under
 
 <ProjectHeader
     title="LatinxInStat & ForensicStat Databases"
-    tech=" | Javascript + React | MySQL | OAuth"
+    technologies={["Javascript + React", "MySQL", "OAuth"]}
     github="https://github.com/solislemuslab/latinx-stat-database"
 />
 
@@ -43,30 +44,30 @@ The [LatinxInStat Database](https://latinxinstat.wid.wisc.edu/) is a web app des
 Similar in spirit, the ForensicStat Database provides a list of statisticians and data scientists that are interested in aiding forensic scientists or attorneys in the understanding of statistical concepts in forensic science, or serving as experts in trials.
 
 <ProjectHeader
-    title="E<sup>2</sup> Flasher"
-    tech="C# + WPF"
+    title="E2 Flasher"
+    technologies={["C# + WPF"]}
 />
 
 An E<sup>2</sup> (EEPROM) is a kind of non-volatile read-only memory, which in this case houses the firmware for a particular Emerson product. The goal was to make it possible for this product to receive firmware updates even after final assembly, saving many units from obsolescence. The project was a windows desktop application which connected and translated data between the user and EEPROM over a UART channel using a proprietary protocol.
 
 <ProjectHeader
     title="Kanban Manager"
-    tech="C# + WinForms | SQL"
+    technologies={["C# + WinForms", "SQL"]}
 />
 
 A kanban in this context referred to a set of shelves whose inventory is tracked. Prior to this, an Emerson manufacturing facility used pen and pad to track inventory. The project was to develop a fullstack Windows desktop app to digitalize this system with Winforms, C#, and SQL. This solution was integrated into the proprietary MES, and leveraged existing network and database infrastructure, making the transition from analog easy.
 
 <ProjectHeader
     title="It's Your Move"
-    tech=" | Javascript + React "
+    technologies={["Javascript + React"]}
     github="https://github.com/IYM-2021/raam-webapp"
 />
 
 It's Your Move was an ambitious athletics project from the team that worked on [The Perfect Race](http://raam.davehaase.com/) project for Dave Haase's [Race Across America](https://www.raceacrossamerica.org) in 2019. The long term goal of this endeavor was to motivate ley folk to build and stick to fitness habits, and to satiate the desires of hardcore athletes concerned with data like glucose level, core temperature, and more. This effort integrated software and hardware from athletic, medical, IoT and AI areas into a unified platform. My contribution to this platfrom lied primarily in the front-end development of the web app.
 
 <ProjectHeader
     title="Conway's Game of Life"
-    tech=" | Java + JavaFX"
+    technologies={["Java + JavaFX"]}
     github="https://github.com/reednel/Seagull-1"
 />
 

src/layouts/helpers/DynamicIcon.tsx

@@ -1,13 +1,6 @@
 import React, { FC } from "react";
 import type { IconType } from "react-icons";
 import * as FaIcons from "react-icons/fa6/index.js";
-// import * as AiIcons from "react-icons/ai/index.js";
-// import * as BsIcons from "react-icons/bs/index.js";
-// import * as FiIcons from "react-icons/fi/index.js";
-// import * as Io5Icons from "react-icons/io5/index.js";
-// import * as RiIcons from "react-icons/ri/index.js";
-// import * as TbIcons from "react-icons/tb/index.js";
-// import * as TfiIcons from "react-icons/tfi/index.js";
 
 type IconMap = Record<string, IconType>;
 

src/layouts/shortcodes/ProjectHeader.tsx

@@ -1,27 +1,37 @@
 import React from "react";
-import { FaGithub } from "react-icons/fa/index.js";
+import { FaGithubSquare } from "react-icons/fa/index.js";
 
 const ProjectHeader = ({
     title,
-    tech,
+    technologies,
     github,
 }: {
     title: string;
-    content?: string;
+    technologies?: Array<string>;
     github?: string;
 }) => {
   return (
     <div>
         <div className="mt-8">
-            <h1 className="text-3xl font-bold">{title}</h1>
+            <h3> {title} </h3>
         </div>
-        <div className="">
-            {github ? 
+        <div className="-mt-4">
+            {github &&
                 <a href={github} target="blank">
-                    <FaGithub className={"mr-1 -mt-1 inline-block"} />
-                </a>: ""
+                    <FaGithubSquare className={"text-light -mt-1 mr-0.5 inline-block h-8 w-8"} />
+                </a>
+            }
+            {
+                technologies?.map((element) => {
+                    return (
+                        <li className="inline-block h-8">
+                          <div className="m-1  block border border-light bg-transparent text-light rounded-sm px-2 dark:text-darkmode-light dark:border-darkmode-light">
+                            {element}
+                          </div>
+                        </li>
+                      );
+                })
             }
-            {tech}
         </div>
     </div>
   );

src/pages/riddles.astro

@@ -18,7 +18,7 @@ const { title, meta_title } = riddles.data;
       <div class="row justify-center">
         <div class="col-10">
           <div class="content">
-            <Content /> 
+            <Content />
           </div>
         </div>
       </div>