Store Locator

Contact 23Pro

A retail store locator with zip code search, scrollable store cards showing address, hours, and actions, and a sticky map that updates on selection.

Shadcn UI Contact Block

Contact23 is a store locator for retail or service businesses. The header has a headline, description, and a search bar with zip code input and button. Below, a two-column layout shows store cards on the left and a large map on the right. Each card displays store name, distance indicator, address with icon, phone with icon, hours with icon, and two action buttons (Get Directions, Call Store).

Cards are bordered containers that highlight on hover and when selected, with a chevron that animates to the right. The map is a Google Maps iframe that updates based on the selected store. The map column is sticky on desktop so it stays visible while scrolling through the store list.

Functional and scannable with clear visual hierarchy. Icons provide quick recognition of information types. The distance indicator helps users identify nearest locations. The sticky map creates a split-app feel common in store locators. Works for retail chains, restaurants, banks, gyms, or any business with multiple physical locations.

Dependencies

PackageType
lucide-reactNPM
reactNPM
button
@shadcn
Registry
input
@shadcn
Registry