add close icon in chips

components/Search.vue

@@ -21,6 +21,7 @@
       template(v-slot:selection="data")
         v-chip(v-bind="data.attrs"
           close
+          :close-icon='mdiCloseCircle'
           @click:close='remove(data.item)'
           :input-value="data.selected")
           v-avatar(left)
@@ -35,7 +36,7 @@
 
 <script>
 import { mapState } from 'vuex'
-import { mdiMapMarker, mdiTag } from '@mdi/js'
+import { mdiMapMarker, mdiTag, mdiCloseCircle } from '@mdi/js'
 export default {
   name: 'Search',
   props: {
@@ -44,7 +45,7 @@ export default {
   },
   data () {
     return {
-      mdiTag, mdiMapMarker,
+      mdiTag, mdiMapMarker, mdiCloseCircle,
       tmpfilter: null,
       search: ''
     }

pages/add/_edit.vue

@@ -54,6 +54,10 @@
                   :delimiters="[',', ';']"
                   :items="tags.map(t => t.tag)"
                   :label="$t('common.tags')")
+                  template(v-slot:selection="{ item, on, attrs, selected, parent}")
+                    v-chip(v-bind="attrs" close :close-icon='mdiCloseCircle' @click:close='parent.selectItem(item)'
+                      :input-value="selected" label small) {{item}}
+        </v-chip>
 
       v-card-actions
         v-spacer
@@ -65,7 +69,7 @@
 import { mapActions, mapState } from 'vuex'
 import dayjs from 'dayjs'
 
-import { mdiFileImport, mdiFormatTitle, mdiTagMultiple } from '@mdi/js'
+import { mdiFileImport, mdiFormatTitle, mdiTagMultiple, mdiCloseCircle } from '@mdi/js'
 
 export default {
   name: 'NewEvent',
@@ -117,7 +121,7 @@ export default {
     const month = dayjs().month() + 1
     const year = dayjs().year()
     return {
-      mdiFileImport, mdiFormatTitle, mdiTagMultiple,
+      mdiFileImport, mdiFormatTitle, mdiTagMultiple, mdiCloseCircle,
       valid: false,
       openImportDialog: false,
       event: {

pages/index.vue

@@ -15,7 +15,7 @@
 
       .col.pt-0.pt-md-2
         Search(:filters='filters' @update='updateFilters')
-        v-chip(v-if='selectedDay' close @click:close='dayChange({ date: selectedDay})') {{selectedDay}}
+        v-chip(v-show='selectedDay' close :close-icon='mdiCloseCircle' @click:close='dayChange({ date: selectedDay})') {{selectedDay}}
 
     //- Events
     #events.mb-2.mt-1.pl-1.pl-sm-2
@@ -31,6 +31,7 @@ import Event from '@/components/Event'
 import Announcement from '@/components/Announcement'
 import Search from '@/components/Search'
 import Calendar from '@/components/Calendar'
+import { mdiCloseCircle } from '@mdi/js'
 
 export default {
   name: 'Index',
@@ -46,6 +47,7 @@ export default {
   },
   data ({ $store }) {
     return {
+      mdiCloseCircle,
       first: true,
       isCurrentMonth: true,
       now: dayjs().unix(),