Skip to content

[6.x] Add padding around 2FA QR code for dark mode scanning#14460

Merged
jasonvarga merged 4 commits into6.xfrom
2fa-qr-code-dark-mode
Apr 8, 2026
Merged

[6.x] Add padding around 2FA QR code for dark mode scanning#14460
jasonvarga merged 4 commits into6.xfrom
2fa-qr-code-dark-mode

Conversation

@duncanmcclean
Copy link
Copy Markdown
Member

@duncanmcclean duncanmcclean commented Apr 8, 2026

This pull request fixes an issue where the 2FA setup QR code was difficult to scan on Android devices when using dark mode.

This was happening because the QR code SVG had no "quiet zone" (white border) around it, making it hard for scanners to detect the code boundaries against a dark background.

This PR fixes it by adding padding to the QR code container.

Before

CleanShot 2026-04-08 at 16 44 58@2x

After

CleanShot 2026-04-08 at 16 44 33@2x

Fixes #14445

duncanmcclean and others added 2 commits April 8, 2026 16:43
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@jasonvarga
Copy link
Copy Markdown
Member

Added a border because the added padding in light mode made the edges of the qr misaligned. Rounded corners to match the inputs.

jasonvarga and others added 2 commits April 8, 2026 12:09
Restore the default 4-module margin in RendererStyle instead of
overriding it to 0, giving the QR code a spec-compliant quiet zone
for reliable scanning in dark mode.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@jasonvarga
Copy link
Copy Markdown
Member

Turns out the p-2 was probably not enough of a quiet zone. We were removing the margin in PHP. I've changed it to use the default, which I would assume is plenty.

CleanShot 2026-04-08 at 12 11 42 CleanShot 2026-04-08 at 12 13 02

@jasonvarga jasonvarga merged commit 02c401a into 6.x Apr 8, 2026
17 checks passed
@jasonvarga jasonvarga deleted the 2fa-qr-code-dark-mode branch April 8, 2026 17:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2FA QR-Code dark mode issues

2 participants