From 47e71011a975e5e45dfe6326841b14eea8587e49 Mon Sep 17 00:00:00 2001
From: ameer2468 <33054370+ameer2468@users.noreply.github.com>
Date: Tue, 10 Sep 2024 13:08:09 +0300
Subject: [PATCH] fix hidden nav

---
 apps/landing/src/components/cta-primary-button.tsx   |  6 ++++--
 apps/landing/src/components/global-nav-bar/index.tsx | 10 +++++++---
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/apps/landing/src/components/cta-primary-button.tsx b/apps/landing/src/components/cta-primary-button.tsx
index fc35a3bf1..3d2982a08 100644
--- a/apps/landing/src/components/cta-primary-button.tsx
+++ b/apps/landing/src/components/cta-primary-button.tsx
@@ -1,7 +1,7 @@
 import { ArrowCircleDown, Icon } from '@phosphor-icons/react';
 import clsx from 'clsx';
 import Link from 'next/link';
-import { ReactNode, useId } from 'react';
+import { ComponentProps, ReactNode, useId } from 'react';
 import { Platform } from '~/utils/current-platform';
 
 type CtaButtonProps = {
@@ -16,7 +16,8 @@ type CtaButtonProps = {
 	| {
 			platform: Platform | null;
 	  }
-);
+) &
+	ComponentProps<'button'>;
 
 export function CtaPrimaryButton({
 	iconComponent: Icon = ArrowCircleDown,
@@ -53,6 +54,7 @@ export function CtaPrimaryButton({
 		<Link
 			href={href}
 			className={clsx(
+				props.className,
 				'noise with-rounded-2px-border-images inline-flex flex-row items-center justify-center gap-x-2 overflow-hidden rounded-xl py-2 pe-4 ps-3 transition-all hover:brightness-110',
 				'bg-gradient-to-b from-[#42B2FD] to-[#0078F0] [--border-image:linear-gradient(to_bottom,hsl(200_100%_77%/100%),hsl(200_0%_100%/5%)75%)]',
 				{
diff --git a/apps/landing/src/components/global-nav-bar/index.tsx b/apps/landing/src/components/global-nav-bar/index.tsx
index 3806a39ef..97f5691cd 100644
--- a/apps/landing/src/components/global-nav-bar/index.tsx
+++ b/apps/landing/src/components/global-nav-bar/index.tsx
@@ -129,7 +129,7 @@ export function NavBar() {
 							animate={{ x: 0 }}
 							exit={{ x: '-100%' }}
 							transition={{ type: 'spring', stiffness: 300, damping: 30 }}
-							className="fixed left-0 top-0 z-[120] h-full w-64 bg-[#141419] p-4 shadow-lg"
+							className="fixed left-0 top-0 z-[120] h-full w-72 overflow-auto bg-[#141419] p-4 shadow-lg"
 						>
 							{/* Close Button */}
 							<div className="flex justify-end">
@@ -143,7 +143,7 @@ export function NavBar() {
 							</div>
 
 							{/* Nav Links */}
-							<div className="flex flex-col items-start p-4 space-y-4">
+							<div className="flex flex-col items-start p-4 space-y-2">
 								{NAVIGATION_ITEMS.map(({ label, href, adornment }) => (
 									<NavLink key={`nav-sub-${label}-${href}`} href={href}>
 										{label}{' '}
@@ -154,7 +154,11 @@ export function NavBar() {
 										)}
 									</NavLink>
 								))}
-								<CtaPrimaryButton glow={'sm'} platform={currentPlatform} />
+								<CtaPrimaryButton
+									className="relative top-2"
+									glow={'sm'}
+									platform={currentPlatform}
+								/>
 							</div>
 						</motion.div>
 					</>