From c3b643376b4d20d77eb9c2abe9f00100f64dc098 Mon Sep 17 00:00:00 2001
From: Alex Tselegidis <alextselegidis@gmail.com>
Date: Thu, 2 Jun 2022 15:50:08 +0200
Subject: [PATCH] Change the display of the appointment timezone information

---
 .../views/components/appointments_modal.php      | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/application/views/components/appointments_modal.php b/application/views/components/appointments_modal.php
index 1682a43c..c07a480a 100644
--- a/application/views/components/appointments_modal.php
+++ b/application/views/components/appointments_modal.php
@@ -149,22 +149,24 @@
                                 </div>
 
                                 <div class="mb-3">
-                                    <label class="form-label"><?= lang('timezone') ?></label>
+                                    <label class="form-label">
+                                        <?= lang('timezone') ?>
+                                    </label>
 
-                                    <ul>
-                                        <li>
+                                    <div class="border rounded d-flex justify-content-between align-items-center bg-light timezone-info">
+                                        <div class="border-end w-50 p-1 text-center">
                                             <?= lang('provider') ?>:
                                             <span class="provider-timezone">
                                                 -
                                             </span>
-                                        </li>
-                                        <li>
+                                        </div>
+                                        <div class="w-50 p-1 text-center">
                                             <?= lang('current_user') ?>:
                                             <span>
                                                 <?= $timezones[session('timezone', 'UTC')] ?>
                                             </span>
-                                        </li>
-                                    </ul>
+                                        </div>
+                                    </div>
                                 </div>
                             </div>
                         </div>