From c859d32cd1578e5a6442b4c0c481d5414b5ba0fb Mon Sep 17 00:00:00 2001
From: Massedil <massedil-framagit.org@msd.im>
Date: Fri, 11 Oct 2024 17:43:51 +0200
Subject: [PATCH] Changing organizer pop-up is now usable in mobile view

---
 src/components/Event/OrganizerPicker.vue        |  1 +
 src/components/Event/OrganizerPickerWrapper.vue | 14 ++++++++++----
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/components/Event/OrganizerPicker.vue b/src/components/Event/OrganizerPicker.vue
index d2797a0de..912e9320c 100644
--- a/src/components/Event/OrganizerPicker.vue
+++ b/src/components/Event/OrganizerPicker.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="max-w-md mx-auto">
     <o-input
+      expanded
       dir="auto"
       :placeholder="t('Filter by profile or group name')"
       v-model="actorFilterProxy"
diff --git a/src/components/Event/OrganizerPickerWrapper.vue b/src/components/Event/OrganizerPickerWrapper.vue
index b898ae79e..86cfcbf86 100644
--- a/src/components/Event/OrganizerPickerWrapper.vue
+++ b/src/components/Event/OrganizerPickerWrapper.vue
@@ -63,9 +63,10 @@
           <h2 class="">{{ $t("Pick a profile or a group") }}</h2>
         </header>
         <section class="">
-          <div class="flex flex-wrap gap-2 items-center">
-            <div class="max-h-[400px] overflow-y-auto flex-1">
+          <div class="flex flex-wrap gap-2 items-center flex-col lg:flex-row">
+            <div class="max-h-[400px] overflow-y-auto flex-1 w-full">
               <organizer-picker
+                class="p-5 w-3/4"
                 v-if="currentActor"
                 :current-actor="currentActor"
                 :identities="identities ?? []"
@@ -80,6 +81,7 @@
               <div v-if="isSelectedActorAGroup">
                 <p>{{ $t("Add a contact") }}</p>
                 <o-input
+                  expanded
                   :placeholder="$t('Filter by name')"
                   :value="contactFilter"
                   @input="debounceSetFilterByName"
@@ -137,8 +139,12 @@
             </div>
           </div>
         </section>
-        <footer class="my-2">
-          <o-button variant="primary" @click="pickActor">
+        <footer class="my-2 text-center sm:text-right">
+          <o-button
+            variant="primary"
+            class="w-full sm:w-auto"
+            @click="pickActor"
+          >
             {{ $t("Pick") }}
           </o-button>
         </footer>