remove project imgs

index.html

@@ -130,43 +130,37 @@ <h2>Projects | Experiments | Games</h2>
     <div class="project-grid">
         <a class="project" href="https://github.com/ryan0/thwomp-chat-client">
             <div class="light-up"></div>
-            <img src="/project-imgs/thwomp-chat-img.png" alt="image of thwomp chat site">
             <h3>Thwomp Chat <em>&#8599;</em></h3>
             <p>In development, a web-app enabling authenticated users to connect with peers and create chat
                 groups. Built using Angular, Java Spring, and Websockets.</p>
         </a>
         <a class="project" href="https://github.com/ryan0/Voxel-Rogue">
             <div class="light-up"></div>
-            <img src="/project-imgs/voxel-game-img.jpg" alt="image of voxel game">
             <h3>3D Voxel Game <em>&#8599;</em></h3>
             <p>Built using Unity and C#. Featuring procedural terrain generation, efficient
                 resource management, and voxel state propagation for interactive environments.</p>
         </a>
         <a class="project" href="https://ryan0.github.io/WebGL-06/">
             <div class="light-up"></div>
-            <img src="/project-imgs/light-speed-img.jpg" alt="image of light speed webGL render">
             <h3>Lightspeed <em>&#8599;</em></h3>
             <p>An interactive demo of some of the fun that can be had with GPU rendering in a web browser using
                 webGL.</p>
         </a>
         <a class="project" href="https://github.com/ryan0/asteroids_clone_sdl">
             <div class="light-up"></div>
-            <img src="/project-imgs/asteroids-game-img.png" alt="image of asteroids game">
             <h3>Asteroids <em>&#8599;</em></h3>
             <p>A clone of your favorite asteroid shooter! Cross-platform and built with C++ using the SDL library for
                 graphics, sound, and responsive controls. With CMake and vcpkg, setup is simple on any machine or
                 architecture.</p>
         </a>
         <a class="project" href="https://github.com/ryan0/vid-chat-app">
             <div class="light-up"></div>
-            <img src="/project-imgs/vid-call-img.png" alt="image of video call site">
             <h3>Video Call Site <em>&#8599;</em></h3>
             <p>Developed a web application enabling authenticated users to engage in real-time video calls
                 using vanilla JavaScript, Socket.IO, WebRTC, and Node.js Express for backend.</p>
         </a>
         <a class="project" href="https://github.com/ryan0/TetrisClone">
             <div class="light-up"></div>
-            <img src="/project-imgs/block-game-img.png" alt="image of tetris clone in action">
             <h3>Block Game <em>&#8599;</em></h3>
             <p>Lightweight clone of the classic block-stacking game, built with plain JS and HTML. Includes mobile
                 support for a retro experience. You know the game, it's Tetris.</p>

src/style.css

@@ -155,8 +155,7 @@ div.project-section {
   max-width: 1020px;
 
   h2 {
-    margin-left: auto;
-    margin-right: auto;
+    margin-left: 20px;
     max-width: 820px;
     margin-bottom: 50px;
   }
@@ -167,7 +166,7 @@ div.project-section {
 .project-grid {
   display: grid;
   grid-template-columns: auto auto auto;
-  gap: 24px;
+  gap: 40px;
 
   @media (max-width: 980px) {
     grid-template-columns: auto auto;
@@ -179,17 +178,10 @@ div.project-section {
 
   .project {
     position: relative;
-    padding: 10px;
-    background-color: #131313;
-    box-shadow: 2px 3px 5px #131313;
+    padding: 0 0 0 24px;
+    border-left: 2px solid;
     color: rgba(255, 255, 255, 0.87);
-    border-radius: 4px;
     overflow: hidden;
-    img {
-      width: calc(100% + 20px);
-      margin-top: -10px;
-      margin-left: -10px;
-    }
     h3 {
       transition: .15s;
       em {