Merge pull request #111 from fedspendingtransparency/mod/dev-4569-tab…

…le-update [dev-4569] design feedback update information boxes styling
fedspendingtransparency · Sep 24, 2021 · e53cdb0 · e53cdb0
2 parents 3ad0973 + 0c2d858
commit e53cdb0
Show file tree

Hide file tree

Showing 8 changed files with 18 additions and 9 deletions.
diff --git a/dist/data-transparency-ui.css b/dist/data-transparency-ui.css
diff --git a/docs/iframe.html b/docs/iframe.html
@@ -124,7 +124,7 @@
         /* eslint-enable object-shorthand */
       })
     );
-  };</script><link href="main.db238a233c5ce2e87037.css" rel="stylesheet"><style>#root[hidden],
+  };</script><link href="main.a67f2b147d0509e6e47b.css" rel="stylesheet"><style>#root[hidden],
       #docs-root[hidden] {
         display: none !important;
       }</style></head><body><div class="sb-nopreview sb-wrapper"><div class="sb-nopreview_main"><h1 class="sb-nopreview_heading sb-heading">No Preview</h1><p>Sorry, but you either have no stories or none are selected somehow.</p><ul><li>Please check the Storybook config.</li><li>Try reloading the page.</li></ul><p>If the problem persists, check the browser console, or the terminal you've run Storybook from.</p></div></div><div class="sb-errordisplay sb-wrapper"><pre id="error-message" class="sb-heading"></pre><pre class="sb-errordisplay_code"><code id="error-stack"></code></pre></div><div id="root"></div><div id="docs-root"></div><script>window['LOGLEVEL'] = "info";
@@ -135,4 +135,4 @@
 
 
 
-              window['FEATURES'] = {"postcss":true};</script><script src="runtime~main.59759fef.iframe.bundle.js"></script><script src="vendors~main.a577f1ef.iframe.bundle.js"></script><script src="main.fee21d2c.iframe.bundle.js"></script></body></html>
+              window['FEATURES'] = {"postcss":true};</script><script src="runtime~main.59759fef.iframe.bundle.js"></script><script src="vendors~main.a577f1ef.iframe.bundle.js"></script><script src="main.60e17744.iframe.bundle.js"></script></body></html>
diff --git a/docs/main.60e17744.iframe.bundle.js b/docs/main.60e17744.iframe.bundle.js
diff --git a/docs/main.db238a233c5ce2e87037.css → docs/main.a67f2b147d0509e6e47b.css b/docs/main.db238a233c5ce2e87037.css → docs/main.a67f2b147d0509e6e47b.css
diff --git a/docs/main.db238a233c5ce2e87037.css.map → docs/main.a67f2b147d0509e6e47b.css.map b/docs/main.db238a233c5ce2e87037.css.map → docs/main.a67f2b147d0509e6e47b.css.map
diff --git a/docs/main.fee21d2c.iframe.bundle.js b/docs/main.fee21d2c.iframe.bundle.js
diff --git a/styles/components/_informationBoxes.scss b/styles/components/_informationBoxes.scss
@@ -102,10 +102,13 @@
     }
   }
   &.three-boxes {
+    border-bottom: none;
+    padding-bottom: 0;
     .usa-dt-information-box {
       .usa-dt-information-box__divider {
         padding: rem(4) rem(12) rem(4) rem(12);
         .usa-dt-information-box__content {
+          padding-top: rem(24);
           .usa-dt-information-box__amount {
             white-space: nowrap;
             font-size: rem(16);

diff --git a/styles/components/table/_table.scss b/styles/components/table/_table.scss
@@ -41,6 +41,8 @@ table.usda-table {
                     margin-right: rem(8);
                 }
                 td.usda-table__cell {
+                    text-align: right;
+                    padding-right: rem(35);
                     .usda-table__expandable-cell-content {
                         display: flex;
                         align-items: flex-start;
@@ -49,6 +51,7 @@ table.usda-table {
                 td.usda-table__cell_name {
                     // add extra padding when no arrow is present because there are no children
                     padding-left: rem(30);
+                    text-align: left;
                 }
             }
             .table-header_body-header {
@@ -76,13 +79,16 @@ table.usda-table {
                     padding: 0;
                     .usda-table__child-cell-content {
                         padding: rem(10) rem(15);
+                        margin-right: rem(20);
+                        text-align: right;
                     }
                     &:first-of-type {
                         // add extra padding to the first cell of every child row
                         padding-left: rem(20);
                         .usda-table__child-cell-content {
                             padding-left: rem(30);
                             border-left: solid rem(1) $color-gray-light;
+                            text-align: left;
                         }
                     }
                 }