fix(WeightedAssessmentSurvey): Update help text tooltip implementation

- Changed the help text display from using the `title` attribute to a `data-title` attribute for better accessibility and consistency.
- Updated CSS to reflect the change in tooltip functionality, ensuring help text is displayed correctly on hover.

Author: Lasse-numerous

js/src/components/widgets/WeightedAssessmentSurveyWidget.tsx

@@ -2544,7 +2544,7 @@ const WeightedAssessmentSurveyWidget: React.FC<WeightedAssessmentSurveyWidgetPro
                                         className="question-text-inline"
                                       />
                                       {question.helpText && (
-                                        <span className="question-help-icon" title={question.helpText}>
+                                        <span className="question-help-icon" data-title={question.helpText}>
                                           <svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                             <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z" fill="currentColor"/>
                                           </svg>

js/src/css/components/WeightedAssessmentSurvey.scss

@@ -2439,8 +2439,8 @@
 }
 
 /* Add tooltip functionality */
-.question-help-icon[title]:hover::after {
-  content: attr(title);
+.question-help-icon[data-title]:hover::after {
+  content: attr(data-title);
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
@@ -2460,7 +2460,7 @@
   word-break: break-word;
 }
 
-.question-help-icon[title]:hover::before {
+.question-help-icon[data-title]:hover::before {
   content: '';
   position: absolute;
   left: 50%;