Merge branch

Merge remote-tracking branch 'origin/alyssa-omega' into brian_omega

frontend/src/views/form/index.vue

 <template>
-  <div class="app-container">
-    <el-form ref="form" :model="form" label-width="120px">
-      <el-form-item label="Message:">
-        <el-input v-model="form.desc" type="textarea" />
-      </el-form-item>
-    <el-form-item label="Upload Media">
-      <el-upload
-        class="upload-demo"
-        drag
-        action="https://jsonplaceholder.typicode.com/posts/"
-        accept="image/jpeg,image/png,text/plain, application/pdf"
-        :on-preview="handlePreview"
-        :on-remove="handleRemove"
-        :on-success="handleUploadSuccess"
-        :auto-upload="false"
-        :before-upload="handleUploadbefore"
-        :file-list="fileList"
-        multiple>
-        <i class="el-icon-upload"></i>
-        <div class="el-upload__text">Drop file here or <em>click to upload (PDF, JPEG, PNG) </em></div>
-    </el-upload>
-    </el-form-item>
+  <div id="app">
+    <el-card class="box-card" style="width:700px;margin:auto;">
+      <el-form ref="form" :model="form" label-width="120px">
+        <el-form-item label="Message:">
+          <el-input v-model="form.desc" type="textarea" />
+        </el-form-item>
+        
+        <el-form-item label="Upload Media">
+          <el-upload
+            class="upload-demo"
+            drag
+            action="https://jsonplaceholder.typicode.com/posts/"
+            accept="image/jpeg,image/png,text/plain, application/pdf"
+            :on-preview="handlePreview"
+            :on-remove="handleRemove"
+            :on-success="handleUploadSuccess"
+            :auto-upload="false"
+            :before-upload="handleUploadbefore"
+            :file-list="fileList"
+            list-type="picture">
+            <i class="el-icon-upload"></i>
+            <div class="el-upload__text">Drop file here or <em>click to upload (PDF, JPEG, PNG) </em></div>
+        </el-upload>
+        </el-form-item>
 
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-        <el-button @click="onCancel">Cancel</el-button>
-      </el-form-item>
-    </el-form>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit">Submit</el-button>
+          <el-button @click="onCancel">Cancel</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
   </div>
 </template>
 
@@ -76,5 +79,18 @@ export default {
     line-height: 18x;
   }
 }
+
+body {
+        margin: 0px;
+    }
+    #app {
+        position: relative;
+        width: 100%;
+        height: 75vh;
+        display:flex;
+        justify-content: center;
+        align-items: center;
+    }
+
 </style>