signal-works/ice
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

Improve table readability and fix single-point map zoom

Browse source 
- Increase font sizes in location table for better readability
- Center-align "Persistent" text in time remaining column
- Fix static map zoom level when displaying single location
- Use zoom level 13 for single points to show neighborhood context

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Claude Code 2025-07-07 10:15:43 -04:00
parent 916deea68a
commit e0eeb1e944
2 changed files with 21 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/scss/pages/_index.scss
View file

@ -174,7 +174,7 @@
// Specific cell styles
td.location-cell {
color: var(--text-color);
font-size: $font-size-sm;
font-size: $font-size-md;
font-weight: 500;
max-width: 250px;
overflow: hidden;
@ -184,7 +184,7 @@
td.details-cell {
color: var(--text-color);
font-size: 14px;
font-size: $font-size-md;
font-weight: 400;
max-width: 200px;
overflow: hidden;
@ -195,14 +195,15 @@
td.time-cell {
color: var(--text-color);
font-size: 12px;
font-size: $font-size-sm;
font-weight: 400;
}
td.remaining-cell {
color: var(--text-color);
font-size: 12px;
font-size: $font-size-sm;
font-weight: 500;
text-align: center;
&.urgent {
@include status-indicator(var(--status-danger, $danger-color), white);

19
src/services/MapImageService.ts
View file

@ -63,8 +63,18 @@ export class MapImageService {
// Build Mapbox Static Maps URL with auto-fit
let mapboxUrl;
if (overlays) {
// Use auto-fit to center on all pins
mapboxUrl = `https://api.mapbox.com/styles/v1/mapbox/streets-v12/static/${overlays}/auto/${options.width}x${options.height}?access_token=${mapboxToken}`;
// Check if we have only one location
const validLocations = locations.filter(loc => loc.latitude && loc.longitude);
if (validLocations.length === 1) {
// For single location, use fixed zoom level to avoid zooming too close
const location = validLocations[0];
const zoomLevel = 13; // City-level zoom, shows neighborhood context
mapboxUrl = `https://api.mapbox.com/styles/v1/mapbox/streets-v12/static/${overlays}/${location.longitude},${location.latitude},${zoomLevel}/${options.width}x${options.height}?access_token=${mapboxToken}`;
} else {
// Multiple locations, use auto-fit to show all pins
mapboxUrl = `https://api.mapbox.com/styles/v1/mapbox/streets-v12/static/${overlays}/auto/${options.width}x${options.height}?access_token=${mapboxToken}`;
}
} else {
// No locations, use Grand Rapids as fallback
const fallbackLat = 42.960081464833195;
@ -72,7 +82,10 @@ export class MapImageService {
mapboxUrl = `https://api.mapbox.com/styles/v1/mapbox/streets-v12/static/${fallbackLng},${fallbackLat},10/${options.width}x${options.height}?access_token=${mapboxToken}`;
}
console.info('Fetching Mapbox static map with auto-fit...');
console.info('Fetching Mapbox static map...');
if (overlays && locations.filter(loc => loc.latitude && loc.longitude).length === 1) {
console.info('Using fixed zoom level for single location');
}
console.info('URL:', mapboxUrl.replace(mapboxToken, 'TOKEN_HIDDEN'));
return new Promise((resolve) => {