ok

public/index.html

@@ -7,6 +7,9 @@
     <!--- <title>bvanroll.neocities</title> --->
     <link rel="stylesheet" href="main.css">
     <!-- shader as bg via xemantic/shader-web-background -->
+    <style>
+
+    </style>
     <script src="https://xemantic.github.io/shader-web-background/dist/shader-web-background.min.js"></script>
     <script type="x-shader/x-fragment" id="image">
       precision mediump float;
@@ -97,7 +100,7 @@
         </ul>
     </div> 
     <div class="links">
-      <h2>My links/contact:</h2>
+      <h2>my links/contact:</h2>
       <p><a href="mailto:beppe.vanrolleghem@gmail.com">my email</a> probably the best way to get in contact with me</p>
       <p><a href="https://www.tiktok.com/@bvanroll">tiktok</a> my fav social media, mostly posting what i draw on there, another good way to get in contact with me</p>
       <p><a href="https://steamcommunity.com/id/bvanroll/">steam</a> Gamers tend to be pretty toxic so most of the things on here are set to private, but if you wanna see what games i enjoy it's pretty good</p>
@@ -115,6 +118,8 @@
 
 
 
+    <h2> what's coming </h2>
+    <p> i really wanna make a shader that emulates my "boxes" i've been drawing recently and use it as the background for this page. It's gonna be a wip but i think it's gonna be really cool if i can get it to work. I hope i can do it in 2d emulating 3d but i might have to do the 3d shader thing that i'm dreading</p>
     </div>
   </body>
 </html>

public/main.css

@@ -1,8 +1,11 @@
+
+@import url(https://cdn.jsdelivr.net/npm/firacode@6.2.0/distr/fira_code.css);
+
 body {
-  font-family: "arial";
+  font-family: "Fira Code", monospace;
   color: white;
-  text-shadow: -1px -1px 0 #000, 1px -1px #000, -1px 1px #000, 1px 1px #000;
-  display: grid;
+  /*text-shadow: -1px -1px 0 #000, 1px -1px #000, -1px 1px #000, 1px 1px #000;*/
+  /*display: grid;*/
   background: #333;
 }
 
@@ -25,16 +28,15 @@ a:hover {
 
 a:active {
   color: white;
-  text-shadow: -1px -1px 0 #000, 1px -1px #000, -1px 1px #000, 1px 1px #000;
+  /*text-shadow: -1px -1px 0 #000, 1px -1px #000, -1px 1px #000, 1px 1px #000;*/
 }
 
 * {
-  font-family:"arial"
 }
 
 .header {
-  height: 10vh;
-  float: left;
+  /*height: 10vh;*/
+  /*float: left;*/
 }
 
 .main_view {
@@ -45,9 +47,11 @@ a:active {
 }
 
 .navbar_links {
-  display: grid;
-  grid-template-columns: auto auto;
+  /*display: grid;*/
+  /*grid-template-columns: auto auto;*/
+  width: 30%;
 }
 
 .navbar_link {
+  width: 100%;
 }