Merge pull request #13955 from transcom/B-21077-Align-Button-Add

B-21077 Adding back from align PR and mobile home dimensions example
transcom · Oct 18, 2024 · 491fd52 · 491fd52
2 parents e5b5570 + 155a430
commit 491fd52
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 34 deletions.
diff --git a/src/components/Customer/MobileHomeShipment/MobileHomeShipmentForm/MobileHomeShipmentForm.jsx b/src/components/Customer/MobileHomeShipment/MobileHomeShipmentForm/MobileHomeShipmentForm.jsx
@@ -271,8 +271,8 @@ const MobileHomeShipmentForm = ({ mtoShipment, onBack, onSubmit }) => {
                     Example
                     <ul>
                       <li>
-                        Dimensions of the mobile home on the trailer are significantly different than one would expect
-                        given their individual dimensions
+                        Is there additional information you feel is pertinent to the processing of your mobile home
+                        shipment?(e.g., &lsquo;wrecker service requested&rsquo; and &lsquo;crane service needed&rsquo;).
                       </li>
                     </ul>
                   </Callout>

diff --git a/src/components/Office/RequestedShipments/ApprovedRequestedShipments.jsx b/src/components/Office/RequestedShipments/ApprovedRequestedShipments.jsx
@@ -113,22 +113,24 @@ const ApprovedRequestedShipments = ({
 
   return (
     <div className={styles.RequestedShipments} data-testid="requested-shipments">
-      <h2>Approved Shipments</h2>
-      <div className={styles.dropdownButton}>
-        {!isMoveLocked && (
-          <Restricted to={permissionTypes.createTxoShipment}>
-            <ButtonDropdown
-              ariaLabel="Add a new shipment"
-              data-testid="addShipmentButton"
-              onChange={handleButtonDropdownChange}
-            >
-              <option value="" label="Add a new shipment">
-                Add a new shipment
-              </option>
-              {allowedShipmentOptions()}
-            </ButtonDropdown>
-          </Restricted>
-        )}
+      <div className={styles.sectionHeader}>
+        <h2>Approved Shipments</h2>
+        <div className={styles.buttonDropdown}>
+          {!isMoveLocked && (
+            <Restricted to={permissionTypes.createTxoShipment}>
+              <ButtonDropdown
+                ariaLabel="Add a new shipment"
+                data-testid="addShipmentButton"
+                onChange={handleButtonDropdownChange}
+              >
+                <option value="" label="Add a new shipment">
+                  Add a new shipment
+                </option>
+                {allowedShipmentOptions()}
+              </ButtonDropdown>
+            </Restricted>
+          )}
+        </div>
       </div>
 
       <div className={shipmentCardsStyles.shipmentCards}>

diff --git a/src/components/Office/RequestedShipments/SubmittedRequestedShipments.jsx b/src/components/Office/RequestedShipments/SubmittedRequestedShipments.jsx
@@ -249,22 +249,24 @@ const SubmittedRequestedShipments = ({
       </div>
 
       <form onSubmit={formik.handleSubmit}>
-        <h2>Requested shipments</h2>
-        <div className={styles.dropdownButton}>
-          {!isMoveLocked && (
-            <Restricted to={permissionTypes.createTxoShipment}>
-              <ButtonDropdown
-                ariaLabel="Add a new shipment"
-                data-testid="addShipmentButton"
-                onChange={handleButtonDropdownChange}
-              >
-                <option value="" label="Add a new shipment">
-                  Add a new shipment
-                </option>
-                {allowedShipmentOptions()}
-              </ButtonDropdown>
-            </Restricted>
-          )}
+        <div className={styles.sectionHeader}>
+          <h2>Requested shipments</h2>
+          <div className={styles.buttonDropdown}>
+            {!isMoveLocked && (
+              <Restricted to={permissionTypes.createTxoShipment}>
+                <ButtonDropdown
+                  ariaLabel="Add a new shipment"
+                  data-testid="addShipmentButton"
+                  onChange={handleButtonDropdownChange}
+                >
+                  <option value="" label="Add a new shipment">
+                    Add a new shipment
+                  </option>
+                  {allowedShipmentOptions()}
+                </ButtonDropdown>
+              </Restricted>
+            )}
+          </div>
         </div>
         <div className={shipmentCardsStyles.shipmentCards}>
           {mtoShipments &&