From f02f3fcc6f2f2828c50826037ebf8b421ef0d911 Mon Sep 17 00:00:00 2001 From: evazion Date: Sat, 22 Jan 2022 21:33:34 -0600 Subject: [PATCH] css: fix text sizes in desktop mode on mobile. Disable font boosting on mobile. By default, when desktop mode is enabled on mobile, mobile browsers will automagically increase the size of text. Usually they do so poorly, making things like headers smaller than body text, which breaks the layout. Fixes regression in d6b1302e0. --- app/javascript/src/styles/base/010_reset.scss | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/app/javascript/src/styles/base/010_reset.scss b/app/javascript/src/styles/base/010_reset.scss index b27494803..b928b2506 100644 --- a/app/javascript/src/styles/base/010_reset.scss +++ b/app/javascript/src/styles/base/010_reset.scss @@ -1,3 +1,11 @@ +html { + // Disable font boosting on mobile. By default, when desktop mode is enabled + // on mobile, mobile browsers will automagically increase the size of text. + // Usually they do so poorly, making things like headers smaller than body + // text, which breaks the layout. + text-size-adjust: none; +} + *, ::before, ::after { box-sizing: border-box; }