fix: search input behaviour

src/components/SiteSearch.vue

@@ -8,7 +8,7 @@
 
       <input
         class="transition-fast relative block h-10 w-full lg:w-1/2 lg:focus:w-3/4 bg-gray-100 border border-gray-500 focus:border-blue-400 outline-none cursor-pointer text-gray-700 px-4 pb-0 pt-px"
-        :class="{ 'transition-border': query }"
+        :class="{ 'transition-border': query, 'lg:w-3/4': query }"
         autocomplete="off"
         name="search"
         placeholder="Search"
@@ -143,12 +143,21 @@ input[name='search'] {
   border-radius: 25px;
   text-indent: 1.2em;
 }
+
 input[name='search'].transition-border {
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 0;
   border-top-left-radius: 0.5rem;
   border-top-right-radius: 0.5rem;
 }
+
+input[type='search']::-webkit-search-decoration,
+input[type='search']::-webkit-search-cancel-button,
+input[type='search']::-webkit-search-results-button,
+input[type='search']::-webkit-search-results-decoration {
+  -webkit-appearance: none;
+}
+
 .fade-enter-active {
   transition: opacity 0.5s;
 }

yarn.lock

@@ -7665,10 +7665,10 @@ saber-plugin-query-posts@^0.4.0:
     slugo "^0.2.3"
     url-join "^4.0.0"
 
-saber-plugin-search@^0.0.20.0.2-canary.366.524f251.0:
-  version "0.0.2-canary.366.524f251.0"
-  resolved "https://registry.yarnpkg.com/saber-plugin-search/-/saber-plugin-search-0.0.2-canary.366.524f251.0.tgz#859a92582bda2503be1fd26016e50bf5fd971eba"
-  integrity sha512-hqIDetGnxvZtbYXpUvIILT4sOECVYxiXVedJuI6gp7dTwXPjY9VFhzgvPwq+pyiW0D4H08W4TzFdOhu8KbpB0w==
+saber-plugin-search@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/saber-plugin-search/-/saber-plugin-search-0.1.0.tgz#5d249c1c58dd33a47dfda3ed4f37ff40aef2f099"
+  integrity sha512-D9P5bxo0PnEXcrLJKdxpyfyIeZs2yb5YSJywjz1H4L5t79Qil9xx9MhYTU7x1dupurNAZZ+N4F63RTnez44Dqg==
 
 saber-utils@^0.2.0:
   version "0.2.0"