apply linter

src/App.vue

@@ -15,8 +15,8 @@ export default {
     TopMenu,
   },
   watch: {
-    '$route' (to, from) {
-      document.title = to.meta.title || 'Your Website'
+    '$route' (to) {
+      document.title = to.meta.title || 'OG:IMAGE'
     }
   },
 }

src/page/AboutPage.vue

@@ -2,7 +2,11 @@
   <div class="grid grid-cols-1 col-span-12 text-center">
     <div class="border p-4 md:p-10 md:w-1/2 m-auto">
       <p class="mb-5">
-        This website is an image generator for Open Graph developed by <a href="https://www.deblan.io" class="text-cyan-600">Simon Vieille</a>.
+        This website is an image generator for Open Graph developed by
+        <a
+          href="https://www.deblan.io"
+          class="text-cyan-600"
+        >Simon Vieille</a>.
       </p>
 
       <p class="mb-5">

src/ui/AlignForm.vue

@@ -52,9 +52,12 @@
 export default {
   props: {
     modelValue: {
+      type: String,
+      default: null,
     },
     label: {
       type: String,
+      default: null,
       required: false,
     },
   },

src/ui/DownloadButton.vue

@@ -2,7 +2,7 @@
   <button
     type="button"
     class="px-4 py-2 text-sm font-medium text-gray-900 bg-white border border-gray-200 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-2 focus:ring-blue-700 focus:text-blue-700 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:hover:text-white dark:hover:bg-gray-600 dark:focus:ring-blue-500 dark:focus:text-white"
-    :class="class"
+    :class="$attrs.class"
     v-text="label"
   />
 </template>
@@ -12,12 +12,9 @@ export default {
   props: {
     label: {
       type: String,
+      default: null,
       required: true
     },
-    class: {
-      type: String,
-      required: false,
-    },
   }
 }
 </script>

src/ui/FileForm.vue

@@ -9,7 +9,7 @@
     :id="id"
     class="mt-2 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
     type="file"
-    :class="class"
+    :class="$attrs.class"
     @change="convertFileToBase64($event.target.files)"
   >
 </template>
@@ -20,19 +20,18 @@ import { toBase64 } from '../util/file'
 export default {
   props: {
     modelValue: {
+      type: String,
+      default: null,
     },
     label: {
       type: String,
+      default: null,
       required: false,
     },
     id: {
       type: String,
       required: true,
     },
-    class: {
-      type: String,
-      required: false,
-    },
   },
   emits: ['update:modelValue'],
   methods: {

src/ui/InputForm.vue

@@ -10,7 +10,7 @@
     class="mt-2 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
     :type="type"
     :value="modelValue"
-    :class="class"
+    :class="$attrs.class"
     @change="$emit('change', $event)"
     @input="$emit('update:modelValue', $event.target.value)"
   >
@@ -20,9 +20,12 @@
 export default {
   props: {
     modelValue: {
+      type: String,
+      default: null,
     },
     label: {
       type: String,
+      default: null,
       required: false,
     },
     type: {
@@ -34,11 +37,7 @@ export default {
       type: String,
       required: true,
     },
-    "class": {
-      type: String,
-      required: false,
-    },
   },
-  emits: ['update:modelValue'],
+  emits: ['update:modelValue', 'change'],
 }
 </script>

src/ui/RangeForm.vue

@@ -12,7 +12,7 @@
     :min="min"
     :max="max"
     :step="step"
-    :class="class"
+    :class="$attrs.class"
     :value="modelValue"
     @input="$emit('update:modelValue', $event.target.value)"
   >
@@ -22,9 +22,12 @@
 export default {
   props: {
     modelValue: {
+      type: String,
+      default: null,
     },
     label: {
       type: String,
+      default: null,
       required: false,
     },
     id: {
@@ -46,10 +49,6 @@ export default {
       required: false,
       default: 0.1,
     },
-    "class": {
-      type: String,
-      required: false,
-    },
   },
   emits: ['update:modelValue'],
 }

src/ui/SelectForm.vue

@@ -8,7 +8,7 @@
   <select
     :id="id"
     class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
-    :class="class"
+    :class="$attrs.class"
     :value="modelValue"
     @input="$emit('update:modelValue', $event.target.value)"
   >
@@ -25,9 +25,12 @@
 export default {
   props: {
     modelValue: {
+      type: String,
+      default: null,
     },
     label: {
       type: String,
+      default: null,
       required: false,
     },
     items: {
@@ -38,10 +41,6 @@ export default {
       type: String,
       required: true,
     },
-    "class": {
-      type: String,
-      required: false,
-    },
   },
   emits: ['update:modelValue'],
 }

src/ui/TextareaForm.vue

@@ -8,7 +8,7 @@
   <textarea
     :id="id"
     class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
-    :class="class"
+    :class="$attrs.class"
     :value="modelValue"
     @input="$emit('update:modelValue', $event.target.value)"
   />
@@ -18,24 +18,23 @@
 export default {
   props: {
     modelValue: {
+      type: String,
+      default: null,
     },
     label: {
       type: String,
+      default: null,
       required: false,
     },
     type: {
       type: String,
       required: false,
-      defaut: 'text'
+      default: 'text'
     },
     id: {
       type: String,
       required: true,
     },
-    "class": {
-      type: String,
-      required: false,
-    },
   },
   emits: ['update:modelValue'],
 }