From fc7eb805b88aa266139eb4fe350404d2e72c23a9 Mon Sep 17 00:00:00 2001
From: Eloi Zalczer <ezalczer@dxomark.com>
Date: Wed, 19 Jun 2024 18:14:52 +0200
Subject: [PATCH] Minor improvements for mobile accessibility

---
 src/components/NavigationBar.vue  | 2 +-
 src/components/RestaurantsMap.vue | 2 +-
 src/components/ReviewsDrawer.vue  | 1 +
 src/views/CreateView.vue          | 1 +
 4 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/NavigationBar.vue b/src/components/NavigationBar.vue
index c40def1..c54cfd3 100644
--- a/src/components/NavigationBar.vue
+++ b/src/components/NavigationBar.vue
@@ -10,7 +10,7 @@ import { currentUser, signOut } from "../pocketbase";
         <div tabindex="0" role="button" class="btn btn-ghost btn-circle lg:hidden">
           <font-awesome-icon icon="fa-solid fa-bars" />
         </div>
-        <ul tabindex="0" class="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-100 rounded-box w-52">
+        <ul tabindex="0" class="menu menu-sm dropdown-content mt-3 z-[20000] p-2 shadow bg-base-100 rounded-box w-52">
           <li><RouterLink class="btn btn-ghost" to="/">Home</RouterLink></li>
 
           <li>
diff --git a/src/components/RestaurantsMap.vue b/src/components/RestaurantsMap.vue
index 95d203b..8e1c7c6 100644
--- a/src/components/RestaurantsMap.vue
+++ b/src/components/RestaurantsMap.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, PropType, watch } from "vue";
+import { ref, onMounted, watch } from "vue";
 import "leaflet/dist/leaflet.css";
 import * as L from "leaflet";
 import "../assets/map.css";
diff --git a/src/components/ReviewsDrawer.vue b/src/components/ReviewsDrawer.vue
index 5012762..2e10b6d 100644
--- a/src/components/ReviewsDrawer.vue
+++ b/src/components/ReviewsDrawer.vue
@@ -56,6 +56,7 @@ defineExpose({ open, close });
             class="btn btn-circle btn-sm text-gray-500 bg-transparent"
             icon="fa-solid fa-xmark"
           />
+          <h3 class="text-lg font-bold ml-5 self-center">{{ props.restaurant?.name }}</h3>
           <div class="flex-1"></div>
           <a
             v-if="props.restaurant?.googleMapsLink"
diff --git a/src/views/CreateView.vue b/src/views/CreateView.vue
index 5d62ef9..64e559e 100644
--- a/src/views/CreateView.vue
+++ b/src/views/CreateView.vue
@@ -51,6 +51,7 @@ function onRestaurantCreationFailed(message: string) {
   <RestaurantsMap @clicked="onMapClicked" />
 
   <CreateRestaurantModal
+    class="z-[10000]"
     @succeeded="onRestaurantCreationSucceeded"
     @failed="onRestaurantCreationFailed"
     ref="createRestaurantModal"