archived past projects

wenxich · Dec 16, 2023 · c188b5a · c188b5a
1 parent def8351
commit c188b5a
Show file tree

Hide file tree

Showing 2 changed files with 87 additions and 60 deletions.
diff --git a/archive.html b/archive.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8"/>
+    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
+    <meta content="noindex" name="robots"/>
+    <title>Wenxi Chen: Archive</title>
+    <link href="images/wenguin.png" rel="icon" type="image/x-icon">
+    <link href="style.css" media="all" rel="stylesheet" type="text/css"/>
+</head>
+
+<noscript>
+    <div id="no-script" style="background: black; color: white; padding: 4.5vh; text-align: center;">
+        You need to enable JavaScript to view the full site / for the site to work.
+    </div>
+</noscript>
+<!--- noscript can be used to show a message if JavaScript is deactivated--->
+
+<body class="monospace-font">
+
+<div id="projects-section">
+    <div class="project-wrapper projects">
+        <img alt="Lunchbox" class="image" src="images/projects/lunchbox.gif"/>
+        <div class="text-wrapper">
+            <span class="project-title">Lunchbox</span>
+            <a class="button" href="https://www.figma.com/proto/Uqj7PtGo2YlNJeGpGoCREo/lunchbox-mockup?page-id=0%3A1&type=design&node-id=1-2&viewport=482%2C-239%2C0.71&t=EmfVDQIk8hLiaTww-1&scaling=scale-down&starting-point-node-id=1%3A2&mode=design">Prototype</a>
+
+            <span class="project-desc">
+                <br>2022, Personal Project
+                <br>> <i>Made with:</i> Figma
+            </span>
+        </div>
+    </div>
+    <div class="project-wrapper projects">
+        <img alt="Student Essentials" class="image" src="images/projects/essentials.gif"/>
+        <div class="text-wrapper">
+            <span class="project-title">Student Essentials</span>
+            <a class="button" href="https://github.com/wenxich/student-essentials">Code</a> <a
+                class="button" href="https://essentials.neocities.org/">Site</a>
+
+            <span class="project-desc">
+                <br>2021, Personal Project
+                <br>> <i>Made with:</i> JavaScript, HTML/CSS
+            </span>
+        </div>
+    </div>
+    <div class="project-wrapper design">
+        <img alt="Subtlety" class="image" src="images/projects/subtlety.gif"/>
+        <div class="text-wrapper">
+            <span class="project-title">Subtlety</span>
+            <a class="button" href="https://artforaltruism.threadless.com/collections/subtlety">Site</a>
+
+            <span class="project-desc">
+                <br>2020-2021, Personal Project
+                <br>> <i>Made with:</i> Adobe Photoshop, MediBang Paint
+            </span>
+        </div>
+    </div>
+    <div class="project-wrapper design">
+        <img alt="Strawbaby" class="image" src="images/projects/strawbaby.gif"/>
+        <div class="text-wrapper">
+            <span class="project-title">Strawbaby</span>
+            <a class="button" href="https://artforaltruism.threadless.com/designs/strawbaby">Site</a>
+
+            <span class="project-desc">
+                <br>2020, Personal Project
+                <br>> <i>Made with:</i> Adobe Photoshop, MediBang Paint
+            </span>
+        </div>
+    </div>
+</div>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.1/TweenMax.min.js"></script>
+<script src="index.js"></script>
+
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -46,14 +46,13 @@
 <div id="filters-section">
     <div id="filters-wrapper">
         <button class="filter active" onclick="filterSelection('all')"> All</button>
-        <button class="filter" onclick="filterSelection('programming')"> Programming</button>
-        <button class="filter" onclick="filterSelection('design')"> Design</button>
+        <button class="filter" onclick="filterSelection('projects')"> Projects</button>
         <button class="filter" onclick="filterSelection('playground')"> Playground</button>
     </div>
 </div>
 
 <div id="projects-section">
-    <div class="project-wrapper programming">
+    <div class="project-wrapper projects">
         <img alt="The Synthesis Lab" class="image" src="images/projects/synthesis.gif"/>
         <div class="text-wrapper">
             <span class="project-title">The Synthesis Lab</span>
@@ -65,7 +64,7 @@
             </span>
         </div>
     </div>
-    <div class="project-wrapper programming">
+    <div class="project-wrapper projects">
         <img alt="i3DGS" class="image" src="images/projects/i3dgs.gif"/>
         <div class="text-wrapper">
             <span class="project-title">i3DGS</span>
@@ -78,28 +77,28 @@
             </span>
         </div>
     </div>
-    <div class="project-wrapper programming">
+    <div class="project-wrapper projects">
         <img alt="FamilyHub" class="image" src="images/projects/familyhub.gif"/>
         <div class="text-wrapper">
             <span class="project-title">FamilyHub</span>
             <a class="button" href="https://github.com/christinaqiu3/FamilyHub">Code</a> <a
                 class="button" href="https://wenxich.medium.com/familyhub-stay-close-even-miles-apart-ae5b19947382">Info</a>
 
             <span class="project-desc">
-                <br>2023, CIS 4120 Final Project</a>
-                <br>> <i>Made with:</i> React, Next.js
+                <br>2023, CIS 4120 Final Project
+                <br>> <i>Made with:</i> Next.js (React), Figma
             </span>
         </div>
     </div>
-    <div class="project-wrapper programming">
+    <div class="project-wrapper playground">
         <img alt="Text Art Generator" class="image" src="images/projects/ascii.gif"/>
         <div class="text-wrapper">
             <span class="project-title">Text Art Generator</span>
             <a class="button" href="https://editor.p5js.org/wenxi/sketches/zbfx-Bhzd">Code</a> <a
                 class="button" href="https://editor.p5js.org/wenxi/full/zbfx-Bhzd">Site</a>
 
             <span class="project-desc">
-                <br>2023, Personal Project</a>
+                <br>2023, Personal Project
                 <br>> <i>Made with:</i> p5.js
             </span>
         </div>
@@ -152,19 +151,7 @@
             </span>
         </div>
     </div>
-    <div class="project-wrapper design">
-        <img alt="Lunchbox" class="image" src="images/projects/lunchbox.gif"/>
-        <div class="text-wrapper">
-            <span class="project-title">Lunchbox</span>
-            <a class="button" href="https://www.figma.com/proto/Uqj7PtGo2YlNJeGpGoCREo/lunchbox-mockup?page-id=0%3A1&type=design&node-id=1-2&viewport=482%2C-239%2C0.71&t=EmfVDQIk8hLiaTww-1&scaling=scale-down&starting-point-node-id=1%3A2&mode=design">Prototype</a>
-
-            <span class="project-desc">
-                <br>2022, Personal Project
-                <br>> <i>Made with:</i> Figma
-            </span>
-        </div>
-    </div>
-    <div class="project-wrapper programming">
+    <div class="project-wrapper projects">
         <img alt="3D Render Engine" class="image" src="images/projects/3dre.gif"/>
         <div class="text-wrapper">
             <span class="project-title">3D Render Engine</span>
@@ -176,7 +163,7 @@
             </span>
         </div>
     </div>
-    <div class="project-wrapper programming">
+    <div class="project-wrapper projects">
         <img alt="Snake" class="image" src="images/projects/snake.gif"/>
         <div class="text-wrapper">
             <span class="project-title">Snake</span>
@@ -188,43 +175,6 @@
             </span>
         </div>
     </div>
-    <div class="project-wrapper programming">
-        <img alt="Student Essentials" class="image" src="images/projects/essentials.gif"/>
-        <div class="text-wrapper">
-            <span class="project-title">Student Essentials</span>
-            <a class="button" href="https://github.com/wenxich/student-essentials">Code</a> <a
-                class="button" href="https://essentials.neocities.org/">Site</a>
-
-            <span class="project-desc">
-                <br>2021, Personal Project
-                <br>> <i>Made with:</i> JavaScript, HTML/CSS
-            </span>
-        </div>
-    </div>
-    <div class="project-wrapper design">
-        <img alt="Subtlety" class="image" src="images/projects/subtlety.gif"/>
-        <div class="text-wrapper">
-            <span class="project-title">Subtlety</span>
-            <a class="button" href="https://artforaltruism.threadless.com/collections/subtlety">Site</a>
-
-            <span class="project-desc">
-                <br>2020-2021, Personal Project
-                <br>> <i>Made with:</i> Adobe Photoshop, MediBang Paint
-            </span>
-        </div>
-    </div>
-    <div class="project-wrapper design">
-        <img alt="Strawbaby" class="image" src="images/projects/strawbaby.gif"/>
-        <div class="text-wrapper">
-            <span class="project-title">Strawbaby</span>
-            <a class="button" href="https://artforaltruism.threadless.com/designs/strawbaby">Site</a>
-
-            <span class="project-desc">
-                <br>2020, Personal Project
-                <br>> <i>Made with:</i> Adobe Photoshop, MediBang Paint
-            </span>
-        </div>
-    </div>
 </div>
 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.1/TweenMax.min.js"></script>