Merge pull request #92 from dod-ccpo/ui/responsive-tables

Assorted table and layout fixes

scss/components/_global_navigation.scss

@@ -4,7 +4,7 @@
   .sidenav__link {
     padding-right: $gap;
 
-    @include media($medium-screen) {
+    @include media($large-screen) {
       padding-right: $gap * 2;
     }
   }
@@ -12,7 +12,7 @@
   .sidenav__link-label {
     @include hide;
 
-    @include media($medium-screen) {
+    @include media($large-screen) {
       @include unhide;
       padding-left: $gap;
     }

scss/components/_layout.scss

@@ -26,7 +26,7 @@ body {
   .global-panel-container {
     margin: $gap;
     max-width: $site-max-width;
-    overflow: auto;
+    overflow-x: hidden;
 
     @include media($medium-screen) {
       margin: $gap * 2;

scss/elements/_tables.scss

@@ -39,5 +39,42 @@
     .table-cell--expand {
       width: 100%;
     }
+
+    .table-cell--hide-small {
+      display: none;
+
+      @include media($medium-screen) {
+        display: table-cell;
+      }
+    }
+  }
+
+  @at-root .panel #{&} {
+    tr:last-child td {
+      border-bottom: 0;
+    }
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.responsive-table-wrapper {
+  overflow-x: auto;
+  @include panel-margin;
+
+  table {
+    margin-bottom: 0;
+  }
+
+  @at-root .panel #{&} {
+    tr:last-child td {
+      border-bottom: 0;
+    }
+
+    &:last-child {
+      margin-bottom: 0;
+    }
   }
 }