From 8e7087c46125eb9a13e4d43100e7708ecd216118 Mon Sep 17 00:00:00 2001
From: dragongoose <19649813+dragongoose@users.noreply.github.com>
Date: Mon, 10 Jul 2023 22:32:50 -0400
Subject: [PATCH] Fix search bar placeholder not working after changing
 language #4

---
 src/components/SearchBar.vue | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/components/SearchBar.vue b/src/components/SearchBar.vue
index 8d8ed55..6221bdf 100644
--- a/src/components/SearchBar.vue
+++ b/src/components/SearchBar.vue
@@ -16,10 +16,18 @@ export default {
 
 <template>
     <div class="relative hidden md:block">
-        <label for="searchBar" class="hidden">{{ $t("main.search") }}</label>
-        <v-icon name="io-search-outline" class="text-black absolute my-auto inset-y-0 left-2"></v-icon>
-        <input type="text" :placeholder="$t('main.search')"
-            @keyup.enter=redirectToSearch v-model="searchInput"
-            class="rounded-md p-1 pl-8 text-black" ref="searchInput" />
+      <form class="relative">
+          <label for="searchBar" class="hidden">{{ $t("main.search") }}</label>
+          <v-icon name="io-search-outline" class="absolute my-auto inset-y-0 left-2"></v-icon>
+          <input
+            type="text"
+            id="searchBar"
+            name="searchBar"
+            :placeholder="$t('main.search')"
+            v-model="searchInput"
+            @keyup.enter=redirectToSearch
+            class="rounded-md p-1 pl-8 text-black bg-white placeholder:text-black"
+          />
+        </form>
     </div>
 </template>
\ No newline at end of file