Basic maintenance page styling

This commit is contained in:
Igor Scheller 2023-02-09 00:29:15 +01:00 committed by Michael Weimann
parent cf18f058b5
commit 09e6e9d239
1 changed files with 61 additions and 43 deletions

View File

@ -1,55 +1,73 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="utf-8"/> <meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/> <meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Maintenance - %APP_NAME%</title> <title>%APP_NAME% - Maintenance</title>
<link rel="stylesheet" type="text/css" href="%ASSETS_PATH%/assets/theme0.css"/>
<script src="%ASSETS_PATH%/assets/vendor.js"></script>
</head> </head>
<style>
body {
font-family: sans-serif;
color: #222;
background-color: #eee;
}
ul {
list-style: none;
padding-left: .7em;
}
ul li::before {
content: "\2026\20";
}
.container {
margin: 1em;
}
@media screen and (min-width: 1024px) {
.container {
display: grid;
grid-template-columns: 1fr 1fr;
}
}
</style>
<body> <body>
<div class="navbar navbar-light bg-light fixed-top">
<div class="container-fluid"> <div class="container">
<a class="navbar-brand" href="#">
<span class="icon-icon_angel"></span> <strong class="visible-lg-inline">%APP_NAME%</strong> <div>
</a> <h1>
</div> The <strong>%APP_NAME%</strong> is in maintenance mode
</div>
<div class="container-fluid">
<div class="container text-center">
<h1 class="mb-4">
<span class="bi bi-scissors"></span>
<span class="bi bi-wrench"></span>
<span class="bi bi-cloud-lightning-rain"></span>
</h1> </h1>
<div class="row">
<div class="col-xl-6"> <p>This may be due to</p>
<h2>
The <span class="icon-icon_angel"></span> <strong>%APP_NAME%</strong> is in maintenance mode. <ul>
</h2> <li>Archangels closing the gates of heaven.</li>
<p>This may be due to...</p> <li>Someone tried to do a simple maintenance task which did not go as planned.</li>
<p> <li>DHCP decided to give me another ip address.</li>
...archangels closing the gates of heaven. <br> <li>Somebody's stolen the power chord and now the battery is empty.</li>
...somebody's stolen the power chord and now the battery is empty. <br> <li>It might be a good time to take a nap.</li>
...DHCP decided to give me another ip address. </ul>
</p>
</div>
<div class="col-xl-6">
<iframe width="560" height="315"
src="https://www.youtube.com/embed/0aV_vHcunSQ?rel=0"
frameborder="0" allowfullscreen>
</iframe>
</div>
</div>
</div> </div>
<div class="row">
<div class="col-md-12">
<div class="text-center footer my-5"> <div>
<a href="https://github.com/engelsystem/engelsystem/issues">Bugs / Features</a> <iframe width="480" height="320"
· <a href="https://github.com/engelsystem/engelsystem/">Development Platform</a> src="https://www.youtube-nocookie.com/embed/0aV_vHcunSQ"
</div> allow="autoplay; encrypted-media" allowfullscreen>
</div> </iframe>
</div>
<div>
<a href="https://github.com/engelsystem/engelsystem/issues">Bugs / Features</a>
· <a href="https://github.com/engelsystem/engelsystem/">Development Platform</a>
</div> </div>
</div> </div>
</body> </body>
</html> </html>