From 86039a89fc86a48624b27bbecae1128e694e1c01 Mon Sep 17 00:00:00 2001
From: Andreas Shimokawa <shimokawa@fsfe.org>
Date: Sun, 30 Mar 2025 14:51:37 +0000
Subject: [PATCH] fix(a11y): unreadable image captcha with dark themes (#7390)

- When the user has a dark theme selected, image captchas are sometimes unreadable.
- Make sure the image captcha always has a white background color.

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/7390
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Reviewed-by: Beowulf <beowulf@beocode.eu>
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: Andreas Shimokawa <shimokawa@fsfe.org>
Co-committed-by: Andreas Shimokawa <shimokawa@fsfe.org>
---
 templates/user/auth/captcha.tmpl | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/user/auth/captcha.tmpl b/templates/user/auth/captcha.tmpl
index 9d0d6cfb6f..29f8ab07a2 100644
--- a/templates/user/auth/captcha.tmpl
+++ b/templates/user/auth/captcha.tmpl
@@ -1,7 +1,7 @@
 {{if .EnableCaptcha}}{{if eq .CaptchaType "image"}}
 	<div class="inline field tw-text-center">
 		<input type="hidden" name="img-captcha-id" value="{{.Captcha}}">
-		<img style="transform: scaleX(-1)" onclick="this.src=`{{AppSubUrl}}/captcha/{{.Captcha}}.png?reload=${Date.now()}`" class="captcha-img" src="{{AppSubUrl}}/captcha/{{.Captcha}}.png" alt="{{ctx.Locale.Tr "captcha"}}">
+		<img style="transform: scaleX(-1);background-color: white" onclick="this.src=`{{AppSubUrl}}/captcha/{{.Captcha}}.png?reload=${Date.now()}`" class="captcha-img" src="{{AppSubUrl}}/captcha/{{.Captcha}}.png" alt="{{ctx.Locale.Tr "captcha"}}">
 	</div>
 	<div class="required field {{if .Err_Captcha}}error{{end}}">
 		<label for="captcha">{{ctx.Locale.Tr "captcha"}}</label>