Add desktop-only "Get on Zapstore" CTA to map Welcome Banner

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
This commit is contained in:
shakespeare.diy 2026-08-20 19:41:53 +07:00
parent 13934c0e74
commit 1c4987c8bf

View file

@ -78,6 +78,7 @@ import {
Calendar,
MessageCircle,
ChevronDown,
Smartphone,
} from 'lucide-react';
import { SpotChat } from '@/components/SpotChat';
import { useToast } from '@/hooks/useToast';
@ -1550,6 +1551,16 @@ export default function MapPage() {
<p className="text-sm font-black text-white uppercase tracking-wide leading-tight">New here?</p>
<p className="text-xs text-white/70 leading-tight">Discover skate spots, events &amp; the community.</p>
</div>
{/* Desktop-only: grab the mobile app via Zapstore */}
<a
href="https://zapstore.dev/apps/org.skatespots.app"
target="_blank"
rel="noopener noreferrer"
className="hidden md:inline-flex flex-shrink-0 items-center gap-1.5 px-3 py-1.5 rounded-full border-2 border-[#ccff00]/50 text-[#ccff00] text-xs font-black uppercase tracking-wide hover:bg-[#ccff00]/10 active:scale-95 transition-all"
>
<Smartphone className="h-3.5 w-3.5" />
Get on Zapstore
</a>
<Link
to="/onboarding"
className="flex-shrink-0 px-3 py-1.5 rounded-full bg-[#ccff00] text-black text-xs font-black uppercase tracking-wide hover:bg-[#ccff00]/90 active:scale-95 transition-transform"