From 4ff8bdfe9ce93ac3e04a007a1c9852701433ab48 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?John=20Molakvo=C3=A6=20=28skjnldsv=29?= Date: Tue, 12 May 2026 21:23:31 +0200 Subject: [PATCH] fix(a11y): make content accessible at 200% browser zoom MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit At 200% zoom a 1280 px display has a CSS viewport of ~640 px, which triggers the RTD mobile breakpoint at 768 px. However the custom clamp(800px, ...) keeps a hard 800 px minimum on the content area, causing horizontal overflow and making the page content unreachable without horizontal scrolling. WCAG 1.4.4 (Resize Text) / BITV 9.1.4.4 requires that content be fully usable up to 200% magnification. Add a media-query override to remove the width floor at narrow viewports so the content uses the available space. Fixes #9678 Signed-off-by: John Molakvoæ (skjnldsv) --- _shared_assets/static/custom.css | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/_shared_assets/static/custom.css b/_shared_assets/static/custom.css index 04b115a40e0..c5b76e5dc32 100644 --- a/_shared_assets/static/custom.css +++ b/_shared_assets/static/custom.css @@ -130,6 +130,22 @@ div#list-of-available-icons > blockquote > div > div > p { max-width: 900px; } +/* At 200% browser zoom a 1 280 px display has an effective viewport of + ~640 px, which is below the RTD mobile breakpoint (768 px). The + clamp() above keeps a hard 800 px minimum that then overflows the + viewport horizontally, making the documentation content unreachable + without horizontal scrolling (WCAG 1.4.4 / BITV 9.1.4.4). + Override to 100% so the content fills the available space. */ +@media screen and (max-width: 768px) { + .wy-nav-content { + max-width: 100% !important; + } + + .wy-nav-content section { + max-width: 100%; + } +} + table.docutils { min-width: 50%; }