Skip to content

Instantly share code, notes, and snippets.

@chimmykk
Created June 23, 2022 19:23
Show Gist options
  • Save chimmykk/8c1bb5308f76f5b5237834d1cdecfc32 to your computer and use it in GitHub Desktop.
Save chimmykk/8c1bb5308f76f5b5237834d1cdecfc32 to your computer and use it in GitHub Desktop.
jonathano.com Coming Soon screen
<div class="container">
<h1>Coming Soon.</h1>
</div>
<footer>
<a href="mailto:me@jonathano.com">me@jonathano.com</a> | &copy; 2016 Jonathan Ohayon
</footer>
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
display: table;
background-image: url(http://jonathano.com/img/background.jpeg);
background-size: cover;
background-position: center top;
}
div.container {
position: relative;
z-index: 9999;
text-align: center;
vertical-align: middle;
display: table-cell;
}
body:after {
content: "";
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
opacity: 0.83;
background: linear-gradient(#f1c40f 0%, #27ae60 100%);
}
div.container > * {
font-family: 'uni_sansheavy_caps', sans-serif;
color: #FFFFFF;
}
div.container > h1 {
font-size: 37px;
}
footer {
position: absolute;
bottom: 5px;
left: 0;
right: 0;
text-align: center;
z-index: 9999999;
}
footer > * {
font-family: 'uni_sansheavy_caps', sans-serif;
color: #FFFFFF;
text-decoration: none;
}
footer {
font-family: 'uni_sansheavy_caps', sans-serif;
color: #FFFFFF;
font-size: 17px;
}
footer > a:hover {
color: #bdc3c7;
}
<link href="http://jonathano.com/unisans/stylesheet.css" rel="stylesheet" />
<link href="https://meyerweb.com/eric/tools/css/reset/reset.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment