diff options
| author | Toby Vincent <tobyv@tobyvin.dev> | 2024-09-21 18:09:50 -0500 |
|---|---|---|
| committer | Toby Vincent <tobyv@tobyvin.dev> | 2024-09-21 18:09:50 -0500 |
| commit | cbfca14b38806798847e3f2008038b25194a9b8b (patch) | |
| tree | 1afcb3e3f34aba38e6d84e64e863024b4f1ead2a /index.html | |
chore: initial commit
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 109 |
1 files changed, 109 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..0b0254b --- /dev/null +++ b/index.html @@ -0,0 +1,109 @@ +<!doctype html> +<html lang="en"> + <head> + <meta charset="UTF-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <title>status.tobyvin.dev</title> + <link rel="stylesheet" type="text/css" href="index.css" /> + <style> + html { + background: var(--bg); + color: var(--fg); + font-size: 12pt; + font-family: monospace; + display: flex; + flex-direction: column; + } + body { + height: calc(100vh - 1rem); + width: calc(100vw - 4rem); + max-width: 640px; + display: flex; + flex-direction: column; + margin: 0 2rem 1rem; + line-height: 1.4; + align-self: center; + } + main { + display: flex; + flex-direction: column; + } + hgroup { + display: flex; + flex-direction: column; + text-align: center; + } + hgroup > p { + align-self: center; + width: 100%; + max-width: 400px; + padding: 5px; + border: 2px solid #ddd; + } + dl { + width: 100%; + max-width: 500px; + align-self: center; + display: grid; + grid-template-columns: max-content auto; + border: 2px solid #ddd; + border-bottom: 0; + } + dt { + padding: 5px; + grid-column-start: 1; + border-bottom: 2px solid #ddd; + } + dd { + text-align: right; + grid-column-start: 2; + margin-left: 0; + padding: 5px; + border-bottom: 2px solid #ddd; + } + .ok { + color: #228b22; + } + .warning { + color: #ff8c00; + } + .error { + color: #dc143c; + } + + .status { + color: #fff; + } + .status.ok { + background: #228b22; + } + .status.warning { + background: #ff8c00; + } + .status.error { + background: #dc143c; + } + </style> + </head> + <body> + <main> + <header> + <hgroup> + <h1>{title} Status</h1> + </hgroup> + </header> + + <dl class="status {status}"> + <dt><b>Status</b></dt> + <dd>{down} issue(s) detected</dd> + </dl> + + <dl> + {{services}} + <dt title="{title}">{name}</dt> + <dd class="{level}">{state}</dd> + {{end}} + </dl> + </main> + </body> +</html> |