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

Map pins: use a single generic 🛹 glyph instead of per-category emojis

Browse source 
Replaced the per-category emoji map (street/park/DIY/plaza/transition) with one
generic skateboard glyph on every spot pin, per request. The pin's crisp shape,
tight halo and shelter roof-cap (covered/indoor) are unchanged. Dropped the now-
unused `category` option from createSkateSpotIcon and its call sites.

Build clean; the earlier "CATEGORY_GLYPH is not defined" console errors were
from a stale intermediate bundle and do not occur in the current build.

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
This commit is contained in:
shakespeare.diy 2026-09-10 18:50:34 +07:00
parent 345af97788
commit a40c86e655
1 changed files with 7 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/components/SpotMap.tsx
View file

@ -64,19 +64,14 @@ const defaultIcon = L.icon({
L.Marker.prototype.options.icon = defaultIcon;
/** Emoji glyph per spot category — turns the map into a readable language. */
const CATEGORY_GLYPH: Record<string, string> = {
street: '🛹',
park: '🏞️',
diy: '🔧',
plaza: '🏛️',
transition: '🌊',
};
/** A single generic glyph for every skate-spot pin (kept intentionally simple). */
const SPOT_GLYPH = '🛹';
/**
* Crisp skate-spot marker: a solid neon teardrop with a TIGHT glow halo (the
* glow is an accent, not the whole blob), a category emoji inside so the pin is
* readable at a glance, and — for covered/indoor spots — a small roof "cap" so
* dry spots literally stand out on a rainy day.
* glow is an accent, not the whole blob), a generic skate glyph inside, and —
* for covered/indoor spots — a small roof "cap" so dry spots literally stand
* out on a rainy day.
*
* `weatherColor`/`weatherIcon` (when the weather layer is on) still override the
* fill + add the condition badge, exactly as before.
@ -84,16 +79,15 @@ const CATEGORY_GLYPH: Record<string, string> = {
const createSkateSpotIcon = (opts?: {
weatherColor?: string;
weatherIcon?: string;
category?: string;
shelter?: 'outdoor' | 'partial' | 'covered' | 'indoor';
}) => {
const { weatherColor, weatherIcon, category, shelter } = opts ?? {};
const { weatherColor, weatherIcon, shelter } = opts ?? {};
const fill = weatherColor
? `background: ${weatherColor};`
: 'background: linear-gradient(135deg, #ff0040, #ff6600);';
const glowColor = weatherColor || '#ff0040';
const glyph = (category && CATEGORY_GLYPH[category]) || '🛹';
const glyph = SPOT_GLYPH;
const isSheltered = shelter === 'covered' || shelter === 'indoor';
// Roof cap for covered/indoor spots — a small cyan "dry" marker that sits
@ -1098,7 +1092,6 @@ export function SpotMap({
icon = createSkateSpotIcon({
weatherColor: spotWeather?.skateability.color,
weatherIcon: spotWeather?.weather.weatherIcon,
category: primarySpot?.category,
shelter: primarySpot?.shelter,
});
} else if (!hasSpots && hasGear) {
@ -1110,7 +1103,6 @@ export function SpotMap({
icon = createSkateSpotIcon({
weatherColor: spotWeather?.skateability.color,
weatherIcon: spotWeather?.weather.weatherIcon,
category: primarySpot?.category,
shelter: primarySpot?.shelter,
});
}