From 906b2044b2ef34f9b141985e7789af67571c30b1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yi=C4=9Fit=20=C3=87olako=C4=9Flu?=
 <yigitcolakoglu@hotmail.com>
Date: Thu, 28 Jan 2021 17:54:57 +0300
Subject: [PATCH 1/2] Made AppointmentModal more mobile friendly

---
 src/components/AppointmentModal.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/AppointmentModal.vue b/src/components/AppointmentModal.vue
index cad8460..381aef9 100644
--- a/src/components/AppointmentModal.vue
+++ b/src/components/AppointmentModal.vue
@@ -1,9 +1,9 @@
 <template>
   <div v-if="showModal" class="z-10 modal h-screen w-full fixed left-0 top-0 flex justify-center items-center bg-black bg-opacity-50">
-    <div class="py-3 sm:max-w-xl sm:mx-auto">
-        <div class="relative px-4 py-10 bg-white mx-8 md:mx-0 shadow rounded-3xl sm:p-10">
+    <div class="py-3 sm:max-w-xl sm:mx-auto h-screen md:h-auto">
+        <div class="relative px-4 pt-2 pb-4 md:py-10 bg-white mx-8 md:mx-0 shadow rounded-3xl sm:p-10">
           <div class="max-w-md mx-auto">
-            <div class="flex items-center space-x-5">
+            <div class="hidden md:flex items-center 5">
               <div class="h-14 w-14 bg-yellow-200 rounded-full flex flex-shrink-0 justify-center items-center text-yellow-500 text-2xl font-mono">A</div>
               <div class="block pl-2 font-semibold text-xl self-start text-gray-700">
                 <h2 class="leading-relaxed">Create an Appointment</h2>
@@ -12,7 +12,7 @@
             </div>
             <div class="divide-y divide-gray-200">
               <div class="py-8 text-base leading-6 space-y-4 text-gray-700 sm:text-lg sm:leading-7">
-                <div class="flex items-center space-x-4">
+                <div class="flex flex-col md:flex-row items-center md:space-x-4">
                   <div class="flex flex-col">
                     <label class="leading-loose">Start</label>
                     <DatetimePicker @change="(v) => start = v" class="focus-within:text-gray-600 text-gray-400" :init="false" :startFromMonday="false" :autoClose="false" :startDate="start">

From 1f732c45a952868177b1bc0e7f95f813f176c9e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yi=C4=9Fit=20=C3=87olako=C4=9Flu?=
 <yigitcolakoglu@hotmail.com>
Date: Thu, 28 Jan 2021 17:56:40 +0300
Subject: [PATCH 2/2] View switching for Calendar.vue

---
 src/views/Calendar.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/views/Calendar.vue b/src/views/Calendar.vue
index b951005..a1e1777 100644
--- a/src/views/Calendar.vue
+++ b/src/views/Calendar.vue
@@ -195,8 +195,10 @@ export default {
                 this.$refs.fullCalendar.getApi().changeView('timeGridDay')
                 this.$refs.fullCalendar.getApi().setOption('aspectRatio', w / h + 0.04)
                 return;
+            }else{
+              this.$refs.fullCalendar.getApi().changeView('timeGridWeek')
+              this.$refs.fullCalendar.getApi().setOption('aspectRatio', w / h + 0.15)
             }
-            this.$refs.fullCalendar.getApi().setOption('aspectRatio', w / h + 0.15)
         }
     },
     watch: {