From b59e007e6d23483abe8973fe5c21412ddf8709b7 Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Fri, 25 Mar 2022 19:27:32 +1100
Subject: Add search enter/escape, and close-icon svgs

---
 src/components/Settings.vue | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

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

diff --git a/src/components/Settings.vue b/src/components/Settings.vue
index 433be16..b56de12 100644
--- a/src/components/Settings.vue
+++ b/src/components/Settings.vue
@@ -44,9 +44,14 @@ export default defineComponent({
 	<transition name="slide-bottom-right">
 		<div v-if="isOpen"
 			class="absolute bottom-4 right-4 min-w-[5cm] p-3 bg-stone-50 visible rounded-md shadow shadow-black">
-			<div class="absolute top-2 right-2 w-[24px] h-[24px] [font-size:24px] [line-height:24px] text-center
-					font-bold hover:cursor-pointer"
-				@click="closeClicked" ref="closeIcon">&times;</div>
+			<svg v-if="isOpen"
+				class="block absolute top-2 right-2 w-6 h-6 hover:cursor-pointer"
+				@click="closeClicked" ref="closeIcon"
+				xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"
+				stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+			  <line x1="18" y1="6" x2="6" y2="18"/>
+			  <line x1="6" y1="6" x2="18" y2="18"/>
+			</svg>
 			<h1 class="text-xl font-bold mb-2">Settings</h1>
 			<hr class="border-stone-400"/>
 			<div>
-- 
cgit v1.2.3