fix: ui issues and improvements pt. 1

frontend/src/components/LotApplicantAndInfoForm/constants.ts

@@ -3,20 +3,20 @@ import AgencyTextPropsType from '../../types/AgencyTextPropsType';
 import { OptionsInputType, StringInputType } from '../../types/FormInputType';
 import { ComboBoxPropsType } from './definitions';
 
-export const agencyFieldsProp: AgencyTextPropsType = {
+export const agencyFieldsText = (isReview: boolean | undefined): AgencyTextPropsType => ({
   useDefaultCheckbox: {
     name: '',
     labelText: ''
   },
   agencyInput: {
-    titleText: 'Applicant agency acronym',
+    titleText: `Applicant agency ${isReview ? '' : 'acronym'}`,
     invalidText: 'Acronym that identifies the agency'
   },
   locationCode: {
     name: 'seedlotCreationLocationCode',
-    labelText: 'Applicant agency number'
+    labelText: 'Agency location code'
   }
-};
+});
 
 export const speciesFieldConfig: ComboBoxPropsType = {
   placeholder: 'Enter or choose an species for the seedlot',

frontend/src/components/LotApplicantAndInfoForm/index.tsx

@@ -23,7 +23,7 @@ import { FormProps } from './definitions';
 import {
   vegLotAgency,
   vegLotLocationCode,
-  agencyFieldsProp
+  agencyFieldsText
 } from './constants';
 
 import './styles.scss';
@@ -115,7 +115,7 @@ const LotApplicantAndInfoForm = ({
             ? seedlotFormData.locationCode
             : vegLotLocationCode
         }
-        fieldsProps={agencyFieldsProp}
+        fieldsProps={agencyFieldsText(isReview)}
         setAgencyAndCode={
           (
             _isDefault: BooleanInputType,
@@ -132,7 +132,7 @@ const LotApplicantAndInfoForm = ({
             id={seedlotFormData?.email.id}
             name="email"
             type="email"
-            labelText="Applicant email address"
+            labelText="Email address"
             helperText="The Tree Seed Centre will use this to communicate with the applicant"
             invalid={seedlotFormData ? seedlotFormData.email.isInvalid : null}
             invalidText="Please enter a valid email"

frontend/src/components/LotApplicantAndInfoForm/styles.scss

@@ -20,6 +20,15 @@
   .agency-email-row{
     margin-bottom: 3rem;
   }
+
+  .#{vars.$bcgov-prefix}--radio-button__label-text {
+    p {
+      font-size: var(--#{vars.$bcgov-prefix}-body-compact-01-font-size, 0.875rem);
+      font-weight: var(--#{vars.$bcgov-prefix}-body-compact-01-font-weight, 400);
+      line-height: var(--#{vars.$bcgov-prefix}-body-compact-01-line-height, 1.28572);
+      letter-spacing: var(--#{vars.$bcgov-prefix}-body-compact-01-letter-spacing, 0.16px);
+    }
+  }
 }
 
 .applicant-info-input {

frontend/src/components/ScrollToTop/index.tsx

@@ -0,0 +1,18 @@
+import { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
+
+const ScrollToTop = () => {
+  const { pathname } = useLocation();
+
+  useEffect(() => {
+    document.documentElement.scrollTo({
+      top: 0,
+      left: 0,
+      behavior: 'smooth'
+    });
+  }, [pathname]);
+
+  return null;
+};
+
+export default ScrollToTop;

frontend/src/components/SeedlotRegistrationSteps/CollectionStep/constants.ts

@@ -10,7 +10,7 @@ export const agencyFieldsProps: AgencyTextPropsType = {
     labelText: 'Use applicant agency as collector agency'
   },
   agencyInput: {
-    titleText: 'Cone Collector agency',
+    titleText: 'Cone Collector agency acronym',
     invalidText: 'Please choose a valid collector agency, filter with agency number, name or acronym'
   },
   locationCode: {