Implement Frontend

2020-07-17 22:36:32 +02:00
parent 0391207822
commit fe01c162d8
4 changed files with 628 additions and 15 deletions
--- a/index.html
+++ b/index.html
@@ -1,27 +1,60 @@
-<!DOCTYPE html>
-<html>
+<!doctype html>
+
+<html lang="en">

 <head>
-    <title>leafblade Minecraft Server</title>
+  <meta charset="utf-8">
+
+  <title>Waschmarken.io</title>
+  <meta name="description" content="Waschmarken Scoreboard">
+
+  <link rel="stylesheet" href="static/css/normalize.css">
+  <link rel="stylesheet" href="static/css/sakura-dark.css">
+
+  <style>
+    .heading {
+      text-align: center;
+    }
+
+    #scoreboard .score {
+      text-align: right;
+    }
+
+    #scoreboard .bar {
+      background-color: chartreuse;
+      width: 80%;
+      height: 0.8em;
+    }
+  </style>

-    <meta charset="UTF-8"/>
 </head>

 <body>
-this is the base site

-<br>
+  <h1 class="heading">Waschmarken Scoreboard</h1>

-<input id="username" type="text" placeholder="Joe"/>
-<button id="btn_register">idk</button>
+  <table id="scoreboard">
+    <thead>
+      <tr>
+        <th>Name</th>
+        <th style="width: 100%;"></th>
+        <th class="score">Score</th>
+      </tr>
+    </thead>
+    <tbody></tbody>

-<script>
-    document.getElementById("btn_register").onclick = function (e) {
-        let username = document.getElementById("username");
+    <template>
+      <tr class="row">
+        <td class="name"></td>
+        <td>
+          <div class="bar"></div>
+        </td>
+        <td class="score">42069</td>
+      </tr>
+    </template>
+  </table>

-        window.location.replace(`register/${encodeURIComponent(username.value || username.placeholder)}`)
-    };
-</script>
+  <script src="static/js/main.js"></script>
 </body>

-</html>
+</html>