update: look at todo

web/frontend/pages/NLP/no-context/question-answering.vue

@@ -1,33 +1,42 @@
 <template lang="pug">
-div
-    .container.mx-auto.p-4
-        form(v-if="!loading", @submit.prevent="submitForm")
-            label.block.font-bold.text-lg.mb-2(for="question") Question
-            textarea#question.border.rounded.w-full.py-2.px-3(
-                v-model="form.question",
-                rows="5"
-            )
-            button.bg-blue-500.text-white.font-bold.py-2.px-4.rounded(
-                class="hover:bg-blue-700",
-                type="submit",
-                v-if="form.submitCounter < 600"
-            )
-                | Submit
-            p.bg-red-500(v-if="form.submitCounter >= 600") Please wait for sometime as you have made 600 requests within one hour.
-        .flex.items-center.justify-center.h-screen(v-if="loading")
-            loadingwheel
-        .mt-4.font-bold(v-if="answer !== null")
-            p Question: {{ tmpquestion }}
-            p.typed-text Answer: {{ typedAnswer }}
-            p Urls:
-            ul(v-if="typedAnswer.length === answer.length && urls !== null")
-                li(v-for="url in urls", :key="url")
-                    a.url(:href="url") - {{ url }}
-
+div(v-if="loading")
+    .flex.items-center.justify-center.h-screen(v-if="loading")
+        LoadingWheel
+div(v-else)
+    .grid.grid-cols-1.place-content-center.align-middle.gap-y-5.h-screen.text-center
+        .grid.grid-cols-1.place-self-center
+            h1.text-5xl
+                a.url(href="/NLP") Internet-NLP
+            h1.text-2xl
+                a.url(href="/NLP/no-context/question-answering") Question Answering No Context
+            h1.text-2xl
+                a.url(href="/") Part of Internet-ML
+        .container.mx-auto
+            form(v-if="!loading", @submit.prevent="submitForm")
+                label.block.font-bold.text-lg.mb-2(for="question") Question
+                textarea#question.border.rounded.w-full.py-2.px-3(
+                    v-model="form.question",
+                    rows="5"
+                )
+                button.bg-gray-500.text-white.font-bold.py-2.px-4.rounded(
+                    class="hover:bg-gray-700",
+                    type="submit",
+                    v-if="form.submitCounter < 600"
+                )
+                    | Submit
+                p.bg-red-500(v-if="form.submitCounter >= 600") Please wait for sometime as you have made 600 requests   within one hour.
+            .mt-4.font-bold(v-if="answer !== null")
+                p Question: {{ tmpquestion }}
+                p.typed-text Answer: {{ typedAnswer }}
+                p Urls:
+                ul(v-if="typedAnswer.length === answer.length && urls !== null")
+                    li(v-for="url in urls", :key="url")
+                        span - 
+                        a.url(:href="url") {{ url }}
 </template>
 
 <script>
-import LoadingWheel from '~/components/LoadingWheel.vue'
+import LoadingWheel from '@/components/LoadingWheel.vue'
 
 export default {
     components: { LoadingWheel },