Skip to content

Instantly share code, notes, and snippets.

@matiaskorhonen

matiaskorhonen/maintenance.html

Created January 16, 2019 14:04
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save matiaskorhonen/afbe4d7b5e04fae0282dae352c66068d to your computer and use it in GitHub Desktop.
Save matiaskorhonen/afbe4d7b5e04fae0282dae352c66068d to your computer and use it in GitHub Desktop.
Download ZIP
Basic maintenance page (based on Heroku's)
Raw
maintenance.html
<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport"> <title>Offline for maintenance</title> <style>html, body {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
background-color: #F7F8FB;
height: 100%;
-webkit-font-smoothing: antialiased; }
body {
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center; }
.message {
text-align: center;
align-self: center;
display: flex;
flex-direction: column;
align-items: center;
padding: 0px 20px;
max-width: 450px; }
.message__title {
font-size: 22px;
font-weight: 100;
margin-top: 15px;
color: #47494E;
margin-bottom: 8px; }
p {
-webkit-margin-after: 0px;
-webkit-margin-before: 0px;
font-size: 15px;
color: #7F828B;
line-height: 21px;
margin-bottom: 4px; }
.hk-logo, .app-icon {
fill: #DBE1EC; }
.info {
fill: #9FABBC; }
body.friendly {
background: -webkit-linear-gradient(-45deg, #8363a1 0%, #74a8c3 100%);
background: linear-gradient(135deg, #8363a1 0%, #74a8c3 100%); }
body.friendly .message__title {
color: #fff; }
body.friendly p {
color: rgba(255, 255, 255, 0.6); }
body.friendly .info {
fill: rgba(255, 255, 255, 0.9); }
.info_area {
position: fixed;
right: 12px;
bottom: 12px; }
</style> <!--<base target="_parent">--><base href="." target="_parent"> </head> <body> <div class="message"> <div class="message__title"> Offline for maintenance </div> <p> This app is undergoing maintenance right now. </p> <p> Please check back later. </p> </div> </body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment