Search fixes

This commit is contained in:
Henrik Larsson
2023-08-11 11:54:50 +02:00
parent 70b869739f
commit 86f2475aad
17 changed files with 172 additions and 59 deletions

View File

@@ -25,7 +25,7 @@ export default async function Header({ locale }: HeaderProps) {
<HeaderRoot>
<div className="relative flex flex-col border-b border-ui-border bg-app">
<div className="relative flex h-14 w-full items-center justify-between px-4 py-2 lg:h-16 lg:px-8 lg:py-3 2xl:px-16">
<div className="-translate-x-3 transform md:hidden">
<div className="-translate-x-2 transform md:hidden">
<Suspense fallback={<OpenMobileMenu />}>
<MobileMenuModal items={mainMenu} />
</Suspense>
@@ -47,7 +47,7 @@ export default async function Header({ locale }: HeaderProps) {
{mainMenu.map((item: { title: string; slug: string }, i: number) => {
return (
<li key={i}>
<Link className="font-medium" href={`/category/${item.slug}`}>
<Link className="font-medium" href={`${locale}/category/${item.slug}`}>
{item.title}
</Link>
</li>

View File

@@ -3,10 +3,10 @@ import clsx from 'clsx';
export default function OpenMobileMenu({ className }: { className?: string }) {
return (
<div className="relative flex h-11 w-11 items-center justify-center text-high-contrast">
<div className="relative flex h-8 w-8 items-center justify-center text-high-contrast">
<Bars3Icon
className={clsx(
'h-5 stroke-current transition-all ease-in-out hover:scale-110 ',
'h-6 w-6 translate-y-px transform stroke-current transition-all ease-in-out hover:scale-110 ',
className
)}
/>

View File

@@ -3,7 +3,7 @@ import clsx from 'clsx';
export default function OpenSearch({ className }: { className?: string }) {
return (
<div className="relative flex h-10 w-10 items-center justify-center text-high-contrast">
<div className="relative flex h-8 w-8 items-center justify-center text-high-contrast lg:h-11 lg:w-11">
<MagnifyingGlassIcon
className={clsx('h-5 transition-all ease-in-out hover:scale-110 ', className)}
/>

View File

@@ -3,7 +3,7 @@ import clsx from 'clsx';
export default function OpenUserMenu({ className }: { className?: string }) {
return (
<div className="relative flex h-10 w-10 items-center justify-center text-high-contrast">
<div className="relative flex h-8 w-8 items-center justify-center text-high-contrast lg:h-11 lg:w-11">
<UserCircleIcon
className={clsx(
'h-5 stroke-current transition-all ease-in-out hover:scale-110 ',