More changes

components/cart/CartItem/CartItem.tsx

@@ -97,15 +97,17 @@ const CartItem = ({
           <button type="button" onClick={() => increaseQuantity(-1)}>
             <Minus width={18} height={18} />
           </button>
-          <input
-            type="number"
-            max={99}
-            min={0}
-            className={s.quantity}
-            value={quantity}
-            onChange={handleQuantity}
-            onBlur={handleBlur}
-          />
+          <label>
+            <input
+              type="number"
+              max={99}
+              min={0}
+              className={s.quantity}
+              value={quantity}
+              onChange={handleQuantity}
+              onBlur={handleBlur}
+            />
+          </label>
           <button type="button" onClick={() => increaseQuantity(1)}>
             <Plus width={18} height={18} />
           </button>

components/common/Navbar/Navbar.tsx

@@ -42,7 +42,7 @@ const Navbar: FC<Props> = ({ className }) => {
       </div>
 
       <div className="flex pb-4 lg:px-6 lg:hidden">
-        <Searchbar id="mobileSearch" />
+        <Searchbar />
       </div>
     </div>
   )

components/common/Searchbar/Searchbar.tsx

@@ -22,29 +22,31 @@ const Searchbar: FC<Props> = ({ className, id = 'search' }) => {
         className
       )}
     >
-      <label>
-        <input
-          className={s.input}
-          placeholder="Search for products..."
-          defaultValue={router.query.q}
-          onKeyUp={(e) => {
-            e.preventDefault()
-
-            if (e.key === 'Enter') {
-              const q = e.currentTarget.value
-
-              router.push(
-                {
-                  pathname: `/search`,
-                  query: q ? { q } : {},
-                },
-                undefined,
-                { shallow: true }
-              )
-            }
-          }}
-        />
+      <label className="hidden" htmlFor={id}>
+        Search
       </label>
+      <input
+        id={id}
+        className={s.input}
+        placeholder="Search for products..."
+        defaultValue={router.query.q}
+        onKeyUp={(e) => {
+          e.preventDefault()
+
+          if (e.key === 'Enter') {
+            const q = e.currentTarget.value
+
+            router.push(
+              {
+                pathname: `/search`,
+                query: q ? { q } : {},
+              },
+              undefined,
+              { shallow: true }
+            )
+          }
+        }}
+      />
       <div className={s.iconContainer}>
         <svg className={s.icon} fill="currentColor" viewBox="0 0 20 20">
           <path