Skip to content

Instantly share code, notes, and snippets.

@krisdb2009
Created June 3, 2019 16:44
Show Gist options
  • Save krisdb2009/d8436486cea04786871e2e104106edfc to your computer and use it in GitHub Desktop.
Save krisdb2009/d8436486cea04786871e2e104106edfc to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>below average - login</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
font-family:arial;
}
body {
text-align:center;
}
#body {
width:100%;
height:calc(100% - 50px);
position:fixed;
top:0px;
left:0px;
overflow:auto;
background-size:100% 100%;
transition:.3s;
background-color:white;
}
#footer {
height:50px;
border-top:1px solid lightgray;
position:fixed;
bottom:0px;
left:0px;
width:100%;
background-color:whitesmoke;
color:rgba(0,0,0,.8);
font-size:14px;
line-height:49px;
box-shadow:inset 0px 1px 0px white, 0px 0px 20px rgba(0,0,0,.05);
transition:.3s;
}
#body.fade, #footer.fade {
opacity:0;
}
#valign {
width:400px;
height:400px;
position:absolute;
top:calc(50% - 200px);
left:calc(50% - 200px);
}
#logo {
width:200px;
height:200px;
margin-left:auto;
margin-right:auto;
margin-bottom:30px;
margin-top:-35px;
position:relative;
background-size:100% 100%;
animation:popFade .5s;
}
@keyframes popFade {
from {
opacity:0;
transform:translate(0px, 100px);
} to {
opacity:1;
transform:translate(0px, 0px);
}
}
#box {
display:inline-block;
padding:30px;
padding-top:0px;
border:1px solid lightgray;
background-color:whitesmoke;
box-shadow:inset 1px 1px 0px white, inset -1px -1px 0px white, 0px 10px 20px rgba(0,0,0,.05);
}
#box input[type=text], #box input[type=password] {
display:block;
margin-left:auto;
margin-right:auto;
margin-bottom:25px;
width:280px;
height:20px;
border:1px solid lightgray;
padding:5px;
font-size:14px;
background-size:18px 18px;
background-position:right 5px center;
background-repeat:no-repeat;
box-shadow:1px 1px 0px white, -1px -1px 0px white, 1px -1px 0px white, -1px 1px 0px white, inset 0px 0px 3px whitesmoke;
}
#box input {
display:inline-block;
width:141px;
height:30px;
line-height:28px;
margin-left:5px;
margin-right:5px;
border:none;
background-color:#fbfbfb;
border:1px solid lightgray;
font-size:14px;
cursor:pointer;
box-shadow:1px 1px 0px white, -1px -1px 0px white, 1px -1px 0px white, -1px 1px 0px white, inset 1px 1px 0px white, inset -1px -1px 0px white;
}
#box input:hover {
background-color:white;
}
#box input:active {
background-color:whitesmoke;
}
</style>
</head>
<body>
<div id="body">
<div id="valign">
<div id="logo">
<svg width="150pt" height="150pt" viewBox="0 0 500 500" version="1.1" xmlns="http://www.w3.org/2000/svg">
<path fill="#000" d=" M 237.47 90.70 C 253.35 86.93 269.77 86.50 286.01 86.69 C 307.02 86.95 328.86 93.02 344.46 107.68 C 358.84 121.17 365.45 140.79 367.62 159.95 C 368.06 165.97 367.99 172.02 368.00 178.05 C 368.00 249.67 368.00 321.28 368.00 392.90 C 344.83 400.64 320.41 404.22 296.00 404.00 C 296.00 396.34 296.00 388.67 296.00 381.00 C 311.43 380.99 326.96 379.74 341.87 375.60 C 342.17 327.14 341.93 278.67 341.99 230.20 C 323.35 216.28 299.22 209.72 276.12 212.74 C 261.92 214.29 248.40 221.23 239.00 232.01 C 223.88 249.51 220.41 273.66 220.01 296.00 C 211.00 296.00 202.00 296.00 192.99 296.00 C 193.10 270.65 198.66 244.37 213.80 223.56 C 226.57 205.70 246.78 193.54 268.47 190.31 C 287.44 187.58 307.47 188.82 325.15 196.66 C 331.02 199.12 336.81 201.89 342.00 205.62 C 341.81 186.42 343.08 166.89 338.41 148.08 C 336.49 140.75 333.84 133.12 328.05 127.91 C 316.11 114.86 298.40 108.19 280.96 107.47 C 260.12 106.71 239.40 111.20 219.94 118.42 C 218.70 111.36 217.60 104.28 216.31 97.24 C 222.85 93.65 230.27 92.31 237.47 90.70 Z" />
<path fill="#000" d=" M 123.97 95.81 C 132.63 94.10 141.33 92.64 149.99 90.98 C 150.01 129.18 149.99 167.39 150.00 205.60 C 166.15 194.78 185.53 188.88 204.99 188.99 C 205.01 196.66 204.99 204.32 205.00 211.99 C 185.38 212.01 165.74 218.43 150.01 230.20 C 149.98 275.15 150.01 320.09 150.00 365.04 C 150.05 368.58 149.85 372.12 150.18 375.64 C 167.36 380.31 185.29 381.37 203.02 380.88 C 218.73 380.25 234.51 374.92 246.38 364.40 C 257.86 354.62 265.30 340.76 268.73 326.19 C 271.14 316.32 271.98 306.14 272.01 296.00 C 281.01 296.00 290.01 296.00 299.01 296.00 C 299.19 320.32 293.51 345.30 279.26 365.35 C 267.33 382.46 249.06 394.78 228.96 400.12 C 212.39 404.78 194.98 404.36 177.96 403.42 C 159.60 402.44 141.47 398.54 124.00 392.89 C 123.99 293.87 124.04 194.84 123.97 95.81 Z" />
</svg>
</div>
<div id="box">
<br><br>
<form method="post" action="$PORTAL_ACTION$">
<input id="li" name="accept" type="submit" value="Continue">
</form>
</div>
</div>
</div>
<div id="footer">
<span>Below Average © 2012 - 2018 &nbsp;&nbsp;&nbsp;•&nbsp;&nbsp;&nbsp; <a target="_blank" href="https://belowaverage.org/privacy/">Privacy</a> &nbsp;&nbsp;&nbsp;•&nbsp;&nbsp;&nbsp; <a href="https://belowaverage.org/">Home</a></span>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment