skatespots/SkateSpots
1
0
Fork 0
Code Issues Pull requests Projects Releases 3 Packages Wiki Activity Actions 1

fix: add Add Spot (red) + Add Shop (green) back into right control strip

Browse source 
- Both + buttons are 36px circles matching the strip visual system
- Add Spot = red circle (bottom of layer toggles section)
- Add Shop = green circle (right below Add Spot)
- Removed redundant left-side FAB entirely — everything is now in one column on the right

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
This commit is contained in:
shakespeare.diy 2026-07-24 01:51:18 +07:00
parent 056846fc38
commit 254484a354
1 changed files with 22 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
src/pages/MapPage.tsx
View file

@ -1424,27 +1424,7 @@ export default function MapPage() {
</div>
)}
{/* Add Spot + Add Shop FABs — single pill button, bottom-left */}
{user && (
<div
className={cn(
"fixed left-3 z-[1001] md:hidden transition-all duration-200",
mobileFiltersOpen || selectedSpot || sasquatchPanelOpen
? "opacity-0 pointer-events-none translate-y-2"
: "opacity-100 translate-y-0"
)}
style={{ bottom: 'calc(3.5rem + env(safe-area-inset-bottom, 0px) + 0.75rem)' }}
>
{/* Single "+" FAB — opens a mini menu via state */}
<Link to="/create-spot" aria-label="Add a skate spot">
<button
className="h-12 w-12 rounded-full bg-gradient-to-br from-[#ff0040] to-[#ff6600] shadow-xl shadow-[#ff0040]/30 border border-white/20 flex items-center justify-center active:scale-90 transition-transform touch-manipulation"
>
<Plus className="h-5 w-5 text-white" strokeWidth={2.5} />
</button>
</Link>
</div>
)}
{/* Map attribution — bottom-left corner, minimal */}
<div className="absolute bottom-2 left-2 z-[999] pointer-events-none">
@ -1557,10 +1537,30 @@ export default function MapPage() {
</button>
))}
{/* Divider + Quick Snap */}
{/* Divider + Add actions + Quick Snap */}
{user && (
<>
<div className="w-4 h-px bg-white/10" />
{/* Add Spot */}
<Link to="/create-spot" aria-label="Add a skate spot">
<button
className="h-9 w-9 rounded-full bg-[#ff0040]/90 border border-[#ff0040]/50 flex items-center justify-center shadow-lg shadow-[#ff0040]/20 touch-manipulation active:scale-90 transition-all"
aria-label="Add spot"
>
<Plus className="h-4 w-4 text-white" strokeWidth={2.5} />
</button>
</Link>
{/* Add Shop */}
<Link to="/create-shop" aria-label="Add a skate shop">
<button
className="h-9 w-9 rounded-full bg-[#00cc66]/90 border border-[#00cc66]/50 flex items-center justify-center shadow-lg shadow-[#00cc66]/20 touch-manipulation active:scale-90 transition-all"
aria-label="Add shop"
>
<Plus className="h-4 w-4 text-black" strokeWidth={2.5} />
</button>
</Link>
<div className="w-4 h-px bg-white/10" />
{/* Quick Snap */}
<button
onClick={() => setShowQuickCamera(true)}
className="h-9 w-9 rounded-full bg-black/70 border border-white/15 flex items-center justify-center shadow-lg touch-manipulation active:scale-90 hover:border-[#ff0040]/50 hover:bg-[#ff0040]/10 transition-all"