diff --git a/static/status.css b/static/status.css new file mode 100644 index 0000000..1be1de1 --- /dev/null +++ b/static/status.css @@ -0,0 +1,76 @@ +:root { + --us-ok: #34d058; + --us-warning: #fff432; + --us-critical: #FF3D33; + --us-gray: #d8d8d8; + + font-family: Roboto, Arial, sans-serif; + font-weight: 300; +} + +.container { + width: calc(100% - 1em); + max-width: 750px; + margin-left: auto; + margin-right: auto; + padding-left: 0.5em; + padding-right: 0.5em; +} + +.service { + display: flex; + width: 100%; + margin-top: 1em; + margin-bottom: 1em; +} + +.service-name { + width: 30%; +} + +.service-status { + width: 70%; +} + +.status-bar { + display: flex; + height: 2em; + width: 100%; +} + +.status-bar .status-cell { + background-color: var(--us-gray); + height: 100%; + width: 100%; + margin-left: 1px; + margin-right: 1px; + border-radius: 2px; +} + +.status-bar .status-cell.ok { + background-color: var(--us-ok); +} + +.status-bar .status-cell.warning { + background-color: var(--us-warning); +} + +.status-bar .status-cell.critical { + background-color: var(--us-critical); +} + +header { + margin-top: 5em; + margin-bottom: 5em; +} + +header h1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.2; +} + +footer { + margin-top: 3em; + margin-bottom: 3em; +} diff --git a/templates/status.html b/templates/status.html new file mode 100644 index 0000000..b56c592 --- /dev/null +++ b/templates/status.html @@ -0,0 +1,32 @@ + + +
+ +