Ability to remove uploaded logo and get back to text logo

This commit is contained in:
Peter Papp
2020-11-22 08:56:53 +01:00
parent d76ff07bf4
commit 4e5afa4747
2 changed files with 75 additions and 3 deletions

View File

@@ -3,7 +3,7 @@
"/css/app.css": "/css/app.css",
"/chunks/admin.js": "/chunks/admin.js?id=5807ec412746448047f9",
"/chunks/admin-account.js": "/chunks/admin-account.js?id=0962d9d0301abf802d07",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.js?id=ac72621206dad357a4a5",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.js?id=1ad1b7b56512338223eb",
"/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~01aef58e.js": "/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~01aef58e.js?id=a9bee156de75062a1925",
"/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/trash.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/trash.js?id=0b4966a15f5749046c2e",
"/chunks/app-appearance.js": "/chunks/app-appearance.js?id=03e587de7dd10fba3ead",
@@ -337,5 +337,44 @@
"/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.9b7034220da5b2d0fbd4.hot-update.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.9b7034220da5b2d0fbd4.hot-update.js",
"/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.ced21ac245b8f838be4f.hot-update.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.ced21ac245b8f838be4f.hot-update.js",
"/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.49302d27c1461e4472a3.hot-update.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.49302d27c1461e4472a3.hot-update.js",
"/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.9364c98c9779f86aac32.hot-update.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.9364c98c9779f86aac32.hot-update.js"
"/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.9364c98c9779f86aac32.hot-update.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared-page.9364c98c9779f86aac32.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.81d7d7bd6e90b3a1015d.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.81d7d7bd6e90b3a1015d.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.ac7a0f312c57fbe0dd7f.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.ac7a0f312c57fbe0dd7f.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.4fcb717b4d48528aa8a6.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.4fcb717b4d48528aa8a6.hot-update.js",
"/js/main.4f9b9105fc6c67bbaec3.hot-update.js": "/js/main.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/admin-account.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/admin-account.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/app-appearance.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/app-appearance.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/app-billings.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/app-billings.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/app-email.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/app-email.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/app-index.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/app-index.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/app-others.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/app-others.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/app-payments.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/app-payments.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/app-setup.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/app-setup.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/plan-create.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/plan-create.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/upgrade.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/upgrade.4f9b9105fc6c67bbaec3.hot-update.js",
"/chunks/user-create.4f9b9105fc6c67bbaec3.hot-update.js": "/chunks/user-create.4f9b9105fc6c67bbaec3.hot-update.js",
"/js/main.daa48c89da268138ad3c.hot-update.js": "/js/main.daa48c89da268138ad3c.hot-update.js",
"/chunks/admin-account.daa48c89da268138ad3c.hot-update.js": "/chunks/admin-account.daa48c89da268138ad3c.hot-update.js",
"/chunks/app-appearance.daa48c89da268138ad3c.hot-update.js": "/chunks/app-appearance.daa48c89da268138ad3c.hot-update.js",
"/chunks/app-billings.daa48c89da268138ad3c.hot-update.js": "/chunks/app-billings.daa48c89da268138ad3c.hot-update.js",
"/chunks/app-email.daa48c89da268138ad3c.hot-update.js": "/chunks/app-email.daa48c89da268138ad3c.hot-update.js",
"/chunks/app-index.daa48c89da268138ad3c.hot-update.js": "/chunks/app-index.daa48c89da268138ad3c.hot-update.js",
"/chunks/app-others.daa48c89da268138ad3c.hot-update.js": "/chunks/app-others.daa48c89da268138ad3c.hot-update.js",
"/chunks/app-payments.daa48c89da268138ad3c.hot-update.js": "/chunks/app-payments.daa48c89da268138ad3c.hot-update.js",
"/chunks/app-setup.daa48c89da268138ad3c.hot-update.js": "/chunks/app-setup.daa48c89da268138ad3c.hot-update.js",
"/chunks/plan-create.daa48c89da268138ad3c.hot-update.js": "/chunks/plan-create.daa48c89da268138ad3c.hot-update.js",
"/chunks/upgrade.daa48c89da268138ad3c.hot-update.js": "/chunks/upgrade.daa48c89da268138ad3c.hot-update.js",
"/chunks/user-create.daa48c89da268138ad3c.hot-update.js": "/chunks/user-create.daa48c89da268138ad3c.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.1a8c47ae9b022b7af7d3.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.1a8c47ae9b022b7af7d3.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.066f133616eb175f4af6.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.066f133616eb175f4af6.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.d73f99d210e1ea66a239.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.d73f99d210e1ea66a239.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.b63e2aba7a8a6d43cb05.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.b63e2aba7a8a6d43cb05.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.fbfc1f4d8e97870aa4ce.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.fbfc1f4d8e97870aa4ce.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.520a4f6bbc336aec6cb3.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.520a4f6bbc336aec6cb3.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.98f6ef3f513877a49b89.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.98f6ef3f513877a49b89.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.2f081d124d6011885163.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.2f081d124d6011885163.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.4e4f285fde330b6b2e84.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.4e4f285fde330b6b2e84.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.2f298e484efb4f71881b.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.2f298e484efb4f71881b.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.327ed92ac0a93c729277.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.327ed92ac0a93c729277.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.cfbff61e7d8187da97fe.hot-update.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~2d9ff916.cfbff61e7d8187da97fe.hot-update.js"
}

View File

@@ -1,5 +1,9 @@
<template>
<div class="dropzone" :class="{ 'is-error': error }">
<div v-if="imagePreview" @click="resetImage" class="reset-image">
<x-icon size="14" class="close-icon"></x-icon>
</div>
<input
ref="file"
type="file"
@@ -26,7 +30,7 @@
</template>
<script>
import ImageIcon from "vue-feather-icons/icons/ImageIcon";
import { XIcon, ImageIcon } from 'vue-feather-icons'
export default {
name: 'ImageInput',
@@ -35,6 +39,7 @@
],
components: {
ImageIcon,
XIcon,
},
data() {
return {
@@ -47,6 +52,10 @@
},
},
methods: {
resetImage() {
this.imagePreview = undefined
this.$emit('input', undefined)
},
showImagePreview(event) {
const imgPath = event.target.files[0].name,
extn = imgPath
@@ -152,6 +161,30 @@
@include font-size(12);
}
}
.reset-image {
z-index: 2;
background: white;
border-radius: 50px;
display: block;
position: absolute;
right: 0;
top: 0;
cursor: pointer;
@include transform(translateY(-50%) translateX(50%));
padding: 0px 4px;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12);
.close-icon {
vertical-align: middle;
line {
path {
fill: $text;
}
}
}
}
}
@media (prefers-color-scheme: dark) {