diff --git a/frontend/src/components/feedback_labels/LabelSelector.vue b/frontend/src/components/feedback_labels/LabelSelector.vue index 02c71161da20069469f73f22d9549e0b8a97b3aa..ee88c72a0ce6dc6d2741dce543069b53c7bc241e 100644 --- a/frontend/src/components/feedback_labels/LabelSelector.vue +++ b/frontend/src/components/feedback_labels/LabelSelector.vue @@ -2,35 +2,28 @@ <v-card> <v-card-title>Assign labels</v-card-title> <v-divider /> - <v-row> - <v-col - class="ml-2" - sm="10" + <v-card-text> + <v-autocomplete + id="label-add-autocomplete" + :items="feedbackLabels" + item-text="name" + item-value="pk" + append-icon="search" + placeholder="search for keywords" + @keyup.enter.ctrl.exact="submitFeedback" + @input="addLabel" > - <v-autocomplete - id="label-add-autocomplete" - :items="feedbackLabels" - item-text="name" - item-value="pk" - append-icon="search" - placeholder="search for keywords" - @keyup.enter.ctrl.exact="submitFeedback" - @input="addLabel" - > - <template #item="{ item }"> - <div class="label-adder-item"> - <feedback-label v-bind="item" /> - </div> - </template> - </v-autocomplete> - </v-col> - <v-row - class="ml-2 mb-3" - > - <v-col sm="4"> - <v-col sm="12"> + <template #item="{ item }"> + <div class="label-adder-item"> + <feedback-label v-bind="item" /> + </div> + </template> + </v-autocomplete> + <v-row> + <v-col md="4"> + <div> CURRENT LABELS - </v-col> + </div> <feedback-label v-for="label in unchangedMapped" :key="label.pk" @@ -39,10 +32,10 @@ @remove-clicked="removeLabel" /> </v-col> - <v-col sm="4"> - <v-col sm="12"> + <v-col md="4"> + <div> WILL BE REMOVED - </v-col> + </div> <feedback-label v-for="label in removedMapped" :key="label.pk" @@ -51,10 +44,10 @@ @remove-clicked="addLabel" /> </v-col> - <v-col sm="4"> - <v-col sm="12"> + <v-col md="4"> + <div> WILL BE ADDED - </v-col> + </div> <feedback-label v-for="label in addedMapped" :key="label.pk" @@ -64,7 +57,7 @@ /> </v-col> </v-row> - </v-row> + </v-card-text> </v-card> </template>