fix: change from flex to inline to fix safari bugs (#4559)

change from flex to inline to fix safari bugs
Co-authored-by: Charlie <charlie@uniswap.org>

src/components/NavBar/SearchBar.css.ts

@@ -27,6 +27,7 @@ export const searchBarContainer = style([
     right: '0',
     top: '0',
     zIndex: '3',
+    display: 'inline-block',
   }),
   {
     '@media': {

src/components/NavBar/SearchBar.tsx

@@ -332,7 +332,6 @@ export const SearchBar = () => {
   const placeholderText = phase1Flag === NftVariant.Enabled ? t`Search tokens and NFT collections` : t`Search tokens`
 
   return (
-    <>
     <Box position="relative">
       <Box
         position={isOpen ? { sm: 'fixed', md: 'absolute' } : 'static'}
@@ -388,8 +387,7 @@ export const SearchBar = () => {
             />
           ))}
       </Box>
-      </Box>
       {isOpen && <Overlay />}
-    </>
+    </Box>
   )
 }