From a2283a0cf729496ab6aaa2916ed3bec83f178e5b Mon Sep 17 00:00:00 2001
From: Davinder Singh <davibaweja@gmail.com>
Date: Wed, 7 Aug 2024 14:26:43 +0100
Subject: [PATCH] Plans page (New design Mobile) - Adding group member picker
 dropdown in groups plans card in mobile screen (#19718)

* adding group_member_picker mixin on mobile screen

* renaming screenSize to device

* adding a Separator before device name

* removing period argument passing from plans-cat mixin

* creating a z-index z-index-group-member-picker-list to avoid the overlap of the dropdown menu on the list above it

GitOrigin-RevId: 538f08064f72cbc85343ee3b44645231b894b9d4
---
 .../stylesheets/app/plans/plans-new-design.less       | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/services/web/frontend/stylesheets/app/plans/plans-new-design.less b/services/web/frontend/stylesheets/app/plans/plans-new-design.less
index 74d1ad79f3..5bea1bf894 100644
--- a/services/web/frontend/stylesheets/app/plans/plans-new-design.less
+++ b/services/web/frontend/stylesheets/app/plans/plans-new-design.less
@@ -1,4 +1,5 @@
 @z-index-plans-new-tabs: 1;
+@z-index-group-member-picker-list: 1;
 @z-index-plans-new-tabs-content: 0;
 
 @highlighted-heading-line-height: (@line-height-03 / 1rem) * 16px; // convert to px
@@ -451,6 +452,7 @@
         background-color: white;
         width: 100%;
         margin-top: var(--spacing-01);
+        z-index: @z-index-group-member-picker-list;
       }
 
       li {
@@ -730,11 +732,20 @@
           }
         }
 
+        .group-members-picker-container-mobile {
+          margin-top: var(--spacing-08);
+        }
+
         .plans-card-cta-buy-now-mobile {
           width: 100%;
           margin-top: var(--spacing-08);
           line-height: var(--line-height-03);
         }
+        .group-plans-card-cta-buy-now-mobile {
+          width: 100%;
+          margin-top: var(--spacing-04);
+          line-height: var(--line-height-03);
+        }
       }
     }
   }