feat(weather): always-visible close button on weather detail panel
This commit is contained in:
parent
b37692592b
commit
abb93c9511
1 changed files with 10 additions and 3 deletions
|
|
@ -637,9 +637,7 @@ function buildDetailHTML(point: WeatherPoint): string {
|
|||
]
|
||||
|
||||
const mobile = isMobile()
|
||||
const closeBtn = mobile
|
||||
? `<button onclick="document.getElementById('weather-detail-panel').style.display='none'" style="position:absolute;top:8px;right:10px;background:rgba(255,255,255,0.15);border:none;color:#fff;font-size:18px;line-height:1;width:28px;height:28px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;">×</button>`
|
||||
: ""
|
||||
const closeBtn = `<button class="detail-close-btn" title="Close" style="position:absolute;top:8px;right:10px;background:rgba(255,255,255,0.15);border:none;color:#fff;font-size:18px;line-height:1;width:24px;height:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:1;">×</button>`
|
||||
const handle = mobile
|
||||
? `<div style="display:flex;justify-content:center;padding:6px 0 2px;"><div style="width:32px;height:4px;border-radius:2px;background:rgba(255,255,255,0.3);"></div></div>`
|
||||
: ""
|
||||
|
|
@ -737,6 +735,15 @@ export const WeatherMap: WeatherMapHook = {
|
|||
if (this.detailPanel) {
|
||||
L.DomEvent.disableClickPropagation(this.detailPanel)
|
||||
L.DomEvent.disableScrollPropagation(this.detailPanel)
|
||||
|
||||
this.detailPanel.addEventListener("click", (e: MouseEvent) => {
|
||||
if ((e.target as HTMLElement).closest(".detail-close-btn") && this.detailPanel) {
|
||||
this.detailPanel.style.display = "none"
|
||||
this.detailPanel.innerHTML = ""
|
||||
this.clickMarker?.clearLayers()
|
||||
if (this.escHint) this.escHint.style.opacity = "0"
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// ESC hint
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue