Introduce component wrapper for svg icons
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
<h3 class="title">{{ $t("new_collection") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
<closeIcon class="material-icons" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -44,8 +44,12 @@
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import closeIcon from "~/static/icons/close-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
closeIcon,
|
||||
},
|
||||
props: {
|
||||
show: Boolean,
|
||||
},
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<h3 class="title">{{ $t("new_folder") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
<closeIcon class="material-icons" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -44,8 +44,12 @@
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import closeIcon from "~/static/icons/close-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
closeIcon,
|
||||
},
|
||||
props: {
|
||||
show: Boolean,
|
||||
collection: Object,
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<button class="icon" @click="toggleShowChildren">
|
||||
<i class="material-icons" v-show="!showChildren">arrow_right</i>
|
||||
<i class="material-icons" v-show="showChildren">arrow_drop_down</i>
|
||||
<i class="material-icons">folder</i>
|
||||
<folderIcon class="material-icons" />
|
||||
<span>{{ collection.name }}</span>
|
||||
</button>
|
||||
<div>
|
||||
@@ -35,7 +35,7 @@
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="removeCollection" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<deleteIcon class="material-icons" />
|
||||
<span>{{ $t("delete") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
@@ -98,8 +98,11 @@ ul li {
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import folderIcon from "~/static/icons/folder-24px.svg?inline"
|
||||
import deleteIcon from "~/static/icons/delete-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: { folderIcon, deleteIcon },
|
||||
props: {
|
||||
collectionIndex: Number,
|
||||
collection: Object,
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<h3 class="title">{{ $t("edit_collection") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
<closeIcon class="material-icons" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -44,8 +44,12 @@
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import closeIcon from "~/static/icons/close-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
closeIcon,
|
||||
},
|
||||
props: {
|
||||
show: Boolean,
|
||||
editingCollection: Object,
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<h3 class="title">{{ $t("edit_folder") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
<closeIcon class="material-icons" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -39,8 +39,12 @@
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import closeIcon from "~/static/icons/close-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
closeIcon,
|
||||
},
|
||||
props: {
|
||||
show: Boolean,
|
||||
collection: Object,
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<h3 class="title">{{ $t("edit_request") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
<closeIcon class="material-icons" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -70,8 +70,12 @@
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import closeIcon from "~/static/icons/close-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
closeIcon,
|
||||
},
|
||||
props: {
|
||||
show: Boolean,
|
||||
collectionIndex: Number,
|
||||
|
||||
@@ -22,7 +22,7 @@
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="removeFolder" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<deleteIcon class="material-icons" />
|
||||
<span>{{ $t("delete") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
@@ -72,8 +72,10 @@ ul li {
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import deleteIcon from "~/static/icons/delete-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: { deleteIcon },
|
||||
props: {
|
||||
folder: Object,
|
||||
collectionIndex: Number,
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<h3 class="title">{{ $t("import_export") }} {{ $t("collections") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
<closeIcon class="material-icons" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -77,8 +77,12 @@
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import closeIcon from "~/static/icons/close-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
closeIcon,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
fb,
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="removeRequest" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<deleteIcon class="material-icons" />
|
||||
<span>{{ $t("delete") }}</span>
|
||||
</button>
|
||||
</div>
|
||||
@@ -47,8 +47,10 @@ ul li {
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import deleteIcon from "~/static/icons/delete-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: { deleteIcon },
|
||||
props: {
|
||||
request: Object,
|
||||
collectionIndex: Number,
|
||||
@@ -68,13 +70,13 @@ export default {
|
||||
this.$store.commit("postwoman/selectRequest", { request: this.request })
|
||||
},
|
||||
removeRequest() {
|
||||
if (!confirm( this.$t("are_you_sure_remove_request"))) return
|
||||
if (!confirm(this.$t("are_you_sure_remove_request"))) return
|
||||
this.$store.commit("postwoman/removeRequest", {
|
||||
collectionIndex: this.collectionIndex,
|
||||
folderIndex: this.folderIndex,
|
||||
requestIndex: this.requestIndex,
|
||||
})
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
this.$toast.error(this.$t("deleted"), {
|
||||
icon: "delete",
|
||||
})
|
||||
this.syncCollections()
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<h3 class="title">{{ $t("save_request_as") }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
<closeIcon class="material-icons" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -79,8 +79,12 @@
|
||||
|
||||
<script>
|
||||
import { fb } from "~/helpers/fb"
|
||||
import closeIcon from "~/static/icons/close-24px.svg?inline"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
closeIcon,
|
||||
},
|
||||
props: {
|
||||
show: Boolean,
|
||||
editingRequest: Object,
|
||||
|
||||
Reference in New Issue
Block a user