diff --git a/src/js/challenge.js b/src/js/challenge.js
index 9c7138f..0a1c732 100644
--- a/src/js/challenge.js
+++ b/src/js/challenge.js
@@ -4,10 +4,11 @@ function updateElem(selector, text) {
}
function insertError(str) {
- const ring = document.querySelector('.lds-ring');
+ const loader = document.querySelector('#loader');
const captcha = document.querySelector('#captcha');
- (ring || captcha).insertAdjacentHTML('afterend', `
Error: ${str}
`);
- ring && ring.remove();
+ console.log(loader, captcha);
+ (captcha || loader).insertAdjacentHTML('afterend', `Error: ${str}
`);
+ loader && loader.remove();
captcha && captcha.remove();
updateElem('.powstatus', '');
}
@@ -153,7 +154,8 @@ const powFinished = new Promise(resolve => {
function onCaptchaSubmit(captchaResponse) {
const captchaElem = document.querySelector('[data-sitekey]');
- captchaElem.insertAdjacentHTML('afterend', ``);
+ // captchaElem.insertAdjacentHTML('afterend', ``);
+ captchaElem.insertAdjacentHTML('afterend', ``);
captchaElem.remove();
powFinished.then(powResponse => {
postResponse(powResponse, captchaResponse);
diff --git a/src/lua/scripts/templates.lua b/src/lua/scripts/templates.lua
index 93e1b46..03c9b4c 100644
--- a/src/lua/scripts/templates.lua
+++ b/src/lua/scripts/templates.lua
@@ -12,19 +12,26 @@ _M.body = [[
@media (prefers-color-scheme:light){:root{--text-color:#333;--bg-color:#EEE}}
.h-captcha,.g-recaptcha{min-height:85px;display:block}
.red{color:red;font-weight:bold}
+ .left{text-align:left}
.powstatus{color:green;font-weight:bold}
a,a:visited{color:var(--text-color)}
- body,html{height:100%%}
- body{display:flex;flex-direction:column;background-color:var(--bg-color);color:var(--text-color);font-family:Helvetica,Arial,sans-serif;max-width:1200px;margin:0 auto;padding: 0 20px}
+ body,html{height:100%%;text-align:center;}
+ body{display:flex;flex-direction:column;background-color:var(--bg-color);color:var(--text-color);font-family:Helvetica,Arial,sans-serif;max-width:60em;margin:0 auto;padding: 0 20px}
details{transition: border-left-color 0.5s;max-width:1200px;text-align:left;border-left: 2px solid var(--text-color);padding:10px}
- code{background-color:#dfdfdf30;border-radius:3px;padding:0 3px;}
- img,h3,p{margin:0 0 5px 0}
- footer{font-size:x-small;margin-top:auto;margin-bottom:20px;text-align:center}
+ code{background-color:#dfdfdf30;border-radius:4px;padding:0 3px;color:#ff6590}
+ img,h3{margin:0 0 5px 0}
+ li{margin-bottom: 1em}
+ footer{font-size:x-small;margin-top:auto;padding:10px;text-align:center;border-top:1px solid #80808040;padding:10px}
img{display:inline}
- .pt{padding-top:15vh;display:flex;align-items:center;word-break:break-all}
+ textarea,input{background:var(--bg-color);color:var(--text-color);border:1px solid var(--text-color);width:100%%;box-sizing: border-box;resize:none;padding:0.5em;font-family:inherit}
+ .pt{padding-top:30vh;display:flex;align-items:center;word-break:break-all;justify-content: center;}
.pt img{margin-right:10px}
- details[open]{border-left-color: #1400ff}
- .lds-ring{display:inline-block;position:relative;width:80px;height:80px}.lds-ring div{box-sizing:border-box;display:block;position:absolute;width:32px;height:32px;margin:10px;border:5px solid var(--text-color);border-radius:50%%;animation:lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;border-color:var(--text-color) transparent transparent transparent}.lds-ring div:nth-child(1){animation-delay:-0.45s}.lds-ring div:nth-child(2){animation-delay:-0.3s}.lds-ring div:nth-child(3){animation-delay:-0.15s}@keyframes lds-ring{0%%{transform:rotate(0deg)}100%%{transform:rotate(360deg)}}
+ details[open]{border-left-color: #1400ff}
+ .b{display:inline-block;background:#6b93f7;border-radius:50%%;margin:10px;height:16px;width:16px;box-shadow:0 0 0 0 #6b93f720;transform:scale(1)}
+ .b:nth-of-type(1){animation:p 3s infinite}
+ .b:nth-of-type(2){animation:p 3s .5s infinite}
+ .b:nth-of-type(3){animation:p 3s 1s infinite}
+ @keyframes p{0%%{transform:scale(.95);box-shadow:0 0 0 0 #6b93f790}70%%{transform:scale(1);box-shadow:0 0 0 10px #6b93f700}100%%{transform:scale(.95);box-shadow:0 0 0 0 #6b93f700}}