feat: add hidden class to screen dim in lg screens

moonbamijam · Feb 12, 2024 · 6ec7ed6 · 6ec7ed6
1 parent e291543
commit 6ec7ed6
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/components/header/Header.tsx b/components/header/Header.tsx
@@ -166,7 +166,7 @@ const Header = () => {
       </header>
       {isMenuActive && (
         <>
-          <nav ref={ dropdown } id="main" className={`fixed top-[60px] w-full z-[100] flex lg:hidden flex-col px-[30px] md:px-[50px] xl:px-[100px] 2xl:px-[200px] pt-[20px] pb-[40px] gap-2 ${ scrollHeaderBg } backdrop-blur-sm`}>
+          <nav ref={ dropdown } id="main" className={`fixed top-[60px] w-full z-[100] flex lg:hidden flex-col px-[30px] md:px-[50px] xl:px-[100px] 2xl:px-[200px] pt-[20px] pb-[40px] gap-2 ${ scrollHeaderBg }`}>
             <Button href={"/"} state={ isHomeDropdownActive } onClick={ toggleHomeDropdown } icon={ isHomeDropdownActive? <FaCaretDown /> : <FaCaretRight /> } name={"home"} />
             {isHomeDropdownActive && (
               <>
@@ -201,7 +201,7 @@ const Header = () => {
                 <SubButton onClick={ () => handleScrollIntoView('#favorites') } name={"current"} />
               </>)}
           </nav>
-          <div className="screen-dim w-screen h-screen fixed z-[99] bg-black opacity-80 dark:opacity-70"></div>
+          <div className="screen-dim w-screen h-screen fixed z-[99] bg-black opacity-80 dark:opacity-70 lg:hidden"></div>
         </>
       )}
     </>