fix(analyzer): wrap long URLs in Settings list on narrow mobile viewports

Without min-width:0 on the flex-grow column and explicit word-break on
the <code>, a long URL with no spaces would refuse to wrap on real
Samsung S20 / Chrome Mobile, pushing the switch and edit/delete buttons
off-screen. DevTools mobile emulation hid the bug because its <code>
wrapping defaults differ slightly from the real device.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
MarekWo
2026-06-05 21:20:54 +02:00
parent 10792b8566
commit f0cb354ae0
+4 -4
View File
@@ -3066,9 +3066,9 @@ function renderAnalyzersList() {
<span class="text-muted" title="Built-in default — not configurable">
<i class="bi bi-star"></i>
</span>
<div class="flex-grow-1">
<div class="flex-grow-1" style="min-width: 0;">
<div><strong>Letsmesh Analyzer</strong> <span class="badge bg-light text-muted">built-in</span></div>
<code class="small text-muted">${escapeHtml(window.analyzerCache.letsmesh_url_template)}</code>
<code class="small text-muted text-break" style="word-break: break-all;">${escapeHtml(window.analyzerCache.letsmesh_url_template)}</code>
</div>
</div>
`;
@@ -3094,9 +3094,9 @@ function renderAnalyzersList() {
title="${isDefault ? 'Clear default' : 'Mark as default'}">
<i class="bi ${starIcon}"></i>
</button>
<div class="flex-grow-1">
<div class="flex-grow-1" style="min-width: 0;">
<div class="${nameClass}"><strong>${safeName}</strong>${disabledBadge}</div>
<code class="small text-muted">${escapeHtml(a.url_template)}</code>
<code class="small text-muted text-break" style="word-break: break-all;">${escapeHtml(a.url_template)}</code>
</div>
<div class="form-check form-switch mb-0" title="Disabled">
<input class="form-check-input" type="checkbox"