From 5581695b023e4c62f4dfcb1ff1dc70f88f5234d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Dani=C3=ABl=20van=20der=20Winden?=
 <danielvanderwinden@ghost.org>
Date: Mon, 28 Oct 2024 16:24:54 +0100
Subject: [PATCH] Fixes Members filter falling offscreen on mobile viewports
 (#21438)

fixes
https://linear.app/ghost/issue/DES-922/members-filter-ui-appears-offscreen-on-mobile

Updated the positioning for the member filter dropdown to work more
accurately on mobile viewports.
---
 ghost/admin/app/styles/layouts/members.css | 19 ++++++++-----------
 1 file changed, 8 insertions(+), 11 deletions(-)

diff --git a/ghost/admin/app/styles/layouts/members.css b/ghost/admin/app/styles/layouts/members.css
index 1dcd4d163c..321a6724d3 100644
--- a/ghost/admin/app/styles/layouts/members.css
+++ b/ghost/admin/app/styles/layouts/members.css
@@ -472,10 +472,6 @@ p.gh-members-list-email {
         min-height: 120px;
     }
 
-    .members-header.gh-canvas-header.break.tablet .gh-canvas-header-content {
-        height: 140px;
-    }
-
     .members-header.gh-canvas-header.break.tablet .view-actions {
         top: 0;
     }
@@ -2819,13 +2815,14 @@ a.gh-members-emailpreview-subscription-link {
 
 @media (max-width: 690px) {
     .gh-members-filter-builder {
-        width: calc(100vw - 20px);
-        min-width: calc(100vw - 20px);
-        max-width: calc(100vw - 20px);
-        left: 0 !important;
-        right: 0 !important;
-        margin-left: 10px;
-        margin-right: 10px;
+        position: fixed;
+        top: 9vh !important;
+        left: 10px !important;
+        right: 10px !important;
+        width: auto;
+        min-width: 0;
+        max-width: none;
+        margin: 0;
     }
 }