increase sidebar link sizes on mobile

This commit is contained in:
sk1982 2024-04-02 02:47:39 -04:00
parent 3bd7679812
commit f4c9804ded

View File

@ -330,17 +330,17 @@ export const HeaderSidebar = ({ children }: HeaderSidebarProps) => {
setMenuOpen(false); setMenuOpen(false);
cookies.remove('actaeon-navigated-from'); cookies.remove('actaeon-navigated-from');
}} }}
className={`text-2xl transition hover:text-secondary ${route === routeGroup ? 'font-bold' : 'font-semibold'}`}> className={`block py-1 sm:py-0 text-3xl sm:text-2xl transition hover:text-secondary ${route === routeGroup ? 'font-bold' : 'font-semibold'}`}>
{route.name} {route.name}
</Link>} </Link>}
<div className="ml-2 mt-2"> <div className="ml-2 mt-2">
{route.routes?.filter(filter)?.map(subroute => <div className="mb-1" key={subroute.url}> {route.routes?.filter(filter)?.map(subroute => <div className="mb-1" key={subroute.url}>
{subroute.routes?.length ? <div {subroute.routes?.length ? <div
className={`text-xl`}> className={`text-2xl sm:text-xl`}>
{subroute.name} <div className="py-1 sm:py-0">{subroute.name}</div>
<div className="flex flex-col ml-1.5 pl-3 border-l border-gray-500/25 mt-0.5"> <div className="flex flex-col ml-1.5 pl-3 border-l border-gray-500/25 mt-0.5">
{subroute.routes.filter(filter).map(route => (<Link href={route.url} key={route.url} onClick={() => setMenuOpen(false)} {subroute.routes.filter(filter).map(route => (<Link href={route.url} key={route.url} onClick={() => setMenuOpen(false)}
className={`text-[1.075rem] transition ${path?.startsWith(route.url) ? 'font-semibold text-primary' : 'hover:text-secondary'}`}> className={`py-2 sm:py-0 text-xl sm:text-[1.075rem] transition ${path?.startsWith(route.url) ? 'font-semibold text-primary' : 'hover:text-secondary'}`}>
{route.name} {route.name}
</Link>))} </Link>))}
</div> </div>
@ -348,7 +348,7 @@ export const HeaderSidebar = ({ children }: HeaderSidebarProps) => {
setMenuOpen(false); setMenuOpen(false);
cookies.remove('actaeon-navigated-from'); cookies.remove('actaeon-navigated-from');
}} }}
className={`text-xl transition ${path?.startsWith(subroute.url) ? 'font-semibold text-primary' : 'hover:text-secondary'}`}> className={`block py-1 sm:py-0 text-2xl sm:text-xl transition ${path?.startsWith(subroute.url) ? 'font-semibold text-primary' : 'hover:text-secondary'}`}>
{subroute.name} {subroute.name}
</Link>} </Link>}
</div>)} </div>)}
@ -366,7 +366,7 @@ export const HeaderSidebar = ({ children }: HeaderSidebarProps) => {
</Button> </Button>
</Link>} </Link>}
</div> </div>
<Button color="primary" className="w-full" onClick={() => user ? logout({ redirectTo: '/' }) : login()}> <Button color="primary" className="w-full flex-shrink-0" onClick={() => user ? logout({ redirectTo: '/' }) : login()}>
{user ? 'Logout' : 'Login'} {user ? 'Logout' : 'Login'}
</Button> </Button>
</div> </div>