8821-refactor-file-selection-components-to-test-1772140792

web-client/src/views/PetitionQc/PetitionQc.tsx

@@ -10,7 +10,7 @@ export const PetitionQc = connect({}, function PetitionQc() {
   return (
     <>
       <CaseDetailHeader />
-      <section className="DocumentDetail tw:max-w-[1440px] tw:mx-auto tw:px-4">
+      <section className="usa-section grid-container DocumentDetail">
         <h2
           className="tw:mt-0 tw:mb-4 tw:text-xxxl tw:font-bold"
           data-testid="petition-qc-page-heading"
@@ -19,12 +19,12 @@ export const PetitionQc = connect({}, function PetitionQc() {
         </h2>
         <SuccessNotification />
         <ErrorNotification />
-        <div className="tw:max-w-[1440px] tw:mx-auto tw:px-0">
-          <div className="tw:flex tw:flex-row tw:gap-4">
-            <div className="tw:flex-5 tw:min-w-0">
+        <div className="grid-container padding-x-0">
+          <div className="grid-row grid-gap">
+            <div className="grid-col-5">
               <CaseDetailEdit />
             </div>
-            <div className="tw:flex-7 tw:min-w-0">
+            <div className="grid-col-7">
               <PetitionQcDocumentPreview title="Add Document(s)" />
             </div>
           </div>