Merge pull request #251 from adhocteam/dcloud/394-print-fixes

Fix layout stacking on print styles
HHS · Mar 17, 2021 · 576adbf · 576adbf
2 parents dd9b1aa + dc58237
commit 576adbf
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/frontend/src/App.css b/frontend/src/App.css
@@ -105,6 +105,11 @@ body {
     width: 100%;
   }
 
+  .print\:grid-col-6 {
+    flex: 0 1 auto;
+    width: 50%;
+  }
+
   .usa-header {
     background: #fff !important;
   }

diff --git a/frontend/src/pages/ActivityReport/Pages/Review/ReviewItem.js b/frontend/src/pages/ActivityReport/Pages/Review/ReviewItem.js
@@ -21,10 +21,10 @@ const ReviewItem = ({ label, name, path }) => {
 
   return (
     <div className={`grid-row ${classes} margin-bottom-3 desktop:margin-bottom-0`}>
-      <div className="grid-col-12 desktop:grid-col-6 font-sans-2xs desktop:font-sans-sm text-bold desktop:text-normal">
+      <div className="grid-col-12 desktop:grid-col-6 print:grid-col-6  font-sans-2xs desktop:font-sans-sm text-bold desktop:text-normal">
         {label}
       </div>
-      <div className="grid-col-12 desktop:grid-col-6">
+      <div className="grid-col-12 desktop:grid-col-6 print:grid-col-6">
         {values.map((v, index) => (
           <div aria-label={`${label} ${index + 1}`} key={`${label}${v}`} col={12} className="desktop:flex-align-end display-flex flex-column flex-justify-center">
             {Number.isNaN(v) ? '' : v}