Work a bit ui

frontend/components/SubmitAnalysis.vue

@@ -86,19 +86,27 @@ const submit = handleSubmit(async (values) => {
                 <UppyGenomeUpload v-model="files.value.value" ref="uppyComponentRef" class="mb-2" />
               </v-window-item>
               <v-window-item value="paste">
-                <v-form @submit.prevent="submit">
-                  <v-switch v-model="antiDefenseSystem" color="primary" inset label="anti defense system"></v-switch>
-                  <v-textarea v-model="sequence" :error-messages="sequenceErrorMessage" :count="maxSequenceLength"
-                    label="Fasta sequences" variant="filled" auto-grow></v-textarea>
-                  <v-btn type="submit" :loading="loading">Submit</v-btn>
-                </v-form>
+                <v-card flat>
+                  <v-card-text>
+                    <v-form @submit.prevent="submit">
+                      <v-switch v-model="antiDefenseSystem" color="primary" label="anti defense system"
+                        hide-details="auto" class="mx-0"></v-switch>
+                      <v-textarea v-model="sequence" :error-messages="sequenceErrorMessage" :count="maxSequenceLength"
+                        label="Fasta sequences" variant="filled" auto-grow></v-textarea>
+                      <v-btn type="submit" :loading="loading">Submit</v-btn>
+                    </v-form>
+                  </v-card-text>
+                </v-card>
               </v-window-item>
               <v-window-item value="example">
                 <v-card flat color="transparent">
                   <v-card-text>
                     You can try an example with Escherichia coli str. K-12 substr. MG1655 proteins (<a target="_blank"
                       href="https://www.ncbi.nlm.nih.gov/datasets/genome/GCF_000005845.2">GCF_000005845.2</a>)
-                    <v-switch v-model="antiDefenseSystem" color="primary" inset label="anti defense system"></v-switch>
+                  </v-card-text>
+                  <v-card-text>
+                    <v-switch v-model="antiDefenseSystem" color="primary" label="anti defense system"
+                      hide-details="auto"></v-switch>
                   </v-card-text>
                   <v-card-actions>
                     <v-btn variant="elevated" density="default" size="default" :slim="false" rounded="xl"

frontend/components/UppyGenomeUpload.vue

@@ -95,23 +95,27 @@ defineExpose({
 </script>
 <template>
     <v-card flat>
-        <v-form @submit.prevent="runAnalysis">
-            <v-switch v-model="antiDefenseSystem" color="primary" inset label="anti defense system"></v-switch>
+        <v-card-text>
+            <v-form @submit.prevent="runAnalysis">
 
-            <Dashboard :uppy="uppyCovar" :props="{
-                inline: true,
-                hideUploadButton: true,
-                theme: themeUppy,
-                width,
-                height: 300,
-                metaFields: [{
-                    id: 'uppy-genome-upload',
-                    name: 'genome',
-                    placeholder: 'Genomes'
-                }],
-            }" />
-            <v-btn type="submit" :disabled="!hasAddFiles" :loading="uploading">Submit</v-btn>
-        </v-form>
+                <v-switch v-model="antiDefenseSystem" color="primary" label="anti defense system"
+                    hide-details="auto" class="ml-1"></v-switch>
 
+                <Dashboard :uppy="uppyCovar" :props="{
+                    inline: true,
+                    hideUploadButton: true,
+                    theme: themeUppy,
+                    width,
+                    height: 300,
+                    metaFields: [{
+                        id: 'uppy-genome-upload',
+                        name: 'genome',
+                        placeholder: 'Genomes'
+                    }],
+                }" />
+
+                <v-btn type="submit" :disabled="!hasAddFiles" :loading="uploading">Submit</v-btn>
+            </v-form>
+        </v-card-text>
     </v-card>
 </template>
\ No newline at end of file