From e7ebfb14443ac981ddff305654d7932930fe0ad9 Mon Sep 17 00:00:00 2001
From: Max Korsunov <maxkors2014@gmail.com>
Date: Tue, 9 Jul 2024 16:07:00 +0200
Subject: [PATCH] fix: #1447: fix tablet menu (#1458)

* fix(minifront): #1447: fix tablet header menu

* chore: changesets
---
 .changeset/five-jobs-speak.md                            | 5 +++++
 apps/minifront/src/components/header/menu/menu.tsx       | 2 +-
 apps/minifront/src/components/header/menu/tablet-nav.tsx | 2 +-
 3 files changed, 7 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/five-jobs-speak.md

diff --git a/.changeset/five-jobs-speak.md b/.changeset/five-jobs-speak.md
new file mode 100644
index 0000000000..2caeaf3c10
--- /dev/null
+++ b/.changeset/five-jobs-speak.md
@@ -0,0 +1,5 @@
+---
+'minifront': patch
+---
+
+Fix tablet header menu styles
diff --git a/apps/minifront/src/components/header/menu/menu.tsx b/apps/minifront/src/components/header/menu/menu.tsx
index 3d4423e795..d86ce7e4c0 100644
--- a/apps/minifront/src/components/header/menu/menu.tsx
+++ b/apps/minifront/src/components/header/menu/menu.tsx
@@ -6,7 +6,7 @@ import { TabletNav } from './tablet-nav';
 
 export const MenuBar = () => {
   return (
-    <div className={cn('flex w-full items-center justify-between gap-8 list-none')}>
+    <div className={cn('flex w-full items-center justify-between sm:gap-8 list-none')}>
       <MobileNav />
       <DesktopNav />
       <TabletNav />
diff --git a/apps/minifront/src/components/header/menu/tablet-nav.tsx b/apps/minifront/src/components/header/menu/tablet-nav.tsx
index 8b3f501d11..04be1bbcad 100644
--- a/apps/minifront/src/components/header/menu/tablet-nav.tsx
+++ b/apps/minifront/src/components/header/menu/tablet-nav.tsx
@@ -12,7 +12,7 @@ export const TabletNav = () => {
   const navigate = useNavigate();
 
   return (
-    <NavigationMenu.Root delayDuration={0}>
+    <NavigationMenu.Root delayDuration={0} className='relative'>
       <NavigationMenu.Item className={cn('w-[138px]', ...itemStyle, 'hidden md:block xl:hidden')}>
         <NavigationMenu.Trigger className={cn('group', 'text-left', 'text-muted', ...triggerStyle)}>
           {metadata[pathname].title}