From 8764aee445a771c2708a0a25b9164265be6c91c6 Mon Sep 17 00:00:00 2001
From: Ramon Wenger <donramonloco+github@gmail.com>
Date: Wed, 15 May 2019 15:34:32 +0200
Subject: [PATCH] Add icon to document form

---
 .../components/content-forms/DocumentForm.vue | 21 +++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/client/src/components/content-forms/DocumentForm.vue b/client/src/components/content-forms/DocumentForm.vue
index bc6fe4da..4f23d235 100644
--- a/client/src/components/content-forms/DocumentForm.vue
+++ b/client/src/components/content-forms/DocumentForm.vue
@@ -1,18 +1,25 @@
 <template>
   <div class="document-form" ref="documentform">
     <div v-if="!value.url" ref="uploadcare-panel"></div>
-    <div v-if="value.url">
+    <div v-if="value.url" class="document-form__uploaded">
+      <document-icon class="document-form__icon"></document-icon>
       <a :href="previewUrl" class="document-form__link" target="_blank">{{previewLink}}</a>
     </div>
   </div>
 </template>
 
 <script>
+  import DocumentIcon from '@/components/icons/DocumentIcon';
+
   import {uploadcare} from '@/helpers/uploadcare';
 
   export default {
-
     props: ['value', 'index'],
+
+    components: {
+      DocumentIcon
+    },
+
     mounted() {
       uploadcare(this, url => {
         this.$emit('link-change-url', url, this.index)
@@ -41,11 +48,21 @@
   @import "@/styles/_variables.scss";
 
   .document-form {
+    &__uploaded {
+      display: flex;
+      align-items: center;
+    }
 
     &__link {
       text-decoration: underline;
     }
 
+    &__icon {
+      width: 30px;
+      height: 30px;
+      margin-right: $small-spacing;
+    }
+
     &__file-input {
       width: 0.1px;
       height: 0.1px;