Map now has some form of transparency with integration.

src/pages/MinecraftServer.vue

@@ -66,7 +66,7 @@
         ref="dynmap"
         src="https:/ent.sys.reslate.xyz/resmcs/dynmap/"
         class="map"
-        allowTransparency="true"
+        allowtransparency="true"
         @load="iframeLoaded"
       >
         <p>Your browser does not support iframes. Visit <a href="https:/ent.sys.reslate.xyz/resmcs/dynmap/">the full dynmap page here</a></p>
@@ -115,6 +115,11 @@ export default {
     this.lastUpdate = info.last_updated;
   },
   methods: {
+    iframeLoaded() {
+      let iframe = this.$refs.dynmap;
+      let iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
+      iframeDocument.body.style.backgroundColor = "transparent";
+    }
   },
 };
 </script>
@@ -157,7 +162,6 @@ export default {
     }
     background-repeat: repeat;
     background-size: auto;
-    font-size: 1.25rem;
   }
 }
 
@@ -180,15 +184,16 @@ export default {
   }
 
   .map {
-    width: 95%;
+    width: 90%;
     flex-grow: 1;
-    margin-bottom: 2.5%;
-    background-color: transparent;
+    background-image: url("@/assets/images/minecraft/textures/map_center.png");
+    background-repeat: repeat;
+    background-clip: padding-box;
+    margin-bottom: 5%;
     
-    border-width: 20px;
 
     border-image-slice:27 27 27 27;
-    border-image-width:20px 20px 20px 20px;
+    border-image-width:27px 27px 27px 27px;
     border-image-outset:0px 0px 0px 0px;
     border-image-repeat:repeat repeat;
     border-image-source:url("@/assets/images/minecraft/textures/map.png");

src/router/routes.js

@@ -8,14 +8,14 @@ export const routes = [
     name: "Home",
     component: OverviewInfo,
   },
+  {
+    path: "/steam",
+    name: "Steam System",
+    component: SteamServer,
+  },
   {
       path: "/mcs",
       name: "Minecraft Server",
       component: MinecraftServer,
   },
-  {
-    path: "/steam",
-    name: "Steam System",
-    component: SteamServer,
-  }
 ];