diff --git a/src/views/HomePage/CreateMilestoneView.vue b/src/views/HomePage/CreateMilestoneView.vue index adbbea10e4dacffbae8472938a3aa5440de5c359..92f95320756f0196ee09a3f5ccb34e085fc1968e 100644 --- a/src/views/HomePage/CreateMilestoneView.vue +++ b/src/views/HomePage/CreateMilestoneView.vue @@ -82,6 +82,13 @@ const handleFileChange = (event: any) => { } reader.readAsDataURL(file) } +const fileInput = ref(null); + +const openFileExplorer = () => { + if (fileInput.value) { + fileInput.value.click(); + } +}; </script> @@ -156,12 +163,12 @@ const handleFileChange = (event: any) => { <div class="image-container"> <label>Legg til et bilde</label> <div class="add-image-box"> - <label> + <button @click="openFileExplorer" tabindex="0" type="button"> <input type="file" style="display: none" ref="fileInput" accept="image/png, image/jpeg" @change="handleFileChange"> <img v-if="image" :src="image" id="literal-image" alt="Selected Image" width="150px" height="150px"> <img v-else src="../../components/icons/image/AddImage.png" alt="Add Image" width="50px" height="50px"> - </label> + </button> </div> <!-- <div class="existing-pictures">--> <!-- <div class="existing-image-box"></div>-->