fix(navbar): fix navbar width issue on larger screens

Updated the width value and added left and right to be 0 for the fixed navbar position to ensure
that it stays centered no matter the screen size

fix #10

Author: Nickslabcode

src/components/Navbar.tsx

@@ -3,7 +3,7 @@ import SearchForm from './SearchForm';
 
 const Navbar = () => {
   return (
-    <div className="fixed w-full flex items-center gap-4 py-4 justify-center backdrop-blur-md z-10">
+    <div className="fixed left-0 right-0 w-full flex items-center gap-4 py-4 justify-center backdrop-blur-md z-10">
       <Logo />
       <SearchForm />
     </div>

src/components/SearchForm.tsx

@@ -40,14 +40,14 @@ const SearchForm = () => {
   };
 
   return (
-    <form className="flex gap-2 w-1/2" onSubmit={handleSubmit}>
+    <form className="flex gap-2 w-[30rem]" onSubmit={handleSubmit}>
       <label
         className="flex items-center input input-sm input-bordered w-full"
         style={{ outline: 'none', boxShadow: 'none' }}
       >
         <input
           type="text"
-          className="grow placeholder:text-xs"
+          className="grow placeholder:text-xs "
           placeholder="Type a domain..."
           autoFocus
           value={searchQuery}