index.html

@@ -67,9 +67,21 @@
     }
   
     .flextape {
-        margin: 0 auto;
-        display: -webkit-flex;
-        display: flex;
+      display: grid;
+      gap: 1rem;
+      grid-template-columns: 1fr 1fr 1fr;
+    }
+
+    @media (min-width: 600px) and (max-width: 979px) {
+      .flextape {
+        grid-template-columns: 1fr 1fr;
+      }
+    }
+    
+    @media (max-width: 600px) {
+      .flextape {
+        grid-template-columns: 1fr;
+      }
     }
 
     .memcomment {
@@ -145,7 +157,7 @@
         <h1>Current projects</h1> <br><br>
       </div>
 
-      <div class="row-fluid flextape">
+      <div class="flextape">
         <!-- Top row -->
         <!-- Template:
         <div class="span4 memcomment">
@@ -154,36 +166,33 @@
             <p class="author"> author name </p>
         </div>
         -->
-        <div class="span4 memcomment">
+        <div class="memcomment">
           <h2>Building a PBX</h2>
           <p>FusionPBX is very nice and all but it is missing some features that would be necessary for it to be used at my workplace. Since I do have some knowledge of PHP I've decided to try and implement the missing features myself. You can view my progress on <a href="git/crt/fusionpbx-ldap">512mb's gitea.</a></p>
           <p class="author">- crt</p>
         </div>
-        <div class="span4 memcomment">
+        <div class="memcomment">
           <h2>Rework of Network</h2>
           <p>As of now 512mb's network is kinda messy, Which is why I'm planing on doing a full rework of 512mb's networks. These plans include things such as proper network seperation, less cable spaghetti, better documentation and much more.</p>
           <p class="author">- crt</p>
         </div>
-        <div class="span4 memcomment">
+        <div class="memcomment">
           <h2>Coding FPGAs</h2>
           <p>Currently doing a distance measurement project with sub-micrometer precision using entry-level FPGAs and Fourier transform.</p>
           <p class="author">- Dalibor</p>
         </div>
-      </div>
-
-      <div class = "row-fluid flextape">
         <!-- Bottom row -->
-        <div class="span4 memcomment">
+        <div class="memcomment">
           <h2>Building Reno</h2>
           <p><a href="git/Yessiest/reno">Reno</a> is my next big desktop project, which was initially a continuation of my previous AwesomeWM config. The functionality of Reno has been growing ever since, and eventually I'm planning to add a GTK configuration app for it.</p>
           <p class="author">- Yessiest</p>
         </div>
-        <div class="span4 memcomment">
+        <div class="memcomment">
           <h2>Offsite backup</h2>
           <p>Since my old offsite backup solution is nolonger applicable I'm working on a new one which will either be on Hetzner servers or at someone elses place.</p>
           <p class="author">- crt</p>
         </div>
-        <div class="span4 memcomment">
+        <div class="memcomment">
           <h2>Building the tools</h2>
           <p>I'm practically the most active person on 512mb in terms of uploading to gitea, so you can find most of the stuff I do on <a href="git/explore/repos">512mb's gitea page.</a> Currently I'm building Heimdall - the bridge for all of my bots to connect XMPP, Discord, IRC, Mumble and so on.</p>
           <p class="author">- Yessiest</p>