Image shrinks, icons don't

<nav className="flex items-center py-4 px-12 relative shadow-md w-full">
      <div className="flex gap-20 items-center flex-1">
        <Link to={"/"}>
          <img src="QuickCart.svg" alt="logo" />
        </Link>
        <SearchBar />
      </div>

      <ul className="flex justify-between gap-[5rem] ml-20">
        <li className="lg:hidden">
          <FontAwesomeIcon
            icon={faMagnifyingGlass}
            size={"2xl"}
            className="mr-2 cursor-pointer"
          />
        </li>
        <li>
          <FontAwesomeIcon
            icon={faUser}
            size={"2xl"}
            className="mr-2 cursor-pointer"
            onClick={() => {
              dispatch(setIsUserOpen(!isUserOpen));
              dispatch(setIsCartOpen(false));
            }}
          />
          <span className="hidden lg:inline">My account</span>
        </li>
        <li>
          <FontAwesomeIcon
            icon={faShoppingCart}
            size={"2xl"}
            className="mr-2 cursor-pointer"
            onClick={() => {
              dispatch(setIsCartOpen(!isCartOpen));
              dispatch(setIsUserOpen(false));
            }}
          />
          {totalQuantity !== 0 && (
            <div className="absolute bg-rose-700 p-1 w-6 h-6 rounded-full text-center text-xs text-white translate-x-4 -translate-y-4 ">
              {totalQuantity}
            </div>
          )}
          <span className="hidden lg:inline">My cart</span>
        </li>
      </ul>
      {isCartOpen && <Cart />}
      {isUserOpen && <User />}
    </nav>