some style fixes

Author: danielkellyio

src/components/BoardDragAndDrop.vue

@@ -57,7 +57,7 @@ async function addTask({ column, title }: { column: Column; title: string }) {
 </script>
 
 <template>
-  <div class="flex py-12 items-start">
+  <div class="flex py-12 items-start max-w-full overflow-x-auto">
     <draggable
       :list="columns"
       group="columns"
@@ -106,6 +106,11 @@ async function addTask({ column, title }: { column: Column; title: string }) {
         </div>
       </template>
     </draggable>
-    <button class="text-gray-500" @click="addColumn">New Column +</button>
+    <button
+      class="text-gray-500 whitespace-nowrap pr-10 block"
+      @click="addColumn"
+    >
+      New Column +
+    </button>
   </div>
 </template>

src/components/TaskCreator.vue

@@ -10,7 +10,7 @@ const emit = defineEmits<{
 }>();
 const handleActivate = () => {
   active.value = true;
-  nextTick(() => input.value.focus());
+  nextTick(() => input.value?.focus());
 };
 const handleEnter = () => {
   emit("create", value.value);

src/components/TheDrawer.vue

@@ -62,7 +62,7 @@ function onSelect({ itemIndex }: { itemIndex: number }) {
     :items="items"
     @select="onSelect"
   >
-    <DrawerContent>
+    <DrawerContent class="max-w-full overflow-hidden">
       <div class="p-5">
         <router-view />
       </div>