made rust page Beta ver 0.0.4

Sirdug · Aug 17, 2024 · 79eda42 · 79eda42
1 parent 41a8ad8
commit 79eda42
Show file tree

Hide file tree

Showing 5 changed files with 182 additions and 5 deletions.
diff --git a/Server Pages/rust.css b/Server Pages/rust.css
@@ -0,0 +1,83 @@
+.container {
+  position: absolute;
+  height: 100%;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  overflow: hidden;
+  background: #222222;
+}
+
+svg {
+  position: absolute;
+  height: 100%;
+}
+
+.lines {
+  opacity: 0.05;
+}
+
+.line {
+  fill-rule: evenodd;
+  clip-rule: evenodd;
+  fill: #4C3A90;
+}
+
+.lights {
+  opacity: 0.9;
+}
+
+.light {
+  fill-rule: evenodd;
+  clip-rule: evenodd;
+  fill: #7A6BB5;
+}
+
+nav {
+  position: fixed;
+  top: 0;
+  width: 100%;
+  background-color: #333;
+  overflow: hidden;
+  z-index: 1000;
+  padding: 10px 0;
+}
+
+nav ul {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  justify-content: center;
+}
+
+nav ul li {
+  margin: 0 15px;
+}
+
+nav ul li a {
+  color: white;
+  text-align: center;
+  padding: 14px 20px;
+  text-decoration: none;
+  font-size: 17px;
+  display: block;
+}
+
+nav ul li a:hover {
+  background-color: #575757;
+  border-radius: 5px;
+}
+
+/* Adjusting the container to not be hidden under the nav bar */
+.container {
+  position: absolute;
+  height: calc(100% - 60px); /* Adjust height to account for the nav bar */
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  overflow: hidden;
+  background: #222222;
+  top: 60px;
+}
+
diff --git a/Server Pages/rust.html b/Server Pages/rust.html
@@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<html lang="en" >
+<head>
+  <meta charset="UTF-8">
+  <title>CodePen - Space Elevator</title>
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
+<link rel="stylesheet" href="rust.css">
+
+</head>
+<body>
+
+  <nav>
+    <ul>
+      <li><a href="#home">Home</a></li>
+      <li><a href="#about">About</a></li>
+      <li><a href="#services">Services</a></li>
+      <li><a href="#contact">Contact</a></li>
+    </ul>
+  </nav>
+
+  <dashboard class="dashboard">
+    <dashboard-header title="Datacenter">
+        <dashboard-clock digital="true" binary="true" />
+    </dashboard-header>
+    <server-list>
+        <server v-for="(server, index) in servers" :class="{ 'has-failed': !server.status }" :type="server.type" @click.native="updateServerStatus(index)">
+            <span slot="name" class="data">{{server.name}}</span>
+            <span slot="status" class="data signal">{{server.status ? 'ONLINE' : 'OFFLINE'}}</span>
+            <span slot="adr" class="data">{{server.adr}}</span>
+        </server>
+    </server-list>
+</dashboard>
+
+
+<!-- partial:index.partial.html -->
+<div class="container"> 
+  <svg class="background__lights" id="lines" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewbox="0 0 1920 1080" xml:space="preserve" preserveAspectRatio="none">
+    <g class="lines">
+      <rect class="line" x="1253.6" width="4.5" height="1080"></rect>
+      <rect class="line" x="873.3" width="1.8" height="1080"></rect>
+      <rect class="line" x="1100" width="1.8" height="1080"></rect>
+      <rect class="line" x="1547.1" width="4.5" height="1080"></rect>
+      <rect class="line" x="615" width="4.5" height="1080"></rect>
+      <rect class="line" x="684.6" width="1.8" height="1080"></rect>
+      <rect class="line" x="1369.4" width="1.8" height="1080"></rect>
+      <rect class="line" x="1310.2" width="0.9" height="1080"></rect>
+      <rect class="line" x="1233.4" width="0.9" height="1080"></rect>
+      <rect class="line" x="124.2" width="0.9" height="1080"></rect>
+      <rect class="line" x="1818.4" width="4.5" height="1080"></rect>
+      <rect class="line" x="70.3" width="4.5" height="1080"></rect>
+      <rect class="line" x="1618.6" width="1.8" height="1080"></rect>
+      <rect class="line" x="455.9" width="1.8" height="1080"></rect>
+      <rect class="line" x="328.7" width="1.8" height="1080"></rect>
+      <rect class="line" x="300.8" width="4.6" height="1080"></rect>
+      <rect class="line" x="1666.4" width="0.9" height="1080"></rect>
+    </g>
+    <g class="lights">
+      <path class="light1 light" d="M619.5,298.4H615v19.5h4.5V298.4z M619.5,674.8H615v9.8h4.5V674.8z M619.5,135.1H615v5.6h4.5V135.1z         M619.5,55.5H615v68.7h4.5V55.5z"></path>
+      <path class="light2 light" d="M1258.2,531.9h-4.5v8.1h4.5V531.9z M1258.2,497.9h-4.5v17.9h4.5V497.9z M1258.2,0h-4.5v25.3h4.5V0z         M1258.2,252.2h-4.5v42.4h4.5V252.2z"></path>
+      <path class="light3 light" d="M875.1,123.8h-1.8v4h1.8V123.8z M875.1,289.4h-1.8v24.1h1.8V289.4z M875.1,0h-1.8v31.4h1.8V0z M875.1,50.2         h-1.8v11.5h1.8V50.2z"></path>
+      <path class="light4 light" d="M1101.8,983.8h-1.8v8.2h1.8V983.8z M1101.8,1075.9h-1.8v4.1h1.8V1075.9z M1101.8,873.7h-1.8v4.2h1.8V873.7z         M1101.8,851h-1.8v18.2h1.8V851z"></path>
+      <path class="light5 light" d="M686.4,822.7h-1.8v3.8h1.8V822.7z M686.4,928.4h-1.8v23h1.8V928.4z M686.4,1043.8h-1.8v36.2h1.8V1043.8z"></path>
+      <path class="light6 light" d="M1551.6,860.9h-4.4v-34.1h4.4V860.9z M1551.6,533.5h-4.4v-13.9h4.4V533.5z M1551.6,1080h-4.4v-89.1h4.4V1080z"></path>
+      <path class="light7 light" d="M1311.1,707.7h-0.9V698h0.9V707.7z M1311.1,436.8h-0.9v-58.9h0.9V436.8z M1311.1,140.7h-0.9V48h0.9V140.7z"></path>
+      <path class="light8 light" d="M125.1,514.5h-0.9v-9.7h0.9V514.5z M125.1,243.6h-0.9v-58.9h0.9V243.6z"></path>
+      <path class="light9 light" d="M305.4,806.7h-4.6v-42.5h4.6V806.7z M305.4,398.5h-4.6v-17.3h4.6V398.5z M305.4,1080h-4.6V968.8h4.6V1080z"></path>
+      <path class="light10 light" d="M1822.9,170.7h-4.5v13.7h4.5V170.7z M1822.9,435.1h-4.5v6.8h4.5V435.1z M1822.9,55.9h-4.5v4h4.5V55.9z         M1822.9,0h-4.5v48.3h4.5V0z"></path>
+      <path class="light11 light" d="M1666.4,331.5h0.9v9.7h-0.9V331.5z M1666.4,602.4h0.9v58.9h-0.9V602.4z M1666.4,898.5h0.9v92.7h-0.9V898.5z"></path>
+      <path class="light12 light" d="M1620.4,200.7h-1.8v6.4h1.8V200.7z M1620.4,469.1h-1.8v39h1.8V469.1z M1620.4,0h-1.8v51h1.8V0z M1620.4,81.3         h-1.8V100h1.8V81.3z"></path>
+      <path class="light13 light" d="M74.8,201h-4.5v16.2h4.5V201z M74.8,512.3h-4.5v8.1h4.5V512.3z M74.8,65.8h-4.5v4.6h4.5V65.8z M74.8,0h-4.5         v56.8h4.5V0z"></path>
+      <path class="light14 light" d="M1371.2,655.3h-1.8v6.3h1.8V655.3z M1371.2,829.7h-1.8v37.9h1.8V829.7z M1371.2,1020.3h-1.8v59.7h1.8V1020.3z"></path>
+      <path class="light15 light" d="M1234.3,898.1h-0.9v-4.9h0.9V898.1z M1234.3,762.5h-0.9v-29.5h0.9V762.5z M1234.3,614.4h-0.9v-46.4h0.9V614.4z         "></path>
+      <path class="light16 light" d="M457.7,1010.8h-1.8v-18.1h1.8V1010.8z M457.7,507.5h-1.8V398h1.8V507.5z"></path>
+      <path class="light17 light" d="M330.5,170.7h-1.8v13.7h1.8V170.7z M330.5,435.1h-1.8v6.8h1.8V435.1z M330.5,55.9h-1.8v4h1.8V55.9z M330.5,0         h-1.8v48.3h1.8V0z"></path>
+    </g>
+  </svg>
+</div>
+<!-- partial -->
+  <script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.4/TweenLite.min.js'></script>
+<script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.4/plugins/CSSPlugin.min.js'></script><script  src="rust.js"></script>
+
+</body>
+</html>
diff --git a/Server Pages/rust.js b/Server Pages/rust.js
@@ -0,0 +1,11 @@
+function animateWithRandomNumber(myClass, from, to) {
+  TweenLite.fromTo(myClass, Math.floor(Math.random() * 20 + 1), { y: from }, { y: to,
+    onComplete: animateWithRandomNumber,
+    onCompleteParams: [myClass, from, to],
+    ease: Linear.easeNone });
+}
+
+const itemsDown = [".light4", ".light5", ".light6", ".light7", ".light8", ".light11", ".light12", ".light13", ".light14", ".light15", ".light16"].
+forEach(e => animateWithRandomNumber(e, -1080, 1080));
+const itemsUp = [".light1", ".light2", ".light3", ".light9", ".light10", ".light17"].
+forEach(e => animateWithRandomNumber(e, 1080, -1080));
diff --git a/servers.css b/servers.css
@@ -410,7 +410,7 @@ iframe {
     padding-right: 5px;
     margin-right: 5px;
     height: 25px;
-    width: 60px;
+    width: 65px;
   }
 
 

diff --git a/servers.html b/servers.html
@@ -36,15 +36,15 @@ <h1>Server Stats</h1> <!-- Moved the heading outside the chip container -->
         </div>
         <div class="chip">
           <img src="https://angelic-trust-production.up.railway.app/api/badge/1/status" alt="Person" width="96" height="96">
-          <li><a href="AI.html">Minecraft Server 1</a></li>
+          <li><a href="AI.html">MC Server 1</a></li>
         </div>
         <div class="chip">
           <img src="https://angelic-trust-production.up.railway.app/api/badge/1/status" alt="Person" width="96" height="96">
-          <li><a href="AI.html">Minecraft Server 2</a></li>
+          <li><a href="AI.html">MC Server 2</a></li>
         </div>
         <div class="chip">
-            <img src="https://angelic-trust-production.up.railway.app/api/badge/1/status" alt="Person" width="96" height="96">
-            Server Status 4
+            <img src="https://uptime.sirdug.dev/api/badge/2/status" alt="Person" width="96" height="96">
+            <li><a href="Server Pages/rust.html">Rust Server</a></li>
           </div>
           <div class="chip">
             <img src="https://angelic-trust-production.up.railway.app/api/badge/1/status" alt="Person" width="96" height="96">