summaryrefslogtreecommitdiffstats
path: root/web_src
diff options
context:
space:
mode:
Diffstat (limited to 'web_src')
-rw-r--r--web_src/js/features/captcha.js51
-rw-r--r--web_src/js/features/mcaptcha.js16
-rw-r--r--web_src/js/index.js4
-rw-r--r--web_src/less/_form.less14
4 files changed, 63 insertions, 22 deletions
diff --git a/web_src/js/features/captcha.js b/web_src/js/features/captcha.js
new file mode 100644
index 0000000000..3da5dbda41
--- /dev/null
+++ b/web_src/js/features/captcha.js
@@ -0,0 +1,51 @@
+import {isDarkTheme} from '../utils.js';
+
+export async function initCaptcha() {
+ const captchaEl = document.querySelector('#captcha');
+ if (!captchaEl) return;
+
+ const siteKey = captchaEl.getAttribute('data-sitekey');
+ const isDark = isDarkTheme();
+
+ const params = {
+ sitekey: siteKey,
+ theme: isDark ? 'dark' : 'light'
+ };
+
+ switch (captchaEl.getAttribute('data-captcha-type')) {
+ case 'g-recaptcha': {
+ if (window.grecaptcha) {
+ window.grecaptcha.ready(() => {
+ window.grecaptcha.render(captchaEl, params);
+ });
+ }
+ break;
+ }
+ case 'cf-turnstile': {
+ if (window.turnstile) {
+ window.turnstile.render(captchaEl, params);
+ }
+ break;
+ }
+ case 'h-captcha': {
+ if (window.hcaptcha) {
+ window.hcaptcha.render(captchaEl, params);
+ }
+ break;
+ }
+ case 'm-captcha': {
+ const {default: mCaptcha} = await import(/* webpackChunkName: "mcaptcha-vanilla-glue" */'@mcaptcha/vanilla-glue');
+ mCaptcha.INPUT_NAME = 'm-captcha-response';
+ const instanceURL = captchaEl.getAttribute('data-instance-url');
+
+ mCaptcha.default({
+ siteKey: {
+ instanceUrl: new URL(instanceURL),
+ key: siteKey,
+ }
+ });
+ break;
+ }
+ default:
+ }
+}
diff --git a/web_src/js/features/mcaptcha.js b/web_src/js/features/mcaptcha.js
deleted file mode 100644
index 725e2e28ac..0000000000
--- a/web_src/js/features/mcaptcha.js
+++ /dev/null
@@ -1,16 +0,0 @@
-export async function initMcaptcha() {
- const mCaptchaEl = document.querySelector('.m-captcha');
- if (!mCaptchaEl) return;
-
- const {default: mCaptcha} = await import(/* webpackChunkName: "mcaptcha-vanilla-glue" */'@mcaptcha/vanilla-glue');
- mCaptcha.INPUT_NAME = 'm-captcha-response';
- const siteKey = mCaptchaEl.getAttribute('data-sitekey');
- const instanceURL = mCaptchaEl.getAttribute('data-instance-url');
-
- mCaptcha.default({
- siteKey: {
- instanceUrl: new URL(instanceURL),
- key: siteKey,
- }
- });
-}
diff --git a/web_src/js/index.js b/web_src/js/index.js
index 14483f3fa2..74d80776b5 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -88,8 +88,8 @@ import {initCommonOrganization} from './features/common-organization.js';
import {initRepoWikiForm} from './features/repo-wiki.js';
import {initRepoCommentForm, initRepository} from './features/repo-legacy.js';
import {initFormattingReplacements} from './features/formatting.js';
-import {initMcaptcha} from './features/mcaptcha.js';
import {initCopyContent} from './features/copycontent.js';
+import {initCaptcha} from './features/captcha.js';
import {initRepositoryActionView} from './components/RepoActionView.vue';
// Run time-critical code as soon as possible. This is safe to do because this
@@ -191,7 +191,7 @@ $(document).ready(() => {
initRepositoryActionView();
initCommitStatuses();
- initMcaptcha();
+ initCaptcha();
initUserAuthLinkAccountView();
initUserAuthOauth2();
diff --git a/web_src/less/_form.less b/web_src/less/_form.less
index 3d2ec9fb8a..1a1c1678f8 100644
--- a/web_src/less/_form.less
+++ b/web_src/less/_form.less
@@ -220,18 +220,24 @@ textarea:focus,
}
@media @mediaMdAndUp {
- .g-recaptcha,
- .h-captcha {
+ .g-recaptcha-style,
+ .h-captcha-style {
margin: 0 auto !important;
width: 304px;
padding-left: 30px;
+
+ iframe {
+ border-radius: 5px !important;
+ width: 302px !important;
+ height: 76px !important;
+ }
}
}
@media (max-height: 575px) {
#rc-imageselect,
- .g-recaptcha,
- .h-captcha {
+ .g-recaptcha-style,
+ .h-captcha-style {
transform: scale(.77);
transform-origin: 0 0;
}