projectmoon
/
perplexica
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
ui/components/Sidebar.tsx
View File

@ -1,5 +1,4 @@
'use client'; 'use client';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
import { BookOpenText, Home, Search, SquarePen, Settings } from 'lucide-react'; import { BookOpenText, Home, Search, SquarePen, Settings } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
@ -79,13 +78,13 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
</div> </div>
</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) => ( {navLinks.map((link, i) => (
<Link <Link
href={link.href} href={link.href}
key={i} key={i}
className={cn( 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 link.active
? 'text-black dark:text-white' ? 'text-black dark:text-white'
: 'text-black dark:text-white/70', : 'text-black dark:text-white/70',
@ -98,6 +97,16 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
<p className="text-xs">{link.label}</p> <p className="text-xs">{link.label}</p>
</Link> </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> </div>
<Layout>{children}</Layout> <Layout>{children}</Layout>