From d41034724fb762d171d28c511bde3a225789e311 Mon Sep 17 00:00:00 2001 From: Jerry Vrabel Date: Fri, 15 Nov 2024 09:23:22 -0600 Subject: [PATCH 1/7] VACMS-19163: changed required astrisk to after --- .../vagovclaro/assets/scss/components/_paragraphs.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss index 3981cd52d1..0a60fbe90a 100644 --- a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss +++ b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss @@ -125,3 +125,9 @@ #block-vagovclaro-content .paragraph.paragraph--type--magichead-group { border: var(--va-gray-lightest) solid 1px; } + +/* Mark the label with a required asterisk (like a typical "required" field indication) */ +#field-clp-spotlight-link-teasers-values th.field-label h4.form-item__label:before { + color: #FF0000; /* Red color for the asterisk */ + content: " *"; /* Adds an asterisk before the label text */ +} From a2e73e29a95301121ebdc64198b7d675dea4cd00 Mon Sep 17 00:00:00 2001 From: Jerry Vrabel Date: Fri, 15 Nov 2024 09:29:58 -0600 Subject: [PATCH 2/7] VACMS-19163: added required astrisk via css on paragraphs scss file-linting fix 3 --- .../custom/vagovclaro/assets/scss/components/_paragraphs.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss index 0a60fbe90a..9a97a037da 100644 --- a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss +++ b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss @@ -127,7 +127,7 @@ } /* Mark the label with a required asterisk (like a typical "required" field indication) */ -#field-clp-spotlight-link-teasers-values th.field-label h4.form-item__label:before { - color: #FF0000; /* Red color for the asterisk */ +#field-clp-spotlight-link-teasers-values th.field-label h4.form-item__label::after { + color: #F00; /* Red color for the asterisk */ content: " *"; /* Adds an asterisk before the label text */ } From caf5b3d796548de6e8f486f49bcb5ae233838cfa Mon Sep 17 00:00:00 2001 From: Jerry Vrabel Date: Mon, 18 Nov 2024 10:31:04 -0600 Subject: [PATCH 3/7] VACMS-19163: Refractored css selectors to apply required asterisk --- .../vagovclaro/assets/scss/components/_paragraphs.scss | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss index 9a97a037da..c8e6e0a402 100644 --- a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss +++ b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss @@ -127,7 +127,12 @@ } /* Mark the label with a required asterisk (like a typical "required" field indication) */ -#field-clp-spotlight-link-teasers-values th.field-label h4.form-item__label::after { +[required] .field-label::after, +[required] .fieldset__label::after, +[required] .form-item__label::after, +strong.form-required::after, +.details-wrapper::after +{ color: #F00; /* Red color for the asterisk */ - content: " *"; /* Adds an asterisk before the label text */ + content: " *"; /* Adds an asterisk before the label text */ } From 3dd550d57d07e4942e8c7cbe4e286586608b95c4 Mon Sep 17 00:00:00 2001 From: Jerry Vrabel Date: Wed, 20 Nov 2024 14:37:16 -0600 Subject: [PATCH 4/7] VACMS-19163: Updated scss selectors for specificity --- .../vagovclaro/assets/scss/components/_paragraphs.scss | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss index c8e6e0a402..b756a886c7 100644 --- a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss +++ b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss @@ -126,13 +126,8 @@ border: var(--va-gray-lightest) solid 1px; } -/* Mark the label with a required asterisk (like a typical "required" field indication) */ -[required] .field-label::after, -[required] .fieldset__label::after, -[required] .form-item__label::after, -strong.form-required::after, -.details-wrapper::after +#field-clp-spotlight-link-teasers-values .form-item__label::after { color: #F00; /* Red color for the asterisk */ - content: " *"; /* Adds an asterisk before the label text */ + content: "*"; /* Adds an asterisk before the label text */ } From f6ed360d7c6d80ebfb2855c06d136edb44cf8c77 Mon Sep 17 00:00:00 2001 From: Jerry Vrabel Date: Thu, 21 Nov 2024 08:53:15 -0600 Subject: [PATCH 5/7] VACMS-19163: Refractored code form and removed comments --- .../vagovclaro/assets/scss/components/_paragraphs.scss | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss index b756a886c7..c97c3fad69 100644 --- a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss +++ b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss @@ -126,8 +126,7 @@ border: var(--va-gray-lightest) solid 1px; } -#field-clp-spotlight-link-teasers-values .form-item__label::after -{ - color: #F00; /* Red color for the asterisk */ - content: "*"; /* Adds an asterisk before the label text */ +#field-clp-spotlight-link-teasers-values .form-item__label::after { + color: #F00; + content: "*"; } From 9e3024f642ee65f273124a0bce51517ddb72b34d Mon Sep 17 00:00:00 2001 From: Jerry Vrabel Date: Thu, 21 Nov 2024 09:09:35 -0600 Subject: [PATCH 6/7] VACMS-19163: refractored for linting rules --- .../vagovclaro/assets/scss/components/_paragraphs.scss | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss index c97c3fad69..f534b3b1e4 100644 --- a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss +++ b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss @@ -127,6 +127,9 @@ } #field-clp-spotlight-link-teasers-values .form-item__label::after { - color: #F00; - content: "*"; + color: var(--color-maximumred); + content: "*"; + display: inline-block; + font-size: 0.875rem; + margin-inline: 0.15em; } From a6e1f316f6f3fb85c80829b88868de2b44b043ef Mon Sep 17 00:00:00 2001 From: Jerry Vrabel Date: Fri, 22 Nov 2024 12:36:23 -0600 Subject: [PATCH 7/7] VACMS-19163: changed style to target .form-item__description::after --- .../custom/vagovclaro/assets/scss/components/_paragraphs.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss index f534b3b1e4..8db7bee924 100644 --- a/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss +++ b/docroot/themes/custom/vagovclaro/assets/scss/components/_paragraphs.scss @@ -126,7 +126,7 @@ border: var(--va-gray-lightest) solid 1px; } -#field-clp-spotlight-link-teasers-values .form-item__label::after { +#field-clp-spotlight-link-teasers-values .form-item__description::after { color: var(--color-maximumred); content: "*"; display: inline-block;