Context
PR #1393 added a font family toggle that sets --font-body via document.documentElement.style.setProperty(). This inline style has higher specificity than the [dir="rtl"] CSS rule that sets --font-body to Arabic/Hebrew fonts.
Problem
When a user selects "System Default" font and the page is in RTL mode, the inline style wins over the CSS [dir="rtl"] rule, potentially breaking Arabic/Hebrew text rendering.
Proposed Fix
Use a data-font attribute on <html> instead of inline style:
applyFont() sets document.documentElement.dataset.font = 'system'- CSS:
[data-font="system"] { --font-body: system-ui, ... }
[dir="rtl"] rule naturally overrides since it's more specific or later in cascade
Follow-up from PR #1393.
Context
PR #1393 added a font family toggle that sets
--font-bodyviadocument.documentElement.style.setProperty(). This inline style has higher specificity than the[dir="rtl"]CSS rule that sets--font-bodyto Arabic/Hebrew fonts.Problem
When a user selects "System Default" font and the page is in RTL mode, the inline style wins over the CSS
[dir="rtl"]rule, potentially breaking Arabic/Hebrew text rendering.Proposed Fix
Use a
data-fontattribute on<html>instead of inline style:applyFont()setsdocument.documentElement.dataset.font = 'system'[data-font="system"] { --font-body: system-ui, ... }[dir="rtl"]rule naturally overrides since it's more specific or later in cascadeFollow-up from PR #1393.