From 763e517c3f5d546678281bbe7e8e3c909c5b9680 Mon Sep 17 00:00:00 2001
From: Settel <achim.settelmeier@diva-e.com>
Date: Mon, 10 Oct 2022 19:36:33 +0200
Subject: [PATCH] css: adapt highscores to smartphone

---
 client/src/components/Highscores.vue | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/client/src/components/Highscores.vue b/client/src/components/Highscores.vue
index a90fae5..0664e37 100644
--- a/client/src/components/Highscores.vue
+++ b/client/src/components/Highscores.vue
@@ -50,6 +50,10 @@ const players = computed(() => {
     margin: 64px 0;
     width: 600px;
     min-height: 600px;
+
+    @media (max-width: $phone-max-width) {
+      width: 300px;
+    }
   }
 
   &__table-outer-border {
@@ -93,6 +97,12 @@ const players = computed(() => {
   &__title {
     font-family: $font-primary;
     font-size: 48px;
+
+    @media (max-width: $phone-max-width) {
+      font-size: 32px;
+      padding: 20px;
+      text-align: center;
+    }
   }
 
   &__table-body {
@@ -103,6 +113,9 @@ const players = computed(() => {
     font-family: $font-secondary;
     font-size: 32px;
 
+    @media (max-width: $phone-max-width) {
+      font-size: 24px;
+    }
   }
 
   &__table {