From a378c743d615cb9029c1c634961cc7917c91122c Mon Sep 17 00:00:00 2001
From: Miodec <bartnikjack@gmail.com>
Date: Mon, 5 Sep 2022 20:45:01 +0200
Subject: [PATCH] optimised alerts popup for narrow screens

---
 frontend/src/styles/popups.scss          |  5 +++++
 frontend/src/styles/z_media-queries.scss |  9 +++++++++
 frontend/src/ts/elements/alerts.ts       |  4 ++++
 frontend/static/html/popups.html         |  4 ++++
 frontend/static/html/top.html            | 11 -----------
 5 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/frontend/src/styles/popups.scss b/frontend/src/styles/popups.scss
index 85ded4ea1..cf4ef38b1 100644
--- a/frontend/src/styles/popups.scss
+++ b/frontend/src/styles/popups.scss
@@ -1344,6 +1344,11 @@
     margin-right: -10rem;
     border-radius: var(--roundness) 0 0 var(--roundness);
 
+    .mobileClose {
+      margin: 0 1rem 2rem 1rem;
+      display: none;
+    }
+
     .separator {
       background-color: var(--sub-alt-color);
       height: 0.25rem;
diff --git a/frontend/src/styles/z_media-queries.scss b/frontend/src/styles/z_media-queries.scss
index 48f36ed2f..0aa3b22c3 100644
--- a/frontend/src/styles/z_media-queries.scss
+++ b/frontend/src/styles/z_media-queries.scss
@@ -894,6 +894,15 @@
   #mobileTestConfig {
     display: block;
   }
+  #alertsPopupWrapper {
+    #alertsPopup {
+      border-radius: 0;
+      width: 100%;
+      .mobileClose {
+        display: block;
+      }
+    }
+  }
 }
 
 @media only screen and (max-width: 400px) {
diff --git a/frontend/src/ts/elements/alerts.ts b/frontend/src/ts/elements/alerts.ts
index ed12c550f..f58db2770 100644
--- a/frontend/src/ts/elements/alerts.ts
+++ b/frontend/src/ts/elements/alerts.ts
@@ -311,6 +311,10 @@ $("#alertsPopupWrapper").on("mousedown", (e) => {
   }
 });
 
+$("#alertsPopup .mobileClose").on("click", () => {
+  hide();
+});
+
 $("#alertsPopup .accountAlerts .list").on(
   "click",
   ".item .buttons .deleteAlert",
diff --git a/frontend/static/html/popups.html b/frontend/static/html/popups.html
index 54ef68ad3..b9c0da66e 100644
--- a/frontend/static/html/popups.html
+++ b/frontend/static/html/popups.html
@@ -1,5 +1,9 @@
 <div id="alertsPopupWrapper" class="popupWrapper hidden">
   <div id="alertsPopup">
+    <div class="button mobileClose">
+      <i class="fas fa-times"></i>
+      Close
+    </div>
     <div class="scrollWrapper">
       <div class="accountAlerts">
         <div class="title">
diff --git a/frontend/static/html/top.html b/frontend/static/html/top.html
index b828ba9e6..042f0a0be 100644
--- a/frontend/static/html/top.html
+++ b/frontend/static/html/top.html
@@ -124,17 +124,6 @@
         </div>
       </div>
     </a>
-    <a
-      class="textButton login view-login"
-      tabindex="2"
-      href="/login"
-      onclick="this.blur();"
-      router-link
-    >
-      <div class="icon">
-        <i class="far fa-fw fa-user"></i>
-      </div>
-    </a>
     <a
       class="textButton showAlerts"
       tabindex="2"