From 4ec217e5d05bb685257f1a0fdf9a012c65d31280 Mon Sep 17 00:00:00 2001
From: advplyr <advplyr@protonmail.com>
Date: Sat, 20 Aug 2022 14:32:38 -0500
Subject: [PATCH] Fix:App bar for mobile screen, UI updates for schedule tabs

---
 client/components/app/Appbar.vue                    | 6 +++---
 client/components/modals/item/tabs/Schedule.vue     | 4 ++--
 client/components/modals/libraries/EditModal.vue    | 2 +-
 client/components/modals/libraries/ScheduleScan.vue | 4 ++--
 client/components/ui/LibrariesDropdown.vue          | 2 +-
 client/tailwind.config.js                           | 1 +
 6 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/client/components/app/Appbar.vue b/client/components/app/Appbar.vue
index 0d63eccc..4b0d923c 100644
--- a/client/components/app/Appbar.vue
+++ b/client/components/app/Appbar.vue
@@ -3,7 +3,7 @@
     <div id="appbar" class="absolute top-0 bottom-0 left-0 w-full h-full px-2 md:px-6 py-1 z-50">
       <div class="flex h-full items-center">
         <nuxt-link to="/">
-          <img src="/icon.svg" class="w-10 min-w-10 h-10 mr-2 sm:w-12 sm:min-w-12 sm:h-12 sm:mr-4" />
+          <img src="/icon.svg" class="w-8 min-w-8 h-8 mr-2 sm:w-12 sm:min-w-12 sm:h-12 sm:mr-4" />
         </nuxt-link>
 
         <nuxt-link to="/">
@@ -12,10 +12,10 @@
 
         <ui-libraries-dropdown class="mr-2" />
 
-        <controls-global-search v-if="currentLibrary" class="" />
+        <controls-global-search v-if="currentLibrary" class="mr-1 sm:mr-0" />
         <div class="flex-grow" />
 
-        <span v-if="showExperimentalFeatures" class="material-icons text-4xl text-warning pr-0 sm:pr-2 md:pr-4">logo_dev</span>
+        <span v-if="showExperimentalFeatures" class="material-icons text-2xl md:text-4xl text-warning pr-0 sm:pr-2 md:pr-4">logo_dev</span>
 
         <ui-tooltip v-if="isChromecastInitialized && !isHttps" direction="bottom" text="Casting requires a secure connection" class="flex items-center">
           <span class="material-icons-outlined text-warning text-opacity-50"> cast </span>
diff --git a/client/components/modals/item/tabs/Schedule.vue b/client/components/modals/item/tabs/Schedule.vue
index 16de35b5..b1aa2cdc 100644
--- a/client/components/modals/item/tabs/Schedule.vue
+++ b/client/components/modals/item/tabs/Schedule.vue
@@ -6,8 +6,8 @@
       </template>
       <template v-if="feedUrl || autoDownloadEpisodes">
         <div class="flex items-center justify-between mb-4">
-          <p class="text-base md:text-lg font-semibold">Schedule Automatic Episode Downloads</p>
-          <ui-checkbox v-model="enableAutoDownloadEpisodes" label="Enable" medium checkbox-bg="bg" label-class="pl-2 text-lg" />
+          <p class="text-base md:text-xl font-semibold">Schedule Automatic Episode Downloads</p>
+          <ui-checkbox v-model="enableAutoDownloadEpisodes" label="Enable" medium checkbox-bg="bg" label-class="pl-2 text-base md:text-lg" />
         </div>
 
         <div v-if="enableAutoDownloadEpisodes" class="flex items-center py-2">
diff --git a/client/components/modals/libraries/EditModal.vue b/client/components/modals/libraries/EditModal.vue
index 80a93019..c44bab5c 100644
--- a/client/components/modals/libraries/EditModal.vue
+++ b/client/components/modals/libraries/EditModal.vue
@@ -2,7 +2,7 @@
   <modals-modal v-model="show" name="edit-library" :width="700" :height="'unset'" :processing="processing">
     <template #outer>
       <div class="absolute top-0 left-0 p-5 w-2/3 overflow-hidden">
-        <p class="font-book text-3xl text-white truncate">{{ title }}</p>
+        <p class="font-book text-xl md:text-3xl text-white truncate">{{ title }}</p>
       </div>
     </template>
     <div class="absolute -top-10 left-0 z-10 w-full flex">
diff --git a/client/components/modals/libraries/ScheduleScan.vue b/client/components/modals/libraries/ScheduleScan.vue
index 84061974..9a891e01 100644
--- a/client/components/modals/libraries/ScheduleScan.vue
+++ b/client/components/modals/libraries/ScheduleScan.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="w-full h-full px-1 md:px-4 py-1 mb-4">
     <div class="flex items-center justify-between mb-4">
-      <p class="text-base md:text-lg font-semibold">Schedule Automatic Library Scans</p>
-      <ui-checkbox v-model="enableAutoScan" @input="toggleEnableAutoScan" label="Enable" small checkbox-bg="bg" label-class="pl-2 text-base" />
+      <p class="text-base md:text-xl font-semibold">Schedule Automatic Library Scans</p>
+      <ui-checkbox v-model="enableAutoScan" @input="toggleEnableAutoScan" label="Enable" medium checkbox-bg="bg" label-class="pl-2 text-base md:text-lg" />
     </div>
     <widgets-cron-expression-builder ref="cronExpressionBuilder" v-if="enableAutoScan" v-model="cronExpression" @input="updatedCron" />
   </div>
diff --git a/client/components/ui/LibrariesDropdown.vue b/client/components/ui/LibrariesDropdown.vue
index 19cebd31..08080f07 100644
--- a/client/components/ui/LibrariesDropdown.vue
+++ b/client/components/ui/LibrariesDropdown.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="currentLibrary" class="relative h-8 max-w-52 min-w-32" v-click-outside="clickOutsideObj">
+  <div v-if="currentLibrary" class="relative h-8 max-w-52 md:min-w-32" v-click-outside="clickOutsideObj">
     <button type="button" :disabled="disabled" class="w-10 sm:w-full relative h-full border border-white border-opacity-10 hover:border-opacity-20 rounded shadow-sm px-2 text-left text-sm focus:outline-none cursor-pointer bg-black bg-opacity-20 text-gray-400 hover:text-gray-200" aria-haspopup="listbox" :aria-expanded="showMenu" @click.stop.prevent="clickShowMenu">
       <div class="flex items-center justify-center sm:justify-start">
         <widgets-library-icon :icon="currentLibraryIcon" class="sm:mr-1.5" />
diff --git a/client/tailwind.config.js b/client/tailwind.config.js
index b5426856..6a1419d9 100644
--- a/client/tailwind.config.js
+++ b/client/tailwind.config.js
@@ -47,6 +47,7 @@ module.exports = {
       minWidth: {
         '5': '1.25rem',
         '6': '1.5rem',
+        '8': '2rem',
         '10': '2.5rem',
         '12': '3rem',
         '16': '4rem',