Do what the comment says; add this only to devices under 768px

diff --git a/scss/_tables.scss b/scss/_tables.scss
index d5148810f499f32ed04a2ee395e6b9417f94c166..c34bb2bef61eec4b3a7266de77a42e6f6e6d60de 100644 (file)
--- a/scss/_tables.scss
+++ b/scss/_tables.scss
@@ -142,13 +142,15 @@
 // will display normally.
 
 .table-responsive {
-  display: block;
-  width: 100%;
-  overflow-x: auto;
-  -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
-
-  // Prevent double border on horizontal scroll due to use of `display: block;`
-  &.table-bordered {
-    border: 0;
+  @include media-breakpoint-down(md) {
+    display: block;
+    width: 100%;
+    overflow-x: auto;
+    -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
+
+    // Prevent double border on horizontal scroll due to use of `display: block;`
+    &.table-bordered {
+      border: 0;
+    }
   }
 }