From dad3d8826d5017dea6efab4d4e8d13afe6d65848 Mon Sep 17 00:00:00 2001 From: Jonas Date: Tue, 29 Apr 2025 12:55:54 +0200 Subject: [PATCH] =?UTF-8?q?Bestenliste=20hinzugef=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/dashboard/lobby/style.css | 2 +- frontend/highscores/index.html | 60 ++++++++++++++++++++++++++ frontend/highscores/index.js | 27 ++++++++++++ frontend/highscores/style.css | 68 ++++++++++++++++++++++++++++++ frontend/index.html | 14 ++++++ frontend/scripts/ButtonManager.js | 3 +- frontend/style.css | 4 ++ 7 files changed, 176 insertions(+), 2 deletions(-) create mode 100644 frontend/highscores/index.html create mode 100644 frontend/highscores/index.js create mode 100644 frontend/highscores/style.css diff --git a/frontend/dashboard/lobby/style.css b/frontend/dashboard/lobby/style.css index 254820e..7d70c1d 100644 --- a/frontend/dashboard/lobby/style.css +++ b/frontend/dashboard/lobby/style.css @@ -26,7 +26,7 @@ button { align-items: center; height: 20%; - background-color: rgb(124, 124, 124); + background-color: rgb(63, 63, 63); border-radius: 10px 10px 0 0; } diff --git a/frontend/highscores/index.html b/frontend/highscores/index.html new file mode 100644 index 0000000..077b6b5 --- /dev/null +++ b/frontend/highscores/index.html @@ -0,0 +1,60 @@ + + + + + + + Bestenliste + + + + + + +
+ +
+ +
+ +
+
+
+ + + + + + \ No newline at end of file diff --git a/frontend/highscores/index.js b/frontend/highscores/index.js new file mode 100644 index 0000000..ed9b70d --- /dev/null +++ b/frontend/highscores/index.js @@ -0,0 +1,27 @@ +class HighScoreLoader{ + constructor(){ + this.table = document.getElementById("highscoreTable"); + + this.data = undefined; + + this.setup(); + } + + async setup(){ + const response = await fetch("/api/highscore"); + this.data = await response.json(); + + for(const score of this.data.scores){ + this.table.innerHTML += ` + + ${score.rang} + ${score.user1.username} + ${score.user2.username} + ${score.score} + + ` + } + } +} + +new HighScoreLoader(); \ No newline at end of file diff --git a/frontend/highscores/style.css b/frontend/highscores/style.css new file mode 100644 index 0000000..879a514 --- /dev/null +++ b/frontend/highscores/style.css @@ -0,0 +1,68 @@ +.buttonMenu{ + height: 65vh; +} + +#tableWrapper{ + border: 3px solid rgba(255, 255, 255, 0.6); + border-radius: 15px; + + max-height: 50vh; + overflow: auto; +} + +table{ + border-collapse: collapse; + border-radius: 15px; + overflow: hidden; + + text-align: center; +} + +tr, thead, th, td{ + border: none; +} + +th, td{ + padding-left: 40px; + padding-right: 40px; + + height: 50px; +} + +thead{ + background-color: rgb(63, 63, 63); +} + +tr{ + background-color: rgb(63, 63, 63, 0.5); +} + +tr td:first-child { + color: rgb(255, 223, 0); + font-size: 20px; +} + +thead th:first-child { + border-right: 3px solid rgba(255, 255, 255, 0.6); +} +thead th:nth-child(2), +thead th:nth-child(3) { + border-left: 3px solid rgba(255, 255, 255, 0.6); + border-right: 3px solid rgba(255, 255, 255, 0.6); +} +thead th:last-child { + border-left: 3px solid rgba(255, 255, 255, 0.6); +} + + +tr td:first-child { + border-right: 3px solid rgba(255, 255, 255, 0.6); +} +tr td:nth-child(2), +tr td:nth-child(3) { + border-left: 3px solid rgba(255, 255, 255, 0.6); + border-right: 3px solid rgba(255, 255, 255, 0.6); +} +tr td:last-child { + border-left: 3px solid rgba(255, 255, 255, 0.6); +} \ No newline at end of file diff --git a/frontend/index.html b/frontend/index.html index f458ab4..4fb935a 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -26,6 +26,20 @@ Anleitung +