fix: make tech review boxes description more detailed (#1263)

Co-authored-by: janosbabik <143906591+janosbabik@users.noreply.github.com>

Author: TCMeldrum

apps/frontend/src/components/questionary/questionaryComponents/TechnicalReviewBasis/QuestionaryComponentTechnicalReviewBasis.tsx

@@ -1,6 +1,7 @@
 import { Box, CssBaseline, Grid, InputLabel, useTheme } from '@mui/material';
 import { Field } from 'formik';
 import React, { ChangeEvent, useContext, useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 
 import {
   FileUploadComponent,
@@ -28,7 +29,7 @@ function QuestionaryComponentTechnicalReviewBasis(props: BasicComponentProps) {
     },
     formikProps,
   } = props;
-
+  const { t } = useTranslation();
   const theme = useTheme();
   const { state, dispatch } = useContext(
     QuestionaryContext
@@ -156,8 +157,13 @@ function QuestionaryComponentTechnicalReviewBasis(props: BasicComponentProps) {
               isInstrumentScientist ||
               fapSecOrChairCanEdit) && (
               <Grid item xs={12}>
-                <InputLabel htmlFor="comment" shrink margin="dense">
-                  Internal comment
+                <InputLabel
+                  htmlFor="comment"
+                  margin="dense"
+                  sx={{ fontWeight: 'bold', color: 'text.primary' }}
+                >
+                  Internal comment - To only be seen by other technical
+                  reviewers
                 </InputLabel>
                 {/* NOTE: We are using Editor directly instead of FormikUICustomEditor with Formik Field component.
                     This is because FormikUICustomEditor is not updated properly when we set form field onEditorChange.
@@ -209,8 +215,13 @@ function QuestionaryComponentTechnicalReviewBasis(props: BasicComponentProps) {
               isInstrumentScientist ||
               fapSecOrChairCanEdit) && (
               <Grid item xs={12}>
-                <InputLabel htmlFor="comment" shrink margin="dense">
-                  Internal documents
+                <InputLabel
+                  htmlFor="comment"
+                  margin="dense"
+                  sx={{ fontWeight: 'bold', color: 'text.primary' }}
+                >
+                  Internal documents - To only be seen by other technical
+                  reviewers
                 </InputLabel>
                 <FileUploadComponent
                   maxFiles={5}
@@ -241,8 +252,12 @@ function QuestionaryComponentTechnicalReviewBasis(props: BasicComponentProps) {
               </Grid>
             )}
             <Grid item xs={12}>
-              <InputLabel htmlFor="publicComment" shrink margin="dense">
-                Comments for the review panel
+              <InputLabel
+                htmlFor="publicComment"
+                margin="dense"
+                sx={{ fontWeight: 'bold', color: 'text.primary' }}
+              >
+                {`Comments be seen by the ${t('FAP')} panels`}
               </InputLabel>
               <Editor
                 id="publicComment"