Alex-Devera/3x-ui
1
0
Fork 0
mirror of https://github.com/MHSanaei/3x-ui.git synced 2026-06-06 21:24:10 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

fix: make Turnstile widget responsive on narrow screens

Browse source 
Turnstile iframe (~300px min width) overflowed its container on mobile
due to large login card padding and no overflow handling. Reduce mobile
padding, center the widget wrapper, and use compact mode below 480px.
This commit is contained in:
Sora39831 2026-04-03 00:30:55 +08:00
parent 516d24c70a
commit 87c94cb5b0
2 changed files with 7 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
web/assets/css/custom.min.css vendored
View file

File diff suppressed because one or more lines are too long

7
web/html/login.html
View file

@ -118,7 +118,7 @@
</a-form-item>
<a-form-item>
<div class="cf-turnstile-wrapper">
<div class="cf-turnstile" :data-sitekey="turnstileSiteKey" data-callback="onTurnstileCallback"></div>
<div class="cf-turnstile" :data-sitekey="turnstileSiteKey" data-callback="onTurnstileCallback" :data-size="turnstileSize"></div>
</div>
</a-form-item>
<a-form-item>
@ -175,6 +175,11 @@
this.loadTurnstileScript();
}
},
computed: {
turnstileSize() {
return window.innerWidth < 480 ? 'compact' : 'normal';
},
},
methods: {
switchTab(key) {
this.activeTab = key;