diff options
| author | Shulhan <ms@kilabit.info> | 2025-08-06 10:10:00 +0700 |
|---|---|---|
| committer | Shulhan <ms@kilabit.info> | 2025-08-06 23:59:32 +0700 |
| commit | 7bc81d176ca46837c2dfd541e0a06704eaefbebb (patch) | |
| tree | a04741f58e58abe621432be8876bbfebaf00cf61 /_www/index.tmpl | |
| parent | 6884d4def670bb7c27bc44cdb1d2992b514cc699 (diff) | |
| download | lilin-7bc81d176ca46837c2dfd541e0a06704eaefbebb.tar.xz | |
_www: add basic style for status page
Diffstat (limited to '_www/index.tmpl')
| -rw-r--r-- | _www/index.tmpl | 65 |
1 files changed, 52 insertions, 13 deletions
diff --git a/_www/index.tmpl b/_www/index.tmpl index cf710db..614b67c 100644 --- a/_www/index.tmpl +++ b/_www/index.tmpl @@ -5,35 +5,74 @@ <meta name="viewport" content="width=device-width" /> <title>{{.Title}}</title> </head> + <style> + .service-status { + display: flex; + flex-direction: column; + row-gap: 1em; + } + .service { + display: flex; + flex-direction: row; + column-gap: 1em; + } + .service.header { + font-weight: bold; + } + .service .at { + flex: 0 0 16em; + } + .service .name { + flex: 0 0 10em; + } + .service .status { + flex: 0 0 5em; + } + .service .error { + flex: 1 1; + } + </style> <body> <h2>{{.Title}}</h2> <h3>Service status</h3> <div class="service-status"> + <div class="service header"> + <span class="at">At</span> + <span class="name">Service</span> + <span class="status">Status</span> + <span class="error">Error</span> + </div> {{ range.Services }} - <div> - <div> - <span>{{.Name}}</span> + <div class="service"> + <span class="at"> {{if .Last.At}}{{.Last.At}}{{ end }}</span> + <span class="name"> {{.Name}} </span> + <span class="status"> {{if .Last.Success}} - <span class="success"> OK </span> + <span class="success"> UP </span> {{else}} - <span class="fail"> FAIL </span> + <span class="fail"> DOWN </span> {{ end }} - </div> - {{if not .Last.Success}} - <div>{{.Last.At}}: {{ .Last.Error }}</div> - {{ end }} + </span> + <span class="error">{{if .Last.Error}}{{ .Last.Error }}{{ end }}</span> </div> {{ end }} </div> - <h3>Fail history</h3> - <div class="fail-history"> + <h3>Down history</h3> + <div class="service-status"> + <div class="service header"> + <span class="at">At</span> + <span class="name">Service</span> + <span class="status">Status</span> + <span class="error">Error</span> + </div> {{ $list := reverse .Fail }} {{ range $list }} - <div class="fail-history-item"> - <span class="name">{{ .Name }}</span> + <div class="service"> <span class="at">{{ .At }}</span> + <span class="name">{{ .Name }}</span> + <span class="status"><span class="fail"> DOWN </span></span> <span class="error">{{ .Error }}</span> </div> {{ end }} |