Merge pull request #424 from syrk4web/staging

change loading, error and test files
This commit is contained in:
Théophile Diot 2023-03-21 11:56:47 +01:00 committed by GitHub
commit 2e144bf46e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 726 additions and 237 deletions

View File

@ -10,16 +10,13 @@
html {
width: 100%;
height: 100%;
background-color: #042a3a;
background-color: #125678;
}
body {
color: #fff;
text-align: center;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
padding: 0;
min-height: 100%;
-webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
display: table;
font-family: "Open Sans", Arial, sans-serif;
margin: 0;
@ -27,33 +24,25 @@
-webkit-text-size-adjust: 100%;
}
h1 {
display: flex;
flex-direction: column;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
color: inherit;
font-size: 36px;
}
h1 small {
font-size: 68%;
font-weight: 400;
line-height: 1;
color: #777;
}
a {
text-decoration: none;
color: #fff;
font-size: inherit;
border-bottom: dotted 1px #979797;
}
.lead {
color: silver;
font-size: 21px;
font-weight: bold;
line-height: 1.4;
letter-spacing: 0.05rem;
color: inherit;
font-size: 30px;
padding: 0 1rem;
}
.cover {
display: table-cell;
vertical-align: middle;
padding: 0 20px;
display: flex;
flex-direction: column;
justify-content: center;
width: 100vw;
height: 100vh;
align-items: center;
padding: 0;
transform: translateY(-10vh);
}
img {
width: 175px;
@ -61,11 +50,30 @@
footer {
position: fixed;
width: 100%;
letter-spacing: 1px;
left: 0;
bottom: 0;
color: #a0a0a0;
color: #b3b2b2;
font-size: 14px;
}
footer a {
text-decoration: none;
color: #fff;
border-bottom: 1px solid #fff;
}
footer a:hover {
text-decoration: none;
color: #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
@media (max-width: 640px) {
h1 {
font-size: 24px;
}
}
.lds-roller {
display: inline-block;
position: relative;

View File

@ -1,5 +1,5 @@
local _M = {}
_M.__index = _M
local _M = {}
_M.__index = _M
local utils = require "utils"
local datastore = require "datastore"
@ -128,7 +128,6 @@ function _M:access()
-- Method is suspicious, let's deny the request
return true, "unsupported HTTP method for Antibot", true, utils.get_deny_status()
end
function _M:challenge_resolved(antibot)
@ -232,7 +231,6 @@ function _M:display_challenge(antibot, challenge_uri)
ngx.say(html)
return true, "displayed challenge"
end
function _M:check_challenge(antibot)

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -6,7 +6,124 @@
<title>Bot Detection</title>
<link rel="icon" href="data:image/svg+xml, %%3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='96.000000pt' height='96.000000pt' viewBox='0 0 96.000000 96.000000' preserveAspectRatio='xMidYMid meet'%%3E%%3Cg transform='translate(0.000000,96.000000) scale(0.100000,-0.100000)'%%0Afill='%%23085577' stroke='none'%%3E%%3Cpath d='M535 863 c-22 -2 -139 -17 -260 -34 -228 -31 -267 -43 -272 -85 -2%%0A-10 23 -181 55 -379 l57 -360 400 0 400 0 20 40 c16 31 20 59 19 125 -1 100%%0A-24 165 -73 199 -41 29 -46 57 -22 111 30 67 29 188 -3 256 -13 28 -37 60 -53%%0A72 -55 39 -169 62 -268 55z m-15 -348 c30 -16 60 -61 60 -90 0 -10 -8 -33 -17%%0A-52 -16 -34 -16 -41 0 -116 9 -44 15 -82 12 -85 -6 -7 -92 -21 -131 -21 l-31%%0A-1 -6 85 c-4 75 -8 89 -31 112 -20 20 -26 36 -26 70 0 38 5 50 34 79 39 39 86%%0A45 136 19z'/%%3E%%3C/g%%3E%%3C/svg%%3E" type="image/svg+xml"/>
<style type="text/css">
body,html{width:100%%;height:100%%;background-color:#042a3a}body{color:#fff;text-align:center;text-shadow:0 2px 4px rgba(0, 0, 0, 0.5);padding:0;min-height:100%%;-webkit-box-shadow:inset 0 0 100px rgba(0, 0, 0, 0.8);box-shadow:inset 0 0 100px rgba(0, 0, 0, 0.8);display:table;font-family:"Open Sans", Arial, sans-serif;margin:0;-ms-text-size-adjust:100%%;-webkit-text-size-adjust:100%%}h1{font-family:inherit;font-weight:500;line-height:1.1;color:inherit;font-size:36px}h1 small{font-size:68%%;font-weight:400;line-height:1;color:#777}a{text-decoration:none;color:#fff;font-size:inherit;border-bottom:dotted 1px #979797}.lead{color:silver;font-size:21px;line-height:1.4}.cover{display:table-cell;vertical-align:middle;padding:0 20px}img{width:175px}footer{position:fixed;width:100%%;left:0;bottom:0;color:#a0a0a0;font-size:14px}.lds-roller{display: inline-block;position: relative;width: 80px;height: 80px}.lds-roller div{animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;transform-origin: 40px 40px}.lds-roller div:after{content: " ";display: block;position: absolute;width: 7px;height: 7px;border-radius: 50%%;background: #fff;margin: -4px 0 0 -4px}.lds-roller div:nth-child(1){animation-delay: -0.036s}.lds-roller div:nth-child(1):after{top: 63px;left: 63px}.lds-roller div:nth-child(2){animation-delay: -0.072s}.lds-roller div:nth-child(2):after{top: 68px;left: 56px}.lds-roller div:nth-child(3){animation-delay: -0.108s}.lds-roller div:nth-child(3):after{top: 71px;left: 48px}.lds-roller div:nth-child(4){animation-delay: -0.144s}.lds-roller div:nth-child(4):after{top: 72px;left: 40px}.lds-roller div:nth-child(5){animation-delay: -0.18s}.lds-roller div:nth-child(5):after{top: 71px;left: 32px}.lds-roller div:nth-child(6){animation-delay: -0.216s}.lds-roller div:nth-child(6):after{top: 68px;left: 24px}.lds-roller div:nth-child(7){animation-delay: -0.252s}.lds-roller div:nth-child(7):after{top: 63px;left: 17px}.lds-roller div:nth-child(8){animation-delay: -0.288s}.lds-roller div:nth-child(8):after{top: 56px;left: 12px}@keyframes lds-roller{0%%{transform: rotate(0deg)}100%%{transform: rotate(360deg)}}#showjs{display:none}#nojs{display:table-cell}
body,
html {
width: 100%%;
height: 100%%;
background-color: #125678;
}
body {
color: #fff;
text-align: center;
padding: 0;
min-height: 100%%;
display: table;
font-family: "Open Sans", Arial, sans-serif;
margin: 0;
-ms-text-size-adjust: 100%%;
-webkit-text-size-adjust: 100%%;
}
h1 {
display: flex;
flex-direction: column;
font-family: inherit;
font-weight: bold;
line-height: 1.4;
letter-spacing: 0.05rem;
color: inherit;
font-size: 30px;
padding: 0 1rem;
}
.cover {
display: flex;
flex-direction: column;
justify-content: center;
width: 100vw;
height: 100vh;
align-items: center;
padding: 0;
transform: translateY(-10vh);
}
img {
width: 175px;
}
footer {
position: fixed;
width: 100%%;
letter-spacing: 1px;
left: 0;
bottom: 0;
color: #b3b2b2;
font-size: 14px;
}
footer a {
text-decoration: none;
color: #fff;
border-bottom: 1px solid #fff;
}
footer a:hover {
text-decoration: none;
color: #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
.btn {
margin-top: 1rem;
cursor: pointer;
color:white;
background-color: #2FAC68;
border-radius: 6px;
border-width: 0;
font-size: 20px;
padding: 0.5rem 1rem;
max-width : 180px;
}
.btn:hover {
filter: brightness(0.9)
}
.form {
display:flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.captcha {
height: 1.5rem;
border-radius: 6px;
border-width: 0;
font-size: 20px;
color:#363636;
padding: 0.5rem;
}
.captcha:focus {
outline-width: 1;
outline-color: #2FAC68;
}
@media (max-width: 640px) {
h1 {
font-size: 24px;
}
.captcha {
height: 0.8rem;
font-size: 14px;
}
.btn {
margin-top: 1rem;
font-size: 16px;
padding: 0.5rem 0.5rem;
max-width : 180px;
}
}
@media (max-width: 320px) {
h1 {
font-size: 16px;
}
}
.lds-roller{display: inline-block;position: relative;width: 80px;height: 80px}.lds-roller div{animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;transform-origin: 40px 40px}.lds-roller div:after{content: " ";display: block;position: absolute;width: 7px;height: 7px;border-radius: 50%%;background: #fff;margin: -4px 0 0 -4px}.lds-roller div:nth-child(1){animation-delay: -0.036s}.lds-roller div:nth-child(1):after{top: 63px;left: 63px}.lds-roller div:nth-child(2){animation-delay: -0.072s}.lds-roller div:nth-child(2):after{top: 68px;left: 56px}.lds-roller div:nth-child(3){animation-delay: -0.108s}.lds-roller div:nth-child(3):after{top: 71px;left: 48px}.lds-roller div:nth-child(4){animation-delay: -0.144s}.lds-roller div:nth-child(4):after{top: 72px;left: 40px}.lds-roller div:nth-child(5){animation-delay: -0.18s}.lds-roller div:nth-child(5):after{top: 71px;left: 32px}.lds-roller div:nth-child(6){animation-delay: -0.216s}.lds-roller div:nth-child(6):after{top: 68px;left: 24px}.lds-roller div:nth-child(7){animation-delay: -0.252s}.lds-roller div:nth-child(7):after{top: 63px;left: 17px}.lds-roller div:nth-child(8){animation-delay: -0.288s}.lds-roller div:nth-child(8):after{top: 56px;left: 12px}@keyframes lds-roller{0%%{transform: rotate(0deg)}100%%{transform: rotate(360deg)}}#showjs{display:none}#nojs{display:table-cell}
</style>
</head>
<body>
@ -32,7 +149,7 @@
</body>
<script>
document.getElementById("nojs").style.display = 'none';
document.getElementById("showjs").style.display = 'table-cell';
document.getElementById("showjs").style.display = 'flex';
</script>
<script defer>
function textEncode(str) {

View File

@ -14,16 +14,13 @@
html {
width: 100%%;
height: 100%%;
background-color: #042a3a;
background-color: #125678;
}
body {
color: #fff;
text-align: center;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
padding: 0;
min-height: 100%%;
-webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
display: table;
font-family: "Open Sans", Arial, sans-serif;
margin: 0;
@ -31,33 +28,25 @@
-webkit-text-size-adjust: 100%%;
}
h1 {
display: flex;
flex-direction: column;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
color: inherit;
font-size: 36px;
}
h1 small {
font-size: 68%%;
font-weight: 400;
line-height: 1;
color: #777;
}
a {
text-decoration: none;
color: #fff;
font-size: inherit;
border-bottom: dotted 1px #979797;
}
.lead {
color: silver;
font-size: 21px;
font-weight: bold;
line-height: 1.4;
letter-spacing: 0.05rem;
color: inherit;
font-size: 30px;
padding: 0 1rem;
}
.cover {
display: table-cell;
vertical-align: middle;
padding: 0 20px;
display: flex;
flex-direction: column;
justify-content: center;
width: 100vw;
height: 100vh;
align-items: center;
padding: 0;
transform: translateY(-10vh);
}
img {
width: 175px;
@ -65,39 +54,72 @@
footer {
position: fixed;
width: 100%%;
letter-spacing: 1px;
left: 0;
bottom: 0;
color: #a0a0a0;
color: #b3b2b2;
font-size: 14px;
}
</style>
<style type="text/css">
.conditions {
color: #b3b2b2;
}
a {
text-decoration: none;
color: #fff;
border-bottom: 1px solid #fff;
}
a:hover {
text-decoration: none;
color: #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
.btn {
margin-top: 1rem;
cursor: pointer;
color: white;
background-color: #2fac68;
border-radius: 6px;
border-width: 0;
font-size: 20px;
padding: 0.5rem 1rem;
max-width: 360px;
}
.btn:hover {
filter: brightness(0.9);
}
.form {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
@media (max-width: 640px) {
h1 {
font-size: 24px;
}
.conditions {
font-size: 14px;
}
.btn {
margin-top: 1rem;
font-size: 16px;
padding: 0.5rem 0.5rem;
max-width: 180px;
}
}
@media (max-width: 320px) {
h1 {
font-size: 16px;
}
}
.grecaptcha-badge {
visibility: hidden;
}
</style>
<style type="text/css">
.myButton {
background-color: #40bb6b;
border-radius: 28px;
border: 1px solid #40bb6b;
display: inline-block;
cursor: pointer;
color: #fff;
font-family: Arial;
font-size: 17px;
padding: 16px 31px;
text-decoration: none;
text-shadow: 0 1px 0 #2f6627;
}
.myButton:hover {
background-color: #40bb6b;
}
.myButton:active {
position: relative;
top: 1px;
}
</style>
<script src="https://www.google.com/recaptcha/api.js?render=%s"></script>
</head>
<body>
@ -108,8 +130,9 @@
JavaScript needs to be enabled in order to visit this website.
</p>
</noscript>
<p class="lead">
<button onclick="check_robot();">I'm not a robot</button><br /><br />
<p class="conditions">
<button class="btn" onclick="check_robot();">I'm not a robot</button
><br /><br />
This site is protected by reCAPTCHA and the Google
<a href="https://policies.google.com/privacy">Privacy Policy</a> and
<a href="https://policies.google.com/terms">Terms of Service</a> apply.

View File

@ -14,16 +14,13 @@
html {
width: 100%%;
height: 100%%;
background-color: #042a3a;
background-color: #125678;
}
body {
color: #fff;
text-align: center;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
padding: 0;
min-height: 100%%;
-webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
display: table;
font-family: "Open Sans", Arial, sans-serif;
margin: 0;
@ -31,33 +28,35 @@
-webkit-text-size-adjust: 100%%;
}
h1 {
display: flex;
flex-direction: column;
font-family: inherit;
font-weight: 500;
font-weight: bold;
line-height: 1.1;
color: inherit;
font-size: 36px;
font-size: 80px;
}
h1 small {
font-size: 68%%;
font-weight: 400;
padding-top: 8px;
font-size: 24px;
font-weight: 500;
line-height: 1;
color: #777;
}
a {
text-decoration: none;
color: #fff;
font-size: inherit;
border-bottom: dotted 1px #979797;
color: #b3b2b2;
}
.lead {
color: silver;
font-size: 21px;
color: rgb(234, 233, 233);
font-size: 24px;
line-height: 1.4;
}
.cover {
display: table-cell;
vertical-align: middle;
padding: 0 20px;
display: flex;
flex-direction: column;
justify-content: center;
width: 100vw;
height: 100vh;
align-items: center;
padding: 0;
}
img {
width: 175px;
@ -65,17 +64,34 @@
footer {
position: fixed;
width: 100%%;
letter-spacing: 1px;
left: 0;
bottom: 0;
color: #a0a0a0;
color: #b3b2b2;
font-size: 14px;
}
footer a {
text-decoration: none;
color: #fff;
border-bottom: 1px solid #fff;
}
footer a:hover {
text-decoration: none;
color: #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
.message {
transform: translateY(-10vh);
padding: 0 1rem;
}
</style>
</head>
<body>
<div class="cover">
<h1>%s <small>%s</small></h1>
<p class="lead">%s</p>
<div class="message">
<h1>%s<small>%s</small></h1>
<p class="lead">%s</p>
</div>
</div>
<footer>
<img

View File

@ -82,7 +82,7 @@
"help": "Sitekey for hCaptcha challenge.",
"id": "antibot-hcaptcha-sitekey",
"label": "hCaptcha sitekey",
"regex": "^[a-zA-Z0-9]*$",
"regex": "^[a-zA-Z0-9-]*$",
"type": "text"
},
"ANTIBOT_HCAPTCHA_SECRET": {

View File

@ -1,5 +1,5 @@
local _M = {}
_M.__index = _M
local _M = {}
_M.__index = _M
local utils = require "utils"
local datastore = require "datastore"
@ -15,76 +15,52 @@ function _M:init()
-- Save default errors into datastore
local default_errors = {
["400"] = {
title = "400 - Bad Request",
body1 = "Bad Request",
body2 = "400",
body3 = "The server did not understand the request."
body2 = "The server did not understand the request."
},
["401"] = {
title = "401 - Not Authorized",
body1 = "Not Authorized",
body2 = "401",
body3 = "Valid authentication credentials needed for the target resource."
body2 = "Valid authentication credentials needed for the target resource."
},
["403"] = {
title = "403 - Forbidden",
body1 = "Forbidden",
body2 = "403",
body3 = "Access is forbidden to the requested page."
body2 = "Access is forbidden to the requested page."
},
["404"] = {
title = "404 - Not Found",
body1 = "Not Found",
body2 = "404",
body3 = "The server cannot find the requested page."
body2 = "The server cannot find the requested page."
},
["405"] = {
title = "405 - Method Not Allowed",
body1 = "Method Not Allowed",
body2 = "405",
body3 = "The method specified in the request is not allowed."
body2 = "The method specified in the request is not allowed."
},
["413"] = {
title = "413 - Request Entity Too Large",
body1 = "Request Entity Too Large",
body2 = "413",
body3 = "The server will not accept the request, because the request entity is too large."
body2 = "The server will not accept the request, because the request entity is too large."
},
["429"] = {
title = "429 - Too Many Requests",
body1 = "Too Many Requests",
body2 = "429",
body3 = "Too many requests sent in a given amount of time, try again later."
body2 = "Too many requests sent in a given amount of time, try again later."
},
["500"] = {
title = "500 - Internal Server Error",
body1 = "Internal Server Error",
body2 = "500",
body3 = "The request was not completed. The server met an unexpected condition."
body2 = "The request was not completed. The server met an unexpected condition."
},
["501"] = {
title = "501 - Not Implemented",
body1 = "Not Implemented",
body2 = "501",
body3 = "The request was not completed. The server did not support the functionality required."
body2 = "The request was not completed. The server did not support the functionality required."
},
["502"] = {
title = "502 - Bad Gateway",
body1 = "Bad Gateway",
body2 = "502",
body3 = "The request was not completed. The server received an invalid response from the upstream server."
body2 = "The request was not completed. The server received an invalid response from the upstream server."
},
["503"] = {
title = "503 - Service Unavailable",
body1 = "Service Unavailable",
body2 = "503",
body3 = "The request was not completed. The server is temporarily overloading or down."
body2 = "The request was not completed. The server is temporarily overloading or down."
},
["504"] = {
title = "504 - Gateway Timeout",
body1 = "Gateway Timeout",
body2 = "504",
body3 = "The gateway has timed out."
body2 = "The gateway has timed out."
}
}
local ok, err = datastore:set("plugin_errors_default_errors", cjson.encode(default_errors))
@ -118,8 +94,8 @@ function _M.error_html(code)
return false, "can't get template from datastore : " .. err
end
-- Compute template
return template:format(default_errors[code].title, default_errors[code].body1, default_errors[code].body2,
default_errors[code].body3), "success"
return template:format(code .. " - " .. default_errors[code].body1, code, default_errors[code].body1,
default_errors[code].body2), "success"
end
return _M

View File

@ -14,16 +14,13 @@
html {
width: 100%%;
height: 100%%;
background-color: #042a3a;
background-color: #125678;
}
body {
color: #fff;
text-align: center;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
padding: 0;
min-height: 100%%;
-webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
display: table;
font-family: "Open Sans", Arial, sans-serif;
margin: 0;
@ -31,33 +28,35 @@
-webkit-text-size-adjust: 100%%;
}
h1 {
display: flex;
flex-direction: column;
font-family: inherit;
font-weight: 500;
font-weight: bold;
line-height: 1.1;
color: inherit;
font-size: 36px;
font-size: 80px;
}
h1 small {
font-size: 68%%;
font-weight: 400;
padding-top: 8px;
font-size: 24px;
font-weight: 500;
line-height: 1;
color: #777;
}
a {
text-decoration: none;
color: #fff;
font-size: inherit;
border-bottom: dotted 1px #979797;
color: #b3b2b2;
}
.lead {
color: silver;
font-size: 21px;
color: rgb(234, 233, 233);
font-size: 24px;
line-height: 1.4;
}
.cover {
display: table-cell;
vertical-align: middle;
padding: 0 20px;
display: flex;
flex-direction: column;
justify-content: center;
width: 100vw;
height: 100vh;
align-items: center;
padding: 0;
}
img {
width: 175px;
@ -65,17 +64,34 @@
footer {
position: fixed;
width: 100%%;
letter-spacing: 1px;
left: 0;
bottom: 0;
color: #a0a0a0;
color: #b3b2b2;
font-size: 14px;
}
footer a {
text-decoration: none;
color: #fff;
border-bottom: 1px solid #fff;
}
footer a:hover {
text-decoration: none;
color: #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
.message {
transform: translateY(-10vh);
padding: 0 1rem;
}
</style>
</head>
<body>
<div class="cover">
<h1>%s <small>%s</small></h1>
<p class="lead">%s</p>
<div class="message">
<h1>%s<small>%s</small></h1>
<p class="lead">%s</p>
</div>
</div>
<footer>
<img

View File

@ -9,21 +9,18 @@
href="data:image/svg+xml, %%3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='96.000000pt' height='96.000000pt' viewBox='0 0 96.000000 96.000000' preserveAspectRatio='xMidYMid meet'%%3E%%3Cg transform='translate(0.000000,96.000000) scale(0.100000,-0.100000)'%%0Afill='%%23085577' stroke='none'%%3E%%3Cpath d='M535 863 c-22 -2 -139 -17 -260 -34 -228 -31 -267 -43 -272 -85 -2%%0A-10 23 -181 55 -379 l57 -360 400 0 400 0 20 40 c16 31 20 59 19 125 -1 100%%0A-24 165 -73 199 -41 29 -46 57 -22 111 30 67 29 188 -3 256 -13 28 -37 60 -53%%0A72 -55 39 -169 62 -268 55z m-15 -348 c30 -16 60 -61 60 -90 0 -10 -8 -33 -17%%0A-52 -16 -34 -16 -41 0 -116 9 -44 15 -82 12 -85 -6 -7 -92 -21 -131 -21 l-31%%0A-1 -6 85 c-4 75 -8 89 -31 112 -20 20 -26 36 -26 70 0 38 5 50 34 79 39 39 86%%0A45 136 19z'/%%3E%%3C/g%%3E%%3C/svg%%3E"
type="image/svg+xml"
/>
<style>
<style type="text/css">
body,
html {
width: 100%;
height: 100%;
background-color: #042a3a;
background-color: #125678;
}
body {
color: #fff;
text-align: center;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
padding: 0;
min-height: 100%;
-webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
display: table;
font-family: "Open Sans", Arial, sans-serif;
margin: 0;
@ -31,33 +28,22 @@
-webkit-text-size-adjust: 100%;
}
h1 {
display: flex;
flex-direction: column;
font-family: inherit;
font-weight: 500;
font-weight: bold;
line-height: 1.1;
color: inherit;
font-size: 36px;
}
h1 small {
font-size: 68%;
font-weight: 400;
line-height: 1;
color: #777;
}
a {
text-decoration: none;
color: #fff;
font-size: inherit;
border-bottom: dotted 1px #979797;
}
.lead {
color: silver;
font-size: 21px;
line-height: 1.4;
font-size: 40px;
}
.cover {
display: table-cell;
vertical-align: middle;
padding: 0 20px;
display: flex;
flex-direction: column;
justify-content: center;
width: 100vw;
height: 100vh;
align-items: center;
padding: 0;
}
img {
width: 175px;
@ -65,16 +51,33 @@
footer {
position: fixed;
width: 100%;
letter-spacing: 1px;
left: 0;
bottom: 0;
color: #a0a0a0;
color: #b3b2b2;
font-size: 14px;
}
footer a {
text-decoration: none;
color: #fff;
border-bottom: 1px solid #fff;
}
footer a:hover {
text-decoration: none;
color: #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
.message {
transform: translateY(-10vh);
padding: 0 1rem;
}
</style>
</head>
<body>
<div class="cover">
<h1>Nothing to see here...</h1>
<div class="message">
<h1>Nothing to see here...</h1>
</div>
</div>
<footer>
<img