1
0
mirror of https://github.com/hrfee/jfa-go.git synced 2024-12-22 17:10:10 +00:00

captcha: recaptcha respects dark mode

also removed the ugly border around it.
This commit is contained in:
Harvey Tindall 2023-06-15 17:35:51 +01:00
parent 4014e93155
commit 07564bbde3
Signed by: hrfee
GPG Key ID: BBC65952848FB1A2
3 changed files with 17 additions and 3 deletions

View File

@ -560,3 +560,16 @@ div.card:contains(section.banner.footer) {
input[type="checkbox" i], [class^="ri-"], [class*=" ri-"], .ri-refresh-line:before, .modal-close { input[type="checkbox" i], [class^="ri-"], [class*=" ri-"], .ri-refresh-line:before, .modal-close {
cursor: pointer; cursor: pointer;
} }
.g-recaptcha {
overflow: hidden;
width: 296px;
height: 72px;
transform: scale(1.1);
transform-origin: top left;
}
.g-recaptcha iframe {
margin: -2px 0px 0px -4px;
}

View File

@ -39,7 +39,8 @@
var reCAPTCHACallback = () => { var reCAPTCHACallback = () => {
const el = document.getElementsByClassName("g-recaptcha")[0]; const el = document.getElementsByClassName("g-recaptcha")[0];
grecaptcha.render(el, { grecaptcha.render(el, {
"sitekey": window.reCAPTCHASiteKey "sitekey": window.reCAPTCHASiteKey,
"theme": document.documentElement.classList.contains("dark") ? "dark" : "light"
}); });
} }
</script> </script>

View File

@ -167,7 +167,7 @@
</label> </label>
</form> </form>
</div> </div>
<div class="flex-1"> <div class="flex-initial">
<div class="card ~neutral @low mb-4"> <div class="card ~neutral @low mb-4">
<span class="label supra" for="inv-uses">{{ .strings.passwordRequirementsHeader }}</span> <span class="label supra" for="inv-uses">{{ .strings.passwordRequirementsHeader }}</span>
<ul> <ul>
@ -180,7 +180,7 @@
</div> </div>
{{ if .captcha }} {{ if .captcha }}
<div class="card ~neutral @low mb-4"> <div class="card ~neutral @low mb-4">
<span class="label supra mb-2">CAPTCHA {{ if not .reCAPTCHA }}<span id="captcha-regen" title="{{ .strings.refresh }}" class="badge lg @low ~info ml-2 float-right"><i class="ri-refresh-line"></i></span>{{ end }}<span id="captcha-success" class="badge lg @low ~critical ml-2 float-right"><i class="ri-close-line"></i></span></span> <span class="label supra mb-2">CAPTCHA {{ if not .reCAPTCHA }}<span id="captcha-regen" title="{{ .strings.refresh }}" class="badge lg @low ~info ml-2 float-right"><i class="ri-refresh-line"></i></span><span id="captcha-success" class="badge lg @low ~critical ml-2 float-right"><i class="ri-close-line"></i></span>{{ end }}</span>
<div id="captcha-img" class="mt-2 mb-2 {{ if .reCAPTCHA }}g-recaptcha{{ end }}"></div> <div id="captcha-img" class="mt-2 mb-2 {{ if .reCAPTCHA }}g-recaptcha{{ end }}"></div>
{{ if not .reCAPTCHA }} {{ if not .reCAPTCHA }}
<input class="field ~neutral @low" id="captcha-input" class="mt-2" placeholder="CAPTCHA"> <input class="field ~neutral @low" id="captcha-input" class="mt-2" placeholder="CAPTCHA">