ayanova/src/views/inventory-widget-edit.vue

@@ -1,42 +1,54 @@
 <template>
   <form>
-    <v-text-field
-      v-model="obj.name"
-      v-validate="'required|max:10'"
-      :counter="10"
-      :error-messages="errors.collect('name')"
-      label="Name"
-      data-vv-name="name"
-      required
-    ></v-text-field>
-    <v-text-field
-      v-model="email"
-      v-validate="'required|email'"
-      :error-messages="errors.collect('email')"
-      label="E-mail"
-      data-vv-name="email"
-      required
-    ></v-text-field>
-    <!-- <v-select
-      v-model="select"
-      v-validate="'required'"
-      :items="items"
-      :error-messages="errors.collect('select')"
-      label="Select"
-      data-vv-name="select"
-      required
-    ></v-select>-->
-    <v-checkbox
-      v-model="obj.active"
-      v-validate="'required'"
-      :error-messages="errors.collect('checkbox')"
-      value="1"
-      label="Option"
-      data-vv-name="checkbox"
-      required
-    ></v-checkbox>
-    <v-btn @click="submit">submit</v-btn>
-    <v-btn @click="clear">clear</v-btn>
+    <v-layout align-center justify-center row wrap>
+      <v-flex xs12 sm6 lg3 xl2 grow>
+        <v-text-field
+          v-model="obj.name"
+          v-validate="'required|max:10'"
+          :counter="10"
+          :error-messages="errors.collect('name')"
+          label="Name"
+          data-vv-name="name"
+          required
+        ></v-text-field>
+      </v-flex>
+      <v-flex xs12 sm6 lg3 xl2 grow>
+        <v-text-field
+          v-model="email"
+          v-validate="'required|email'"
+          :error-messages="errors.collect('email')"
+          label="E-mail"
+          data-vv-name="email"
+          required
+        ></v-text-field>
+      </v-flex>
+      <v-flex xs12 sm6 lg3 xl2 grow>
+        <v-select
+          v-model="select"
+          v-validate="'required'"
+          :items="items"
+          :error-messages="errors.collect('select')"
+          label="Select"
+          data-vv-name="select"
+          required
+        ></v-select>
+      </v-flex>
+      <v-flex xs12 sm6 lg3 xl2 grow>
+        <v-checkbox
+          v-model="obj.active"
+          v-validate="'required'"
+          :error-messages="errors.collect('checkbox')"
+          value="1"
+          label="Option"
+          data-vv-name="checkbox"
+          required
+        ></v-checkbox>
+      </v-flex>
+      <v-flex xs12 grow>
+        <v-btn @click="submit">submit</v-btn>
+        <v-btn @click="clear">clear</v-btn>
+      </v-flex>
+    </v-layout>
   </form>
 </template>