From 49d54917db5361c8270d417b264bc042201258be Mon Sep 17 00:00:00 2001 From: andrey-canon Date: Thu, 6 Aug 2026 12:14:02 -0500 Subject: [PATCH] fix(problem): use CSS logical properties for RTL layout support Replace physical CSS properties (margin-right, padding-left, left) with logical properties (margin-inline-end, padding-inline-start, inset-inline-start) in ProblemBlockDisplay.css to fix choicegroup alignment issues in RTL locales. --- .../problem/assets/static/css/ProblemBlockDisplay.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/xblocks_contrib/problem/assets/static/css/ProblemBlockDisplay.css b/xblocks_contrib/problem/assets/static/css/ProblemBlockDisplay.css index aeb93480..cf6269f9 100644 --- a/xblocks_contrib/problem/assets/static/css/ProblemBlockDisplay.css +++ b/xblocks_contrib/problem/assets/static/css/ProblemBlockDisplay.css @@ -322,7 +322,7 @@ .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input[type="checkbox"], .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input[type="checkbox"] { margin: calc((var(--baseline, 20px) / 4)); - margin-right: calc((var(--baseline, 20px) / 2)); + margin-inline-end: calc((var(--baseline, 20px) / 2)); } .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label, @@ -885,7 +885,7 @@ .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup label { padding: calc((var(--baseline, 20px) / 2)); - padding-left: calc((var(--baseline, 20px) * 2.3)); + padding-inline-start: calc((var(--baseline, 20px) * 2.3)); position: relative; font-size: var(--base-font-size, 18px); line-height: normal; @@ -894,7 +894,7 @@ .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input[type="radio"], .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input[type="checkbox"] { - left: 0.5625em; + inset-inline-start: 0.5625em; position: absolute; top: 0.43em; width: calc(var(--baseline, 20px) * 1.1);