confirm delete + animation
This commit is contained in:
1 parent
c2bafd108f
commit
b3324e69bd
1 file changed
+6
-5
@@ -50,10 +50,10 @@ export default defineComponent({
|
|||||||
<select v-model="imageSelectedId" style="width: min-content;margin: 15px;">
|
<select v-model="imageSelectedId" style="width: min-content;margin: 15px;">
|
||||||
<option v-for="[id, image] in images" :key="id" :value="id">{{ image.name }}</option>
|
<option v-for="[id, image] in images" :key="id" :value="id">{{ image.name }}</option>
|
||||||
</select>
|
</select>
|
||||||
<button @click="confirmDelete()" :class="sure ? 'confirm' : ''">
|
<button @mouseleave="sure = false" @click="confirmDelete()" :class="sure ? 'confirm' : ''">
|
||||||
{{ sure ? "Confirmer" : "Supprimer" }}</button>
|
{{ sure ? "Confirmer" : "Supprimer" }}</button>
|
||||||
</div>
|
</div>
|
||||||
<Image v-if="imageSelectedId !== undefined" :id="imageSelectedId"></Image>
|
<Image class="home" v-if="imageSelectedId !== undefined" :id="imageSelectedId"></Image>
|
||||||
</div>
|
</div>
|
||||||
<h1 v-else>Aucune image trouvée</h1>
|
<h1 v-else>Aucune image trouvée</h1>
|
||||||
</template>
|
</template>
|
||||||
@@ -72,9 +72,10 @@ export default defineComponent({
|
|||||||
label {
|
label {
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
img {
|
<style>
|
||||||
|
.home>img {
|
||||||
max-width: 60%;
|
max-width: 60%;
|
||||||
max-height: 60%;
|
max-height: 60vh;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in new issue
Block a user