soconnor/lewisburg-coffee
1
0
Fork 0
mirror of https://github.com/soconnor0919/lewisburg-coffee.git synced 2026-02-04 23:56:32 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: Replace Navbar tooltip with native title attribute and introduce onToggleOpen prop for Drawer close functionality.

Browse Source
This commit is contained in:
Sean O'Connor
2025-12-05 02:36:57 -05:00
parent 2294f0a631
commit 132283e216
3 changed files with 17 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/page.tsx
View File

@@ -42,6 +42,7 @@ export default function HomePage() {
onSelect={setSelectedShop} onSelect={setSelectedShop}
onClose={() => setSelectedShop(null)} onClose={() => setSelectedShop(null)}
isOpen={isDiscoveryOpen} isOpen={isDiscoveryOpen}
onToggleOpen={() => setIsDiscoveryOpen(false)}
/> />
<WelcomeModal /> <WelcomeModal />
</main> </main>

5
src/components/Drawer.tsx
View File

@@ -25,9 +25,10 @@ interface DrawerProps {
onSelect: (shop: CoffeeShop) => void; onSelect: (shop: CoffeeShop) => void;
onClose: () => void; onClose: () => void;
isOpen: boolean; isOpen: boolean;
onToggleOpen?: () => void;
} }
export default function Drawer({ shop, shops, onSelect, onClose, isOpen }: DrawerProps) { export default function Drawer({ shop, shops, onSelect, onClose, isOpen, onToggleOpen }: DrawerProps) {
const [searchQuery, setSearchQuery] = useState(""); const [searchQuery, setSearchQuery] = useState("");
const [imageLoading, setImageLoading] = useState(true); const [imageLoading, setImageLoading] = useState(true);
@@ -149,7 +150,7 @@ export default function Drawer({ shop, shops, onSelect, onClose, isOpen }: Drawe
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={onClose} onClick={onToggleOpen}
className="absolute top-4 right-4 bg-background/20 hover:bg-background/40 text-foreground rounded-full h-8 w-8 backdrop-blur-md border border-border/50" className="absolute top-4 right-4 bg-background/20 hover:bg-background/40 text-foreground rounded-full h-8 w-8 backdrop-blur-md border border-border/50"
> >
<X className="w-4 h-4" /> <X className="w-4 h-4" />

34
src/components/Navbar.tsx
View File

@@ -72,27 +72,19 @@ export default function Navbar({ isDiscoveryOpen, onToggleDiscovery }: NavbarPro
</TooltipProvider> </TooltipProvider>
</div> </div>
<TooltipProvider> <div
<Tooltip> className="flex items-center gap-3 px-2 cursor-pointer group absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"
<TooltipTrigger asChild> onClick={handleHeaderClick}
<div title="About This Map"
className="flex items-center gap-3 px-2 cursor-pointer group absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" >
onClick={handleHeaderClick} <div className="p-2 rounded-lg group-hover:bg-primary/10 transition-colors">
> <Coffee className="h-6 w-6 text-primary" />
<div className="p-2 rounded-lg group-hover:bg-primary/10 transition-colors"> </div>
<Coffee className="h-6 w-6 text-primary" /> <div>
</div> <h1 className="text-lg font-bold font-serif text-foreground leading-none">Lewisburg&nbsp;Coffee&nbsp;Map</h1>
<div> <p className="text-xs text-muted-foreground font-serif mt-0.5">Find&nbsp;your&nbsp;perfect&nbsp;brew</p>
<h1 className="text-lg font-bold font-serif text-foreground leading-none">Lewisburg&nbsp;Coffee&nbsp;Map</h1> </div>
<p className="text-xs text-muted-foreground font-serif mt-0.5">Find&nbsp;your&nbsp;perfect&nbsp;brew</p> </div>
</div>
</div>
</TooltipTrigger>
<TooltipContent side="bottom" className="bg-background/80 backdrop-blur-xl border-border/50 text-foreground font-semibold shadow-2xl">
<p>About This Map</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<div className="w-10" /> {/* Spacer to balance the toggle button */} <div className="w-10" /> {/* Spacer to balance the toggle button */}
</div> </div>