feat: add SearchIcon component and update HeaderSearch to include search functionality

2025-02-01 04:59:28 +08:00
parent 89da497cc9
commit c2a791bcea
4 changed files with 37 additions and 4 deletions
@@ -1,10 +1,21 @@
+import { SearchIcon } from '~/components/icons/search'
+import { Button } from '~/components/ui/button'
+
 export const HeaderSearch = () => {
  return (
-    <form className="flex-1 px-[35px]">
+    <form className="flex flex-1 justify-between gap-[15px] px-[35px]">
      <input
        placeholder="Cari..."
-        className="placeholder:text-white focus:ring-0 focus:outline-none"
+        className="flex-1 placeholder:text-white focus:ring-0 focus:outline-none"
      />
+      <Button
+        type="submit"
+        variant="icon"
+        size="icon"
+        className="[&_svg]:size-[30px]"
+      >
+        <SearchIcon />
+      </Button>
    </form>
  )
 }
@@ -1,6 +1,6 @@
 import { Link } from 'react-router'

-import { Button } from '~/components/button'
+import { Button } from '~/components/ui/button'
 import { DUMMY } from '~/data/dummy'

 export const HeaderTop = () => {