From 3eabc1c5e3aac697e2f22bdd64f6ce3d821e86ce Mon Sep 17 00:00:00 2001
From: Ashley Wright <ashley.wright@mx.com>
Date: Fri, 18 Sep 2026 12:43:05 -0600
Subject: [PATCH 1/3] fix: delete member survey no longer has blue text and the
 selection boxes are now inline

---
 src/components/DeleteMemberSurvey.js         | 111 ++++++++++---------
 src/components/DeleteMemberSurvey.module.css |   9 ++
 2 files changed, 66 insertions(+), 54 deletions(-)

diff --git a/src/components/DeleteMemberSurvey.js b/src/components/DeleteMemberSurvey.js
index 1dbaf23b0b..49cfa87527 100644
--- a/src/components/DeleteMemberSurvey.js
+++ b/src/components/DeleteMemberSurvey.js
@@ -130,64 +130,67 @@ export const DeleteMemberSurvey = (props) => {
             </SlideDown>
           ) : (
             <React.Fragment>
-              <Stack spacing={0.5}>
+              <Stack spacing={3}>
                 <Text truncate={false} variant="h2">
                   {__('Disconnect institution')}
                 </Text>
-                <FormControl>
-                  <Stack spacing={2}>
-                    <FormLabel id="disconnect-options-label">
-                      <Text
-                        component="p"
-                        data-test="disconnect-disclaimer"
-                        truncate={false}
-                        variant="subtitle1"
-                      >
-                        {_p(
-                          'connect/deletesurvey/disclaimer/text',
-                          'Why do you want to disconnect %1?',
-                          member.name,
-                        )}
-                        <Text color="error" component="span" truncate={false} variant="subtitle1">
-                          *
+                <Stack spacing={0.5}>
+                  <FormControl>
+                    <Stack spacing={2}>
+                      <FormLabel id="disconnect-options-label">
+                        <Text
+                          className={styles.disclaimer}
+                          component="p"
+                          data-test="disconnect-disclaimer"
+                          truncate={false}
+                          variant="subtitle1"
+                        >
+                          {_p(
+                            'connect/deletesurvey/disclaimer/text',
+                            'Why do you want to disconnect %1?',
+                            member.name,
+                          )}
+                          <Text color="error" component="span" truncate={false} variant="subtitle1">
+                            *
+                          </Text>
                         </Text>
-                      </Text>
-                    </FormLabel>
-                    <div>
-                      {reasonList.map((reason, i) => (
-                        <div key={reason}>
-                          <SelectionBox
-                            autoFocus={i === 0}
-                            data-test={`selection-${reason.replace(/\s+/g, '-')}`}
-                            data-testid="disconnect-option"
-                            error={isSubmitted && !selectedReason}
-                            inputProps={{
-                              'aria-labelledby': 'disconnect-options-label',
-                            }}
-                            message={reason}
-                            name="selected-reason"
-                            onChange={(e) => setSelectedReason(e.target.value)}
-                            selected={selectedReason === reason}
-                            value={reason}
-                          />
-                        </div>
-                      ))}
-                    </div>
-                  </Stack>
-                </FormControl>
-
-                <Text
-                  className={styles.requiredNote}
-                  color="textSecondary"
-                  component="span"
-                  truncate={false}
-                  variant="body2"
-                >
-                  <Text color="error" component="span" truncate={false} variant="body2">
-                    *
-                  </Text>{' '}
-                  {__('Required')}
-                </Text>
+                      </FormLabel>
+                      <div>
+                        {reasonList.map((reason, i) => (
+                          <div className={styles.option} key={reason}>
+                            <SelectionBox
+                              autoFocus={i === 0}
+                              data-test={`selection-${reason.replace(/\s+/g, '-')}`}
+                              data-testid="disconnect-option"
+                              error={isSubmitted && !selectedReason}
+                              inputProps={{
+                                'aria-labelledby': 'disconnect-options-label',
+                              }}
+                              message={reason}
+                              name="selected-reason"
+                              onChange={(e) => setSelectedReason(e.target.value)}
+                              selected={selectedReason === reason}
+                              value={reason}
+                            />
+                          </div>
+                        ))}
+                      </div>
+                    </Stack>
+                  </FormControl>
+
+                  <Text
+                    className={styles.requiredNote}
+                    color="textSecondary"
+                    component="span"
+                    truncate={false}
+                    variant="body2"
+                  >
+                    <Text color="error" component="span" truncate={false} variant="body2">
+                      *
+                    </Text>{' '}
+                    {__('Required')}
+                  </Text>
+                </Stack>
               </Stack>
 
               {isSubmitted && !selectedReason && (
diff --git a/src/components/DeleteMemberSurvey.module.css b/src/components/DeleteMemberSurvey.module.css
index ddefac5caa..b29175d362 100644
--- a/src/components/DeleteMemberSurvey.module.css
+++ b/src/components/DeleteMemberSurvey.module.css
@@ -18,6 +18,15 @@
   margin-bottom: var(--spacing-1-point-5);
 }
 
+.disclaimer:global(.MuiTypography-root) {
+  color: var(--mui-palette-text-primary);
+}
+
+.option :global(.MuiFormControlLabel-root) {
+  margin-left: 0;
+  margin-right: 0;
+}
+
 .buttons:global(.MuiStack-root) {
   margin-top: var(--spacing-2-point-5);
 }

From ca56c588834479838d44d21912b35196770ef199 Mon Sep 17 00:00:00 2001
From: Ashley Wright <ashley.wright@mx.com>
Date: Fri, 18 Sep 2026 12:49:52 -0600
Subject: [PATCH 2/3] removed unneeded styles

---
 src/components/DeleteMemberSurvey.js         | 2 +-
 src/components/DeleteMemberSurvey.module.css | 5 -----
 2 files changed, 1 insertion(+), 6 deletions(-)

diff --git a/src/components/DeleteMemberSurvey.js b/src/components/DeleteMemberSurvey.js
index 49cfa87527..64277a5a66 100644
--- a/src/components/DeleteMemberSurvey.js
+++ b/src/components/DeleteMemberSurvey.js
@@ -157,7 +157,7 @@ export const DeleteMemberSurvey = (props) => {
                       </FormLabel>
                       <div>
                         {reasonList.map((reason, i) => (
-                          <div className={styles.option} key={reason}>
+                          <div key={reason}>
                             <SelectionBox
                               autoFocus={i === 0}
                               data-test={`selection-${reason.replace(/\s+/g, '-')}`}
diff --git a/src/components/DeleteMemberSurvey.module.css b/src/components/DeleteMemberSurvey.module.css
index b29175d362..a8fb9e939b 100644
--- a/src/components/DeleteMemberSurvey.module.css
+++ b/src/components/DeleteMemberSurvey.module.css
@@ -22,11 +22,6 @@
   color: var(--mui-palette-text-primary);
 }
 
-.option :global(.MuiFormControlLabel-root) {
-  margin-left: 0;
-  margin-right: 0;
-}
-
 .buttons:global(.MuiStack-root) {
   margin-top: var(--spacing-2-point-5);
 }

From 738627eb3690c28cd278a3f2859d7a7d0257fa07 Mon Sep 17 00:00:00 2001
From: Ashley Wright <ashley.wright@mx.com>
Date: Fri, 18 Sep 2026 12:57:50 -0600
Subject: [PATCH 3/3] removed css module and used color instead

---
 src/components/DeleteMemberSurvey.js         | 2 +-
 src/components/DeleteMemberSurvey.module.css | 4 ----
 2 files changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/components/DeleteMemberSurvey.js b/src/components/DeleteMemberSurvey.js
index 64277a5a66..c7ab8d6b66 100644
--- a/src/components/DeleteMemberSurvey.js
+++ b/src/components/DeleteMemberSurvey.js
@@ -139,7 +139,7 @@ export const DeleteMemberSurvey = (props) => {
                     <Stack spacing={2}>
                       <FormLabel id="disconnect-options-label">
                         <Text
-                          className={styles.disclaimer}
+                          color="textPrimary"
                           component="p"
                           data-test="disconnect-disclaimer"
                           truncate={false}
diff --git a/src/components/DeleteMemberSurvey.module.css b/src/components/DeleteMemberSurvey.module.css
index a8fb9e939b..ddefac5caa 100644
--- a/src/components/DeleteMemberSurvey.module.css
+++ b/src/components/DeleteMemberSurvey.module.css
@@ -18,10 +18,6 @@
   margin-bottom: var(--spacing-1-point-5);
 }
 
-.disclaimer:global(.MuiTypography-root) {
-  color: var(--mui-palette-text-primary);
-}
-
 .buttons:global(.MuiStack-root) {
   margin-top: var(--spacing-2-point-5);
 }