Made the label selector layout behave

It was always larger than the parent. Now it fits.

Made the label selector layout behave
e4cb1b61 · Thilo Wischmeyer · Thilo Wischmeyer · 12fd792c · e4cb1b61
Commit e4cb1b61 authored 3 years ago by Thilo Wischmeyer Committed by Thilo Wischmeyer 3 years ago
--- 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-card-text>
-      <v-col
+      <v-autocomplete
-        class="ml-2"
+        id="label-add-autocomplete"
-        sm="10"
+        :items="feedbackLabels"
+        item-text="name"
+        item-value="pk"
+        append-icon="search"
+        placeholder="search for keywords"
+        @keyup.enter.ctrl.exact="submitFeedback"
+        @input="addLabel"
      >
-        <v-autocomplete
+        <template #item="{ item }">
-          id="label-add-autocomplete"
+          <div class="label-adder-item">
-          :items="feedbackLabels"
+            <feedback-label v-bind="item" />
-          item-text="name"
+          </div>
-          item-value="pk"
+        </template>
-          append-icon="search"
+      </v-autocomplete>
-          placeholder="search for keywords"
+      <v-row>
-          @keyup.enter.ctrl.exact="submitFeedback"
+        <v-col md="4">
-          @input="addLabel"
+          <div>
-        >
-          <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">
            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 md="4">
-          <v-col sm="12">
+          <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 md="4">
-          <v-col sm="12">
+          <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>