diff --git a/apps/redi-connect/src/components/organisms/DeclineMentorshipButton.tsx b/apps/redi-connect/src/components/organisms/DeclineMentorshipButton.tsx
index c873758cd..4e8db874a 100644
--- a/apps/redi-connect/src/components/organisms/DeclineMentorshipButton.tsx
+++ b/apps/redi-connect/src/components/organisms/DeclineMentorshipButton.tsx
@@ -97,6 +97,8 @@ const DeclineMentorshipButton = ({
name="ifDeclinedByMentor_chosenReasonForDecline"
label=""
items={formDeclineOptions}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
{formik.values.ifDeclinedByMentor_chosenReasonForDecline ===
diff --git a/apps/redi-connect/src/components/organisms/modules/MSessions.tsx b/apps/redi-connect/src/components/organisms/modules/MSessions.tsx
index 292c35a3e..c1e9053bf 100644
--- a/apps/redi-connect/src/components/organisms/modules/MSessions.tsx
+++ b/apps/redi-connect/src/components/organisms/modules/MSessions.tsx
@@ -163,6 +163,8 @@ const MSessions = ({
name="minuteDuration"
placeholder="Add the duration of the session"
items={formMentoringSessionDurationOptions}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
diff --git a/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx b/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx
index ef8d83c87..2109c959a 100644
--- a/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx
+++ b/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx
@@ -319,12 +319,16 @@ function ModalForm({
multiselect
placeholder="Start typing and select skills"
closeMenuOnSelect={false}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
/>
@@ -382,6 +384,8 @@ export function JobseekerFormSectionEducation({
name={`education[${index}].endDateMonth`}
label="Ended in month*"
items={formMonthsOptions}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
diff --git a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableImportantDetails.tsx b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableImportantDetails.tsx
index 869e88764..4a61d34b8 100644
--- a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableImportantDetails.tsx
+++ b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableImportantDetails.tsx
@@ -314,11 +314,15 @@ export function JobseekerFormSectionImportantDetails({
multiselect
placeholder="Select desired employment types"
closeMenuOnSelect={false}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
/>
{formik.values.availability === 'date' ? (
@@ -338,6 +342,8 @@ export function JobseekerFormSectionImportantDetails({
label="What is your immigration status?"
name="immigrationStatus"
items={formImmigrationStatusOptions}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
>
diff --git a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableLanguages.tsx b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableLanguages.tsx
index 32f35aed8..baccdeb15 100644
--- a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableLanguages.tsx
+++ b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableLanguages.tsx
@@ -251,12 +251,16 @@ export function JobseekerFormSectionLanguages({
name={`workingLanguages[${index}].language`}
label="Language*"
items={formLanguages}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
diff --git a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableNamePhotoLocation.tsx b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableNamePhotoLocation.tsx
index 2a055132e..99d1ab41b 100644
--- a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableNamePhotoLocation.tsx
+++ b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableNamePhotoLocation.tsx
@@ -208,6 +208,8 @@ function ModalForm({
name="federalState"
label="Your place of residence (state)*"
items={federalStatesOptions}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
{hideCurrentRediCourseField ? null : (
)}
diff --git a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableProfessionalExperience.tsx b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableProfessionalExperience.tsx
index 1f9db6c12..90e3d4d2c 100644
--- a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableProfessionalExperience.tsx
+++ b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableProfessionalExperience.tsx
@@ -356,6 +356,8 @@ export function JobseekerFormSectionProfessionalExperience({
name={`experience[${index}].startDateMonth`}
label="Started in month*"
items={formMonthsOptions}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
@@ -375,6 +377,8 @@ export function JobseekerFormSectionProfessionalExperience({
name={`experience[${index}].endDateMonth`}
label="Ended in month*"
items={formMonthsOptions}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
formik={formik}
/>
diff --git a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableSummary.tsx b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableSummary.tsx
index 51dd70430..91aaffa5c 100644
--- a/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableSummary.tsx
+++ b/apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableSummary.tsx
@@ -190,6 +190,8 @@ export function JobseekerFormSectionSummary({
multiselect
placeholder="Start typing and select skills"
closeMenuOnSelect={false}
+ menuPortalTarget={document.body}
+ menuPosition="fixed"
/>
}
@@ -50,6 +52,8 @@ function FormSelect(props: FormSelectProps) {
multiselect,
disabled,
closeMenuOnSelect,
+ menuPortalTarget,
+ menuPosition,
formik: { values, setFieldTouched, setFieldValue, touched, errors, handleBlur, isSubmitting }
} = props
@@ -96,8 +100,8 @@ function FormSelect(props: FormSelectProps) {
isDisabled={isSubmitting || disabled}
isMulti={multiselect}
styles={formSelectStyles}
- menuPortalTarget={document.body}
- menuPosition="fixed"
+ menuPortalTarget={menuPortalTarget}
+ menuPosition={menuPosition}
closeMenuOnSelect={closeMenuOnSelect}
/>