Fix icons on Files field (#384)

* Fix icon on Files field

* Fix clearfix and publish assets

commit eb5b411
Author: Potsky <[email protected]>
Date:   Thu Mar 16 14:09:34 2023 +0100

    Fix clearfix and publish assets

Author: potsky

dist/js/field.js

@@ -322,3 +322,14 @@ Files::make('Multiple files', 'multiple_files')
 - Replaced [vuejs-clipper](https://www.npmjs.com/package/vuejs-clipper) with [vue-advanced-cropper](https://www.npmjs.com/package/vue-advanced-cropper) for vue3 support
 
 Full change log in [PR #317](https://github.com/ebess/advanced-nova-media-library/pull/317)
+
+# How to contribute
+
+- You need to have Nova installed of course in your Laravel app
+- Work directly in the package in the `vendor` directory (webpack needs Nova to be installed)
+- Then from the `vendor/xxx/advanced-nova-media-library` folder:
+    - `yarn install` 
+    - `yarn npm watch` 
+    - Work hard 🤘
+    - `yarn npm production` when job is finished
+    - Make a PR

readme.md

@@ -9,15 +9,9 @@
       :configs="field.croppingConfigs"
     />
 
-    <template v-if="draggable"
-
-    ></template>
-
-    <draggable v-if="images.length > 0" v-model="images"
-               class="gallery-list clearfix">
-
+    <draggable v-if="images.length > 0" v-model="images" class="gallery-list clearfix">
       <template #item="{element, index}">
-        <div style="float:left;">
+        <div style="float:left; margin-right: 1em;">
           <component :is="singleComponent" class="mb-3 p-3 mr-3"
                      :key="index" :image="element" :field="field" :editable="editable" :removable="removable || editable" @remove="remove(index)"
                      :is-custom-properties-editable="customProperties && customPropertiesFields.length > 0"
@@ -33,12 +27,13 @@
           />
         </div>
       </template>
-
     </draggable>
 
     <span v-else-if="!editable" class="mr-3">&mdash;</span>
 
-    <span v-if="editable" class="form-file">
+    <br style="clear: both" />
+
+    <span v-if="editable" class="">
       <input :id="`__media__${field.attribute}`" :multiple="multiple" ref="file" class="form-file-input" type="file" :disabled="uploading" @change="add"/>
       <label :for="`__media__${field.attribute}`" class="">
         <DefaultButton type="button" @click.prevent="focusFileInput">

resources/js/components/Gallery.vue

@@ -11,10 +11,10 @@
         {{ image.file_name }}
       </span>
       <a v-if="isCustomPropertiesEditable" class="edit edit--file ml-2" href="#" @click.prevent="$emit('edit-custom-properties')">
-        <icon type="edit" view-box="0 0 20 20" width="16" height="16" />
+        <icon type="pencil" view-box="0 0 20 20" width="16" height="16" />
       </a>
       <a v-if="removable" class="delete ml-2" href="#" @click.prevent="$emit('remove')">
-        <icon type="delete" view-box="0 0 20 20" width="16" height="16" />
+        <icon type="trash" view-box="0 0 20 20" width="16" height="16" />
       </a>
     </div>
   </gallery-item>