diff --git a/projects.html b/projects.html index 9a6fffe..92248f9 100644 --- a/projects.html +++ b/projects.html @@ -40,7 +40,7 @@
-

Ace of Shades

+

Ace of Shades

A top-down 2D shooter game inspired by Ace of Spades, and was made as a submission the 2021 Java Discord server's Java Jam. Includes a dedicated server, client, and server registry application.

@@ -52,16 +52,20 @@ allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen> - Java programming language logo +
+ Java programming language logo +
-

Ace of Shades 2

+

Ace of Shades 2

A 3D first-person shooter designed as the successor to Ace of Shades. This was again made as a 2022 Java Discord Java Jam submission, but I continued to develop it well beyond that.

- Java programming language logo - OpenGL API logo +
+ Java programming language logo + OpenGL API logo +
@@ -79,11 +83,13 @@ server.start(); } - D programming language logo +
+ D programming language logo +
-

Movescript & Itemscript

+

Movescript & Itemscript

Simple grammars for concisely defining robotic movement and inventory management for ComputerCraft robots in Minecraft.

@@ -106,18 +112,23 @@ local ms = require("movescript") ms.run("2FUDg") - Lua programming language logo +
+ Lua programming language logo +
-

Rail Signal

+

Rail Signal

API and web app for designing and managing rail systems, with real-time data updates via websockets. Originally designed for use with Minecraft and the Immersive Railroading mod, but practically can be used anywhere, as long as you've got the right device driver.

- Java programming language logo - Spring Framework logo - Vue JS framework logo - Lua programming language logo + +
+ Java programming language logo + Spring Framework logo + Vue JS framework logo + Lua programming language logo +
@@ -142,7 +153,9 @@ } } - D programming language logo +
+ D programming language logo +
@@ -150,7 +163,30 @@

A library that defines compile-time primitives and helper functions for working with streams of elements. A stream is anything which provides a readFromStream or writeToStream method. Also includes many stream implementations for things like files, sockets, chunked encoding, buffering, and more.

- D programming language logo +
+ D programming language logo +
+
+ +
+

Record-Net

+

+ A Java library for defining common protocol of binary messages to transmit over the network, similar to Protocol Buffers, but for pure Java applications, so it can take advantage of records and avoid code-generation. +

+
+ Java programming language logo +
+
+ +
+

Coyote Credit

+

+ A web application for students to learn the basics of real-world stock trading through a simplified user interface and simulated accounts. +

+
+ Java programming language logo + Spring Framework logo +
diff --git a/styles/project.css b/styles/project.css index 261ba92..0561878 100644 --- a/styles/project.css +++ b/styles/project.css @@ -1,11 +1,56 @@ -.project-card { - background-color: var(--background-color-2); - padding: 0.5em; - margin-top: 1em; +body { + max-width: 100%; } -.project-card h2 { +/* This is the container for all cards. */ +main { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: flex-start; + align-items: stretch; + align-content: flex-start; + gap: 2em 2em; +} + +article { + background-color: var(--background-color-2); + padding: 0.5em; + width: calc((100% / 3) - 2.4em); + display: flex; + flex-direction: column; +} + +@media(max-width: 1000px) { + article { + width: calc((100% / 2) - 2.4em); + } +} + +@media(max-width: 480px) { + article { + width: 100%; + } +} + +article:nth-child(odd) { + background-color: var(--background-color-3); +} + +article h2 { margin-top: 0; + margin-bottom: 0.5em; +} + +article p { + margin-top: 0.25em; + margin-bottom: 0.25em; +} + +.icons-row { + width: 100%; + margin-top: auto; + padding-top: 0.5em; } .lang-icon { diff --git a/styles/style.css b/styles/style.css index 16d2ec7..c5c7a0a 100644 --- a/styles/style.css +++ b/styles/style.css @@ -65,6 +65,8 @@ code { .page-header { text-align: center; + max-width: 50ch; + margin: 0 auto; } .page-header div {