You've already forked caddy-opnsense-blocker
Refine requests log mobile layout
This commit is contained in:
@@ -923,7 +923,7 @@ const queryLogHTML = `<!doctype html>
|
|||||||
.controls-panel[open] summary { border-bottom: 1px solid #334155; }
|
.controls-panel[open] summary { border-bottom: 1px solid #334155; }
|
||||||
.controls-body { padding: 1rem; display: grid; gap: 1rem; }
|
.controls-body { padding: 1rem; display: grid; gap: 1rem; }
|
||||||
.controls-help { font-size: .92rem; }
|
.controls-help { font-size: .92rem; }
|
||||||
.filters-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .85rem; align-items: end; }
|
.filters-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .85rem; align-items: end; }
|
||||||
.field { display: grid; gap: .35rem; }
|
.field { display: grid; gap: .35rem; }
|
||||||
.field label { font-size: .85rem; color: #cbd5e1; }
|
.field label { font-size: .85rem; color: #cbd5e1; }
|
||||||
.field input, .field select { width: 100%; box-sizing: border-box; padding: .55rem .65rem; border-radius: .55rem; border: 1px solid #334155; background: #0f172a; color: #e2e8f0; }
|
.field input, .field select { width: 100%; box-sizing: border-box; padding: .55rem .65rem; border-radius: .55rem; border: 1px solid #334155; background: #0f172a; color: #e2e8f0; }
|
||||||
@@ -943,7 +943,7 @@ const queryLogHTML = `<!doctype html>
|
|||||||
.sort-indicator { color: #64748b; font-size: .82rem; margin-left: .2rem; }
|
.sort-indicator { color: #64748b; font-size: .82rem; margin-left: .2rem; }
|
||||||
.col-time, .col-ip, .col-method, .col-source, .col-status, .col-state, .col-reason, .col-actions { white-space: nowrap; }
|
.col-time, .col-ip, .col-method, .col-source, .col-status, .col-state, .col-reason, .col-actions { white-space: nowrap; }
|
||||||
.col-time { width: 11rem; }
|
.col-time { width: 11rem; }
|
||||||
.col-ip { width: 12rem; }
|
.col-ip { width: 13rem; }
|
||||||
.col-method { width: 5.5rem; }
|
.col-method { width: 5.5rem; }
|
||||||
.col-source { width: 7rem; }
|
.col-source { width: 7rem; }
|
||||||
.col-status { width: 4.75rem; }
|
.col-status { width: 4.75rem; }
|
||||||
@@ -972,7 +972,8 @@ const queryLogHTML = `<!doctype html>
|
|||||||
.actions { display: block; }
|
.actions { display: block; }
|
||||||
.actions button { display: block; width: 100%; min-width: 0; }
|
.actions button { display: block; width: 100%; min-width: 0; }
|
||||||
.actions .muted { display: block; text-align: center; }
|
.actions .muted { display: block; text-align: center; }
|
||||||
.ip-cell { display: flex; align-items: center; gap: .45rem; min-width: 0; }
|
.ip-cell { display: flex; align-items: center; gap: .45rem; min-width: 0; max-width: 100%; }
|
||||||
|
.ip-link { display: block; flex: 1 1 auto; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||||
.bot-chip { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; border-radius: 999px; border: 1px solid #334155; background: #0f172a; color: #e2e8f0; font-size: .72rem; font-weight: 700; cursor: help; flex: 0 0 auto; }
|
.bot-chip { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; border-radius: 999px; border: 1px solid #334155; background: #0f172a; color: #e2e8f0; font-size: .72rem; font-weight: 700; cursor: help; flex: 0 0 auto; }
|
||||||
.bot-chip.verified { border-color: #2563eb; }
|
.bot-chip.verified { border-color: #2563eb; }
|
||||||
.bot-chip.hint { border-style: dashed; }
|
.bot-chip.hint { border-style: dashed; }
|
||||||
@@ -1471,7 +1472,7 @@ const queryLogHTML = `<!doctype html>
|
|||||||
return [
|
return [
|
||||||
'<tr>',
|
'<tr>',
|
||||||
' <td class="col-time">' + escapeHtml(formatDate(item.occurred_at)) + '</td>',
|
' <td class="col-time">' + escapeHtml(formatDate(item.occurred_at)) + '</td>',
|
||||||
' <td class="col-ip mono"><div class="ip-cell">' + renderBotChip(item.bot) + '<a href="/ips/' + encodeURIComponent(item.client_ip) + '">' + escapeHtml(item.client_ip || '—') + '</a></div></td>',
|
' <td class="col-ip mono"><div class="ip-cell">' + renderBotChip(item.bot) + '<a class="ip-link" href="/ips/' + encodeURIComponent(item.client_ip) + '" title="' + escapeHtml(item.client_ip || '—') + '">' + escapeHtml(item.client_ip || '—') + '</a></div></td>',
|
||||||
' <td class="col-method"><span class="method ' + escapeHtml(methodClass(item.method)) + '">' + escapeHtml(item.method || 'OTHER') + '</span></td>',
|
' <td class="col-method"><span class="method ' + escapeHtml(methodClass(item.method)) + '">' + escapeHtml(item.method || 'OTHER') + '</span></td>',
|
||||||
' <td class="col-source">' + escapeHtml(item.source_name || '—') + '</td>',
|
' <td class="col-source">' + escapeHtml(item.source_name || '—') + '</td>',
|
||||||
' <td class="col-request mono"><span class="request-text" title="' + escapeHtml(requestLabel) + '">' + escapeHtml(requestLabel) + '</span></td>',
|
' <td class="col-request mono"><span class="request-text" title="' + escapeHtml(requestLabel) + '">' + escapeHtml(requestLabel) + '</span></td>',
|
||||||
|
|||||||
Reference in New Issue
Block a user