From 1c3fd054cc3126454ce94d4b56753b06b8dc72c3 Mon Sep 17 00:00:00 2001
From: "louismaxime.piton" <louismaxime.piton@orange.com>
Date: Wed, 11 Oct 2023 17:43:31 +0200
Subject: [PATCH] Add background-color to the svg

---
 scss/_variables.scss    |  1 +
 scss/forms/_labels.scss | 13 +++++++++++++
 2 files changed, 14 insertions(+)

diff --git a/scss/_variables.scss b/scss/_variables.scss
index d6a7bb6059..de09432bfe 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -1091,6 +1091,7 @@ $form-label-required-color:             var(--#{$prefix}link-hover-color) !defau
 // scss-docs-start form-helper-variables
 $form-helper-size:                      1.25rem !default; // Boosted mod
 $form-helper-color:                     var(--#{$prefix}info) !default; // Boosted mod
+$form-helper-bg:                        var(--#{$prefix}highlight-color) !default; // Boosted mod
 $form-helper-icon:                      escape-svg($helper-icon) !default; // Boosted mod
 $form-helper-label-margin-bottom:       $form-label-margin-bottom - divide(($form-helper-size - $font-size-base), 2) !default; // Boosted mod
 // scss-docs-end form-helper-variables
diff --git a/scss/forms/_labels.scss b/scss/forms/_labels.scss
index 4b7358ea6c..7db1a63238 100644
--- a/scss/forms/_labels.scss
+++ b/scss/forms/_labels.scss
@@ -23,6 +23,7 @@
 }
 
 .form-helper {
+  position: relative;
   display: inline-block;
   flex-shrink: 0;
   padding: 0;
@@ -30,6 +31,18 @@
   border: 0;
 
   &::before {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: calc(#{$form-helper-size} - 5px); // stylelint-disable-line function-disallowed-list
+    height: calc(#{$form-helper-size} - 5px); // stylelint-disable-line function-disallowed-list
+    content: "";
+    background-color: $form-helper-bg;
+    border-radius: 50%; // stylelint-disable-line property-disallowed-list
+    transform: translate(-50%, -50%);
+  }
+
+  &::after {
     display: block;
     width: $form-helper-size;
     height: $form-helper-size;