Made ui much nicer

This commit is contained in:
Edward Shen 2019-05-01 18:02:49 -04:00
parent f0c38b4d79
commit 993019f352
Signed by: edward
GPG key ID: F350507060ED6C90

View file

@ -16,7 +16,8 @@
}
main {
padding: 1rem 0;
padding: 1rem;
width: 100%;
}
header {
@ -38,20 +39,28 @@
color: #fff;
text-decoration: none;
}
h1 { display: block; margin: 0; }
h3 { margin-top: 0; }
h1 { margin: 0; }
h3 { margin: 0; text-align: justify; }
.info {
display: flex;
align-items: baseline;
justify-content: space-between;
}
.spacer {
flex: 1 0 1rem;
}
.indicator {
width: 1rem;
min-height: 100%;
border-radius: 1rem 0 0 1rem;
margin-right: 1rem;
}
.ok { background-color: #4ed34e; }
.warn { background-color: #fcfc64; }
.error { background-color: #ff392e; }
.error-msg { font-family: 'Source Code Pro', monospace;}
.error-msg { margin-top: 1rem; font-family: 'Source Code Pro', monospace;}
</style>
</head>
<body>
@ -65,8 +74,11 @@
<section>
<aside class="indicator {% if status.status == 0 %}ok{% elif status.status == 1 %}warn{% else %}error{% endif %}"></aside>
<main>
<div class="info">
<h3>{{ status.endpoint }}</h3>
<div class="spacer"></div>
<a href="{{ status.location }}">{{ status.location }}</a>
</div>
{% if status.error %}<p class="error-msg">{{ status.error }}</p>{% endif %}
</main>
</section>