fix: fixes for navbar back button vertical alignment and not showing diff if no data entered

Author: technikhil314

components/navbar.vue

@@ -1,7 +1,7 @@
 <template>
   <header class="fixed top-0 left-0 right-0 bg-white shadow-lg">
-    <div class="container flex h-full py-4 m-auto">
-      <div v-if="showBackButton" class="items-center mr-4">
+    <div class="container flex items-center h-full py-4 m-auto">
+      <div v-if="showBackButton" class="mr-4">
         <NuxtLink to="/">
           <svg
             class="w-6 h-6"

pages/index.vue

@@ -15,7 +15,7 @@
           ></textarea>
           <div class="self-end w-full text-center">
             <button
-              class="w-64 px-4 py-3 text-white transition-transform transform bg-blue-600 rounded-md shadow-lg outline-none  focus:ring-4 active:scale-y-75"
+              class="inline-flex items-center justify-center w-48 px-4 py-2 text-white transition-transform transform bg-blue-600 rounded-md shadow-lg outline-none  focus:ring-4 active:scale-y-75"
             >
               Compare
             </button>
@@ -45,6 +45,9 @@ export default Vue.extend({
         'rhs'
       ) as HTMLTextAreaElement
       const rhs: string = rhsTextArea?.value || ''
+      if (!lhs || !rhs) {
+        return
+      }
       const originalLhs = lhs.split('\n')
       const originalRhs = rhs.split('\n')
       const diff = originalLhs.map((x, i) => {