fix: normalize NavBar button heights (#4656)

* fix: normalize NavBar button heights

* chainswitcher and web3status are not using this component

* update nav icon

src/components/NavBar/ChainSwitcher.css.ts

@@ -7,8 +7,8 @@ export const ChainSwitcher = style([
   lightGrayOverlayOnHover,
   sprinkles({
     borderRadius: '8',
-    paddingY: '8',
     paddingX: '12',
+    height: '40',
     cursor: 'pointer',
     border: 'none',
     color: 'blackBlue',

src/components/NavBar/NavIcon.tsx

@@ -17,6 +17,7 @@ export const NavIcon = ({ children, isActive, onClick }: NavIconProps) => {
       background={isActive ? 'accentActiveSoft' : 'none'}
       color={isActive ? 'blackBlue' : 'darkGray'}
       onClick={onClick}
+      height="40"
     >
       {children}
     </Box>

src/components/NavBar/SearchBar.tsx

@@ -432,7 +432,7 @@ export const SearchBar = () => {
         </Box>
       </Box>
       <NavIcon onClick={toggleOpen}>
-        <NavMagnifyingGlassIcon width={28} height={28} />
+        <NavMagnifyingGlassIcon />
       </NavIcon>
     </Box>
   )

src/components/Web3Status/index.tsx

@@ -66,7 +66,8 @@ const Web3StatusConnectButton = styled.button<{ faded?: boolean }>`
   border-radius: 12px;
   border: none;
   cursor: pointer;
-  padding: 8px 12px;
+  padding: 0 12px;
+  height: 40px;
 
   :hover,
   :active,

src/nft/components/icons.tsx

@@ -960,22 +960,16 @@ export const MagnifyingGlassIcon = (props: SVGProps) => (
   </svg>
 )
 
-export const NavMagnifyingGlassIcon = (props: SVGProps) => (
-  <svg fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+export const NavMagnifyingGlassIcon = () => (
+  <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path
-      d="M12.8333 22.1667C17.988 22.1667 22.1667 17.988 22.1667 12.8333C22.1667 7.67868 17.988 3.5 12.8333 3.5C7.67868 3.5 3.5 7.67868 3.5 12.8333C3.5 17.988 7.67868 22.1667 12.8333 22.1667Z"
+      d="M10.5 18C14.6421 18 18 14.6421 18 10.5C18 6.35786 14.6421 3 10.5 3C6.35786 3 3 6.35786 3 10.5C3 14.6421 6.35786 18 10.5 18Z"
       stroke="currentColor"
-      strokeWidth="2.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M24.4969 24.4998L19.4219 19.4248"
-      stroke="currentColor"
-      strokeWidth="2.5"
+      strokeWidth="2"
       strokeLinecap="round"
       strokeLinejoin="round"
     />
+    <path d="M21 21L16 16" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
   </svg>
 )