52 lines
2.8 KiB
HTML
52 lines
2.8 KiB
HTML
{{define "base"}}<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>nginx-logtail</title>
|
|
{{- if gt .RefreshSecs 0}}
|
|
<meta http-equiv="refresh" content="{{.RefreshSecs}}">
|
|
{{- end}}
|
|
<style>
|
|
* { box-sizing: border-box; }
|
|
body { font-family: monospace; font-size: 14px; max-width: 1100px; margin: 2em auto; padding: 0 1.5em; color: #222; }
|
|
h1 { font-size: 1.1em; font-weight: bold; margin: 0 0 1em; letter-spacing: 0.05em; }
|
|
.tabs { display: flex; gap: 0.3em; margin-bottom: 0.7em; flex-wrap: wrap; }
|
|
.tabs a { text-decoration: none; padding: 0.2em 0.8em; border: 1px solid #aaa; color: #444; }
|
|
.tabs a:hover { background: #f0f0f0; }
|
|
.tabs a.active { background: #222; color: #fff; border-color: #222; }
|
|
.crumbs { margin-bottom: 0.8em; font-size: 0.9em; }
|
|
.crumbs .label { font-weight: bold; color: #666; margin-right: 0.3em; }
|
|
.crumbs span { display: inline-block; background: #eef; border: 1px solid #99b; padding: 0.1em 0.5em; margin-right: 0.3em; border-radius: 2px; }
|
|
.crumbs a { color: #c00; text-decoration: none; margin-left: 0.4em; font-weight: bold; }
|
|
.crumbs a:hover { color: #900; }
|
|
.sparkline { margin: 0.8em 0 1.2em; }
|
|
.sparkline small { color: #888; display: block; margin-bottom: 0.2em; }
|
|
table { border-collapse: collapse; width: 100%; }
|
|
th { text-align: left; border-bottom: 2px solid #222; padding: 0.3em 0.7em; font-size: 0.85em; color: #444; }
|
|
th.num { text-align: right; }
|
|
td { padding: 0.22em 0.7em; border-bottom: 1px solid #eee; vertical-align: middle; }
|
|
td.rank { color: #bbb; width: 3.5em; }
|
|
td.num { text-align: right; font-variant-numeric: tabular-nums; }
|
|
td.bar meter { width: 110px; height: 10px; vertical-align: middle; }
|
|
tr:hover td { background: #f7f7f7; }
|
|
a { color: #1a6aad; text-decoration: none; }
|
|
a:hover { text-decoration: underline; }
|
|
.error { color: #c00; border: 1px solid #fbb; background: #fff5f5; padding: 0.7em 1em; margin: 1em 0; border-radius: 3px; }
|
|
.nodata { color: #999; margin: 2em 0; font-style: italic; }
|
|
footer { margin-top: 2em; padding-top: 0.6em; border-top: 1px solid #e0e0e0; font-size: 0.8em; color: #999; }
|
|
.tabs-targets { margin-top: -0.4em; }
|
|
.tabs-label { font-size: 0.85em; color: #888; margin-right: 0.2em; align-self: center; }
|
|
.filter-form { display: flex; gap: 0.4em; align-items: center; margin-bottom: 0.7em; }
|
|
.filter-input { flex: 1; font-family: monospace; font-size: 13px; padding: 0.25em 0.5em; border: 1px solid #aaa; }
|
|
.filter-form button { padding: 0.25em 0.8em; border: 1px solid #aaa; background: #f4f4f4; cursor: pointer; font-family: monospace; }
|
|
.filter-form button:hover { background: #e8e8e8; }
|
|
.filter-form .clear { color: #c00; font-size: 0.9em; white-space: nowrap; }
|
|
.filter-err { color: #c00; font-size: 0.85em; margin: -0.3em 0 0.6em; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
{{template "content" .}}
|
|
</body>
|
|
</html>
|
|
{{end}}
|