From 5e86d2a3daa95ec2eb29003351bb75e4bf75bd53 Mon Sep 17 00:00:00 2001
From: Joel Drake <joeldrak3@outlook.com>
Date: Wed, 28 Dec 2022 17:35:40 +0100
Subject: [PATCH] fix: Focus search input style on safari (#613)

---
 components/search/SearchWidget.vue | 2 +-
 unocss.config.ts                   | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/components/search/SearchWidget.vue b/components/search/SearchWidget.vue
index 2a3801a0..c210431a 100644
--- a/components/search/SearchWidget.vue
+++ b/components/search/SearchWidget.vue
@@ -52,7 +52,7 @@ const activate = () => {
 
 <template>
   <div ref="el" relative px4 py2 group>
-    <div bg-base border="~ base" h10 rounded-full flex="~ row" items-center relative outline-primary outline-1 focus-within:outline>
+    <div bg-base border="~ base" h10 rounded-full flex="~ row" items-center relative focus-within:box-shadow-outline>
       <div i-ri:search-2-line mx4 absolute pointer-events-none text-secondary mt="1px" />
       <input
         ref="input"
diff --git a/unocss.config.ts b/unocss.config.ts
index 4e7e6a6c..db0ad0f4 100644
--- a/unocss.config.ts
+++ b/unocss.config.ts
@@ -103,5 +103,6 @@ export default defineConfig({
       res += `\n${res.replace('{scrollbar-width:none;}', '::-webkit-scrollbar{display: none;}')}`
       return res
     }],
+    ['box-shadow-outline', { 'box-shadow': '0 0 0 1px var(--c-primary)' }],
   ],
 })