From f9f557f4146ee30dacc98d8221ee3b9aeb2fad5b Mon Sep 17 00:00:00 2001 From: Martin Jones Date: Fri, 14 Jun 2024 15:10:42 +0100 Subject: [PATCH] Ensure nested checkboxes are aligned correctly In v5.1.0 `.govuk-checkboxes` now uses flexbox, this caused a rendering issue when using nested checkboxes. Nested checkboxes are not included as part of the design system and the `.govuk-checkboxes--nested` CSS class only exists in the publishing components gem. Updating the width to 100% we fix the alignment issue. --- .../govuk_publishing_components/components/_checkboxes.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/govuk_publishing_components/components/_checkboxes.scss b/app/assets/stylesheets/govuk_publishing_components/components/_checkboxes.scss index 7bc00cf105..f0e1d70418 100644 --- a/app/assets/stylesheets/govuk_publishing_components/components/_checkboxes.scss +++ b/app/assets/stylesheets/govuk_publishing_components/components/_checkboxes.scss @@ -2,7 +2,8 @@ @import "govuk/components/checkboxes/checkboxes"; .govuk-checkboxes--nested { - margin-left: -(govuk-spacing(4) + 2px); // 22px + width: 100%; + margin-left: govuk-spacing(4); box-sizing: border-box; border-left-style: solid; border-left-width: 4px;