Added system verilog video

src/assets/style.css

@@ -1,8 +1,10 @@
 /*
-If your CSS is over 500 lines long
+If your CSS is over 1000 lines long
 then you're doing something wrong.
 */
 
+/* Font */
+
 @font-face {
     font-family: 'FiraSans';
     font-display: swap;
@@ -24,7 +26,8 @@ body {
 
 main {
     flex: 1;
-    width: min(95%, 50rem);
+    max-width: 50rem;
+    width: 95%;
     margin: auto;
 }
 
@@ -46,7 +49,7 @@ h1 {
 }
 
 h2 {
-    padding-bottom: 0.4em;
+    padding-bottom: 0.3em;
     border-bottom: 1px solid #595959;
 }
 
@@ -74,12 +77,11 @@ a:hover {
 /* Lists */
 
 li {
-    line-height: 1.8;
     margin: 1em;
 }
 
 li.post-item {
-    line-height: 1.5em;
+    line-height: 1.3;
     list-style: none;
 }
 
@@ -96,7 +98,6 @@ ul.comma-list {
 
 ul.comma-list li {
     display: inline;
-    line-height: 1;
     margin: 0;
 }
 
@@ -117,14 +118,13 @@ ul.comma-list li:last-child:after {
 table {
     border-collapse: collapse;
     background-color: #2f2f2f;
+    margin: auto;
     box-shadow: 0 0 0.5rem #000000;
-    margin-left: auto;
-    margin-right: auto;
 }
 
 th,
 td {
-    padding: 1em;
+    padding: 0.8em;
 }
 
 tr:nth-child(even) {
@@ -135,27 +135,25 @@ tr:nth-child(even) {
 /* Content */
 
 img,
-video {
+video,
+iframe {
     display: block;
     max-width: 100%;
-    height: auto;
     margin: 2rem auto 2rem auto;
     border-radius: 1rem;
     box-shadow: 0 0 0.5rem #000000;
 }
 
-iframe {
-    display: block;
-    max-width: 100%;
-    margin: 2rem auto 2rem auto;
-    border-radius: 1rem;
-    box-shadow: 0 0 0.5rem #000000;
+img,
+video {
+    height: auto;
 }
 
 
 #glcanvas {
     width: 100%;
-    height: min(50rem, 80vh);
+    max-height: 50rem;
+    height: 60vh;
     border-radius: 1rem;
     box-shadow: 0 0 0.5rem #000000;
 }

src/index.md

@@ -9,7 +9,7 @@ Download my <a href="https://raw.githubusercontent.com/manforowicz/resume/main/r
 
 ## Circuit Boards
 
-I really like designing circuit boards.
+I enjoy designing circuit boards.
 Here are a few that I'm particularly proud of:
 
 <div class="horizontal-container">
@@ -77,10 +77,15 @@ Some relevant courses I've taken at the University of Washington include:
 
 - **The Hardware/Software Interface** - Here I learned to use gdb, read assembly, and understand memory layout.
 
-- **Introduction to Digital Design** - Here I made a snake game on an FPGA, by writing a multi-file system verilog program.
-
 - **Machine Learning** - Here I used PyTorch and Numpy to implement algorithms such as LASSO regression, stochastic gradient descent, and backpropagation.
 
+- **Introduction to Digital Design** - Here I wrote a snake game in SystemVerilog. SystemVerilog is a language that compiles into logic gates and can be run on FPGAs (field programmable gate arrays).
+
+<video width="854" height="480" controls preload="metadata" style="max-width: 75%;">
+    <source src="/assets/verilog_snake.mp4" type="video/mp4">
+    Your browser does not support the video tag.
+</video>
+
 
 ## Book Recommendations
 
@@ -112,4 +117,4 @@ This book derives a comprehensive framework for analyzing negotiations and creat
 
 
 ### [How to Drive a Nuclear Reactor](https://www.goodreads.com/en/book/show/50878951) - Colin Tucker
-Ever wondered how a nuclear reactor works? How do they reliably and safely produce [10% of the world's electricity](https://ourworldindata.org/electricity-mix)? This book, written by a reactor operator, strikes the perfect balance between dumbed-down and too-technical.
+Ever wondered how a nuclear reactor works? How do they reliably and safely produce about [10% of the world's electricity](https://ourworldindata.org/electricity-mix)? This book, written by a reactor operator, strikes the perfect balance between dumbed-down and too-technical.