Add documentation

client/src/components/content-forms/DocumentForm.vue

@@ -24,59 +24,3 @@ const updateUrl = (url: string) => {
   emit('change-url', url, props.index);
 };
 </script>
-
-<style scoped lang="scss">
-@import 'styles/helpers';
-
-.document-form {
-  &__uploaded {
-    display: flex;
-    align-items: center;
-  }
-
-  &__link {
-    text-decoration: underline;
-  }
-
-  &__spinner {
-    width: 100%;
-    height: 150px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-
-  &__loading-icon {
-    @include spin;
-    fill: $color-silver-dark;
-  }
-
-  &__icon {
-    width: 30px;
-    height: 30px;
-    margin-right: $small-spacing;
-  }
-
-  &__file-input {
-    width: 0.1px;
-    height: 0.1px;
-    overflow: hidden;
-    opacity: 0;
-    position: absolute;
-    z-index: -1;
-
-    & + label {
-      cursor: pointer;
-      background-color: $color-silver-light;
-      height: 150px;
-      display: flex;
-      width: 100%;
-      justify-content: center;
-      align-items: center;
-      font-family: $sans-serif-font-family;
-      font-weight: $font-weight-regular;
-      text-decoration: underline;
-    }
-  }
-}
-</style>

client/src/components/content-forms/DocumentInput.vue

@@ -115,6 +115,8 @@ onMounted(() => {
   }
 
   &__file-input {
+    /* this element should not be visible for the user, but the width can't be 0, otherwise it does not exist in the
+* DOM. With this hack, the element still works */
     width: 0.1px;
     height: 0.1px;
     overflow: hidden;