From 240b337fce68bb8c2bae1bb69d8c5141dee54f86 Mon Sep 17 00:00:00 2001
From: Benedikt Werner <1benediktwerner@gmail.com>
Date: Thu, 16 Sep 2021 10:26:47 +0200
Subject: [PATCH] Increse mobile lobby font size again whithough overflowing

---
 ui/lobby/css/app/_app.scss         |  2 +-
 ui/lobby/css/app/_hook-filter.scss | 18 +++++++++++++++++-
 ui/lobby/css/app/_hook-list.scss   | 30 ++++++++++++++++++++++++++++++
 3 files changed, 48 insertions(+), 2 deletions(-)

diff --git a/ui/lobby/css/app/_app.scss b/ui/lobby/css/app/_app.scss
index 7c4424726f..1de9cd4b91 100644
--- a/ui/lobby/css/app/_app.scss
+++ b/ui/lobby/css/app/_app.scss
@@ -79,7 +79,7 @@
 .lreal_time,
 .lseeks .hooks__list {
   @include breakpoint($mq-not-xx-small) {
-    font-size: 0.7em;
+    font-size: 0.9em;
   }
 }
 
diff --git a/ui/lobby/css/app/_hook-filter.scss b/ui/lobby/css/app/_hook-filter.scss
index df7d524fa9..29e767cbc4 100644
--- a/ui/lobby/css/app/_hook-filter.scss
+++ b/ui/lobby/css/app/_hook-filter.scss
@@ -72,7 +72,23 @@
     text-align: right;
 
     button {
-      margin-left: .3em;
+      margin-left: 0.3em;
+    }
+  }
+
+  @include breakpoint($mq-not-xx-small) {
+    padding: $block-gap 1em;
+
+    td {
+      max-width: 50vw;
+    }
+
+    td:first-child {
+      margin-right: 1rem;
+    }
+
+    tr.variant .checkable {
+      width: 50%;
     }
   }
 }
diff --git a/ui/lobby/css/app/_hook-list.scss b/ui/lobby/css/app/_hook-list.scss
index a3a447cc41..9b0c5158c3 100644
--- a/ui/lobby/css/app/_hook-list.scss
+++ b/ui/lobby/css/app/_hook-list.scss
@@ -58,6 +58,16 @@
     &.player {
       width: 110px;
     }
+
+    @include breakpoint($mq-not-xx-small) {
+      &:nth-child(2) {
+        max-width: 7ch;
+        direction: rtl;
+        text-align: left;
+        padding-right: 0;
+        padding-left: 0;
+      }
+    }
   }
 
   td {
@@ -86,6 +96,26 @@
     ::before {
       opacity: 0.6;
     }
+
+    @include breakpoint($mq-not-xx-small) {
+      padding: 0.5em 0.4em;
+
+      &:first-child {
+        padding-left: 0.7em;
+      }
+
+      // player name
+      &:nth-child(2) {
+        @include elipsis;
+        max-width: 25vw;
+      }
+
+      // rated/casual
+      &:last-child {
+        @include elipsis;
+        max-width: 10vw;
+      }
+    }
   }
 
   tbody.stepping {