fix mobile options

This commit is contained in:
overcuriousity 2024-07-18 21:21:52 +02:00
parent f02393dbe9
commit 9bfe56f7ce
1 changed files with 12 additions and 3 deletions

View File

@ -1,5 +1,4 @@
'use client';
import { cn } from '@/lib/utils';
import { BookOpenText, Home, Search, SquarePen, Settings } from 'lucide-react';
import Link from 'next/link';
@ -79,13 +78,13 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
</div>
</div>
<div className="fixed bottom-0 w-full z-50 flex flex-row items-center gap-x-6 bg-light-primary dark:bg-dark-primary px-4 py-4 shadow-sm lg:hidden">
<div className="fixed bottom-0 w-full z-50 flex flex-row items-center justify-between bg-light-primary dark:bg-dark-primary px-4 py-4 shadow-sm lg:hidden">
{navLinks.map((link, i) => (
<Link
href={link.href}
key={i}
className={cn(
'relative flex flex-col items-center space-y-1 text-center w-full',
'relative flex flex-col items-center space-y-1 text-center',
link.active
? 'text-black dark:text-white'
: 'text-black dark:text-white/70',
@ -98,6 +97,16 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
<p className="text-xs">{link.label}</p>
</Link>
))}
<button
onClick={() => setIsSettingsOpen(!isSettingsOpen)}
className={cn(
'relative flex flex-col items-center space-y-1 text-center',
'text-black dark:text-white/70',
)}
>
<Settings />
<p className="text-xs">Settings</p>
</button>
</div>
<Layout>{children}</Layout>