diff --git a/tasks/enduro-trails/PROJECT.md b/tasks/enduro-trails/PROJECT.md index 4495261..e280351 100644 --- a/tasks/enduro-trails/PROJECT.md +++ b/tasks/enduro-trails/PROJECT.md @@ -99,6 +99,7 @@ docker restart prototype-enduro-trails-1 | F-16 | Тёмная тема + редизайн | Две темы (авто/светлая/тёмная), SunCalc, мобильный UI, drag-and-drop точек, расстояние по маршруту | ✅ Готово | 5 | | F-17 | PWA + офлайн | Service Worker, MBTiles, GPS-трекинг | ⏳ Бэклог | 7 | | F-18 | Светлая карта | Создать `style-light.json` — светлый стиль карты для светлой темы. Сейчас при светлой теме карта остаётся тёмной (`style-light.json` отсутствует) | ⏳ Бэклог | 5.1 | +| F-19 | Иконка колеса + спиннер | Заменить иконку колеса в мини-баре на нормальную мотокросс (спицы, кноблинг). Спиннер в основном листе маршрута пока строится | ⏳ Бэклог | 5.1 | --- diff --git a/tasks/enduro-trails/prototype/static/app.css b/tasks/enduro-trails/prototype/static/app.css index bceca60..e0b5a34 100644 --- a/tasks/enduro-trails/prototype/static/app.css +++ b/tasks/enduro-trails/prototype/static/app.css @@ -460,7 +460,7 @@ body.has-map-mode #sheet-backdrop.visible { pointer-events: none; } /* ── Waypoint Markers ─────────────────────────── */ .route-waypoint-marker { filter: drop-shadow(0 2px 4px rgba(0,0,0,0.4)); width: 28px; height: 36px; cursor: grab; display: block; } .route-waypoint-marker:active { cursor: grabbing; } -.named-marker-el { font-size: 22px; cursor: pointer; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5)); user-select: none; line-height: 1; } +.named-marker-el { font-size: 22px; cursor: pointer; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5)); user-select: none; line-height: 1; display: block; width: 28px; height: 28px; text-align: center; } /* ═══════════════════════════════════════════════════ TASK 5: Desktop Layout (≥768px) @@ -513,7 +513,8 @@ body.has-map-mode #sheet-backdrop.visible { pointer-events: none; } from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } } -.marker-anim { animation: markerPopIn 0.2s cubic-bezier(0.18, 0.89, 0.32, 1.28) both; } +/* marker-anim НЕ применять к элементам-обёрткам MapLibre — только к внутренним элементам */ +.marker-anim-inner { animation: markerPopIn 0.2s cubic-bezier(0.18, 0.89, 0.32, 1.28) both; } /* ── Onboarding (empty waypoints state) ─────────── */ .wl-onboarding { diff --git a/tasks/enduro-trails/prototype/static/app.js b/tasks/enduro-trails/prototype/static/app.js index aabd64b..d369a18 100644 --- a/tasks/enduro-trails/prototype/static/app.js +++ b/tasks/enduro-trails/prototype/static/app.js @@ -1252,7 +1252,7 @@ function drawNamedMarker(markerData) { const map = window._map; if (!map) return; const el = document.createElement('div'); - el.className = 'named-marker-el marker-anim'; + el.className = 'named-marker-el'; el.textContent = markerData.icon; el.title = markerData.name; @@ -1451,7 +1451,7 @@ function initRouteClicks(map) { document.getElementById('scenic-status').textContent = `📍 Старт: ${lat.toFixed(4)}, ${lng.toFixed(4)}`; if (scenicStartMarker) scenicStartMarker.remove(); const el = document.createElement('div'); - el.className = 'marker-anim'; + el.className = ''; el.style.cssText = 'width:16px;height:16px;background:var(--accent);border:2px solid #fff;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,0.3);'; scenicStartMarker = new maplibregl.Marker({ element: el, anchor: 'center' }).setLngLat([lng, lat]).addTo(map); document.getElementById('btn-build-scenic').style.display = ''; @@ -1678,8 +1678,8 @@ function addRulerPoint(lngLat) { rulerTotal += haversineKm(rulerPoints[rulerPoints.length - 2], pt); } const dot = document.createElement('div'); - dot.className = 'marker-anim'; - dot.style.cssText = 'width:10px;height:10px;background:#0088ff;border:2px solid #fff;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.3);'; + dot.className = ''; + dot.style.cssText = 'width:10px;height:10px;background:#0088ff;border:2px solid #fff;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.3);display:block;'; const dotMarker = new maplibregl.Marker({ element: dot, anchor: 'center' }) .setLngLat([lngLat.lng, lngLat.lat]) .addTo(map); @@ -1842,7 +1842,7 @@ function addLinkPoint(lng, lat) { linkPoints.push({ lon: lng, lat: lat }); const idx = linkPoints.length; const el = document.createElement('div'); - el.className = 'marker-anim'; + el.className = ''; el.style.cssText = 'width:16px;height:16px;background:var(--accent);border:2px solid #fff;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,0.3);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff;'; el.textContent = idx; const marker = new maplibregl.Marker({ element: el, anchor: 'center', draggable: true }).setLngLat([lng, lat]).addTo(map);