From bcf60b4e1aa2283821010715b33009d8f4a48207 Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Mon, 28 Mar 2022 12:57:20 +1100
Subject: Convert SVG icons into icon components

---
 src/components/TileImg.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

(limited to 'src/components/TileImg.vue')

diff --git a/src/components/TileImg.vue b/src/components/TileImg.vue
index ebd350d..3de0fa8 100644
--- a/src/components/TileImg.vue
+++ b/src/components/TileImg.vue
@@ -1,5 +1,6 @@
 <script lang="ts">
 import {defineComponent, PropType} from 'vue';
+import InfoIcon from './icon/InfoIcon.vue';
 import {LayoutNode} from '../layout';
 
 export default defineComponent({
@@ -88,6 +89,7 @@ export default defineComponent({
 			this.$emit('info-icon-clicked', this.layoutNode);
 		},
 	},
+	components: {InfoIcon, },
 	emits: ['info-icon-clicked'],
 });
 </script>
@@ -96,10 +98,8 @@ export default defineComponent({
 <div :style="styles" @mouseenter="onMouseEnter" @mouseleave="onMouseLeave" @mousedown="onMouseDown"
 	:class="isExpandable ? ['hover:cursor-pointer'] : []">
 	<h1 :style="headerStyles">{{layoutNode.tolNode.name}}</h1>
-	<svg :style="infoIconStyles" class="hover:cursor-pointer"
+	<info-icon :style="infoIconStyles" class="hover:cursor-pointer"
 		@mouseenter="onInfoMouseEnter" @mouseleave="onInfoMouseLeave"
-		@click.stop="onInfoClick" @mousedown.stop @mouseup.stop>
-		<use href="#svg-info"/>
-	</svg>
+		@click.stop="onInfoClick" @mousedown.stop @mouseup.stop/>
 </div>
 </template>
-- 
cgit v1.2.3