440b732c71
* feat(ui): New status page UI * docs: Rename labels to extra-labels * Fix domain expiration test * feat(ui): Add ui.default-sort-by and ui.default-filter-by * Change ui.header default value to Gatus * Re-use EndpointCard in Details.vue as well to avoid duplicate code * Fix flaky metrics test * Add subtle green color to "Gatus" * Remove duplicate title (tooltip is sufficient, no need for title on top of that) * Fix collapsed group user preferences * Update status page screenshots
38 lines
2.0 KiB
HTML
38 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="{{ .Theme }}">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<script type="text/javascript">
|
|
window.config = {logo: "{{ .UI.Logo }}", header: "{{ .UI.Header }}", link: "{{ .UI.Link }}", buttons: [], maximumNumberOfResults: "{{ .UI.MaximumNumberOfResults }}", defaultSortBy: "{{ .UI.DefaultSortBy }}", defaultFilterBy: "{{ .UI.DefaultFilterBy }}"};{{- range .UI.Buttons}}window.config.buttons.push({name:"{{ .Name }}",link:"{{ .Link }}"});{{end}}
|
|
// Initialize theme immediately to prevent flash
|
|
(function() {
|
|
const themeFromCookie = document.cookie.match(/theme=(dark|light);?/)?.[1];
|
|
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
if (themeFromCookie === 'dark' || (!themeFromCookie && prefersDark)) {
|
|
document.documentElement.classList.add('dark');
|
|
} else {
|
|
document.documentElement.classList.remove('dark');
|
|
}
|
|
})();
|
|
</script>
|
|
<title>{{ .UI.Title }}</title>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
|
|
<link rel="manifest" href="/manifest.json" crossorigin="use-credentials" />
|
|
<link rel="shortcut icon" href="/favicon.ico" />
|
|
<link rel="stylesheet" href="/css/custom.css" />
|
|
<meta name="description" content="{{ .UI.Description }}" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
|
<meta name="apple-mobile-web-app-title" content="{{ .UI.Title }}" />
|
|
<meta name="application-name" content="{{ .UI.Title }}" />
|
|
<meta name="theme-color" content="#f7f9fb" />
|
|
</head>
|
|
<body>
|
|
<noscript><strong>Enable JavaScript to view this page.</strong></noscript>
|
|
<div id="app"></div>
|
|
</body>
|
|
</html>
|