Add support for `tr`, `th`, and `td` to responsive utilities

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index d9d6e555d7d07482313980692b93c928c59be34d..d00b27b8e41a1c5c10db8d595c225a7da8513b0c 100644 (file)
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -5167,6 +5167,15 @@ a.list-group-item.active > .badge,
   display: block !important;
 }
 
+tr.visible-sm {
+  display: table-row !important;
+}
+
+th.visible-sm,
+td.visible-sm {
+  display: table-cell !important;
+}
+
 .visible-md {
   display: none !important;
 }
@@ -5183,10 +5192,28 @@ a.list-group-item.active > .badge,
   display: block !important;
 }
 
+tr.hidden-md {
+  display: table-row !important;
+}
+
+th.hidden-md,
+td.hidden-md {
+  display: table-cell !important;
+}
+
 .hidden-lg {
   display: block !important;
 }
 
+tr.hidden-lg {
+  display: table-row !important;
+}
+
+th.hidden-lg,
+td.hidden-lg {
+  display: table-cell !important;
+}
+
 @media (min-width: 768px) and (max-width: 991px) {
   .visible-sm {
     display: none !important;
@@ -5194,18 +5221,39 @@ a.list-group-item.active > .badge,
   .visible-md {
     display: block !important;
   }
+  tr.visible-md {
+    display: table-row !important;
+  }
+  th.visible-md,
+  td.visible-md {
+    display: table-cell !important;
+  }
   .visible-lg {
     display: none !important;
   }
   .hidden-sm {
     display: block !important;
   }
+  tr.hidden-sm {
+    display: table-row !important;
+  }
+  th.hidden-sm,
+  td.hidden-sm {
+    display: table-cell !important;
+  }
   .hidden-md {
     display: none !important;
   }
   .hidden-lg {
     display: block !important;
   }
+  tr.hidden-lg {
+    display: table-row !important;
+  }
+  th.hidden-lg,
+  td.hidden-lg {
+    display: table-cell !important;
+  }
 }
 
 @media (min-width: 992px) {
@@ -5218,12 +5266,33 @@ a.list-group-item.active > .badge,
   .visible-lg {
     display: block !important;
   }
+  tr.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-lg,
+  td.visible-lg {
+    display: table-cell !important;
+  }
   .hidden-sm {
     display: block !important;
   }
+  tr.hidden-sm {
+    display: table-row !important;
+  }
+  th.hidden-sm,
+  td.hidden-sm {
+    display: table-cell !important;
+  }
   .hidden-md {
     display: block !important;
   }
+  tr.hidden-md {
+    display: table-row !important;
+  }
+  th.hidden-md,
+  td.hidden-md {
+    display: table-cell !important;
+  }
   .hidden-lg {
     display: none !important;
   }
@@ -5237,6 +5306,13 @@ a.list-group-item.active > .badge,
   .visible-print {
     display: block !important;
   }
+  tr.visible-print {
+    display: table-row !important;
+  }
+  th.visible-print,
+  td.visible-print {
+    display: table-cell !important;
+  }
   .hidden-print {
     display: none !important;
   }

diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less
index f319298f00e2d8e103a587bd4d3b658e1cf1a9b9..082109e5e8fc86c771d02961e7a81bcba2dae10b 100644 (file)
--- a/less/responsive-utilities.less
+++ b/less/responsive-utilities.less
@@ -36,42 +36,92 @@
 // Visibility utilities
 
 // For Phones
-.visible-sm   { display: block !important; }
-.visible-md   { display: none !important; }
-.visible-lg   { display: none !important; }
+.visible-sm   {
+  display: block !important;
+  tr& { display: table-row !important; }
+  th&,
+  td& { display: table-cell !important; }
+}
+.visible-md { display: none !important; }
+.visible-lg { display: none !important; }
 
-.hidden-sm    { display: none !important; }
-.hidden-md    { display: block !important; }
-.hidden-lg    { display: block !important; }
+.hidden-sm { display: none !important; }
+.hidden-md {
+  display: block !important;
+  tr& { display: table-row !important; }
+  th&,
+  td& { display: table-cell !important; }
+}
+.hidden-lg {
+  display: block !important;
+  tr& { display: table-row !important; }
+  th&,
+  td& { display: table-cell !important; }
+}
 
 
 // Tablets & small desktops only
 @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
-  .visible-sm   { display: none !important; }
-  .visible-md   { display: block !important; }
-  .visible-lg   { display: none !important; }
+  .visible-sm { display: none !important; }
+  .visible-md {
+    display: block !important;
+    tr& { display: table-row !important; }
+    th&,
+    td& { display: table-cell !important; }
+  }
+  .visible-lg { display: none !important; }
 
-  .hidden-sm    { display: block !important; }
-  .hidden-md    { display: none !important; }
-  .hidden-lg    { display: block !important; }
+  .hidden-sm {
+    display: block !important;
+    tr& { display: table-row !important; }
+    th&,
+    td& { display: table-cell !important; }
+  }
+  .hidden-md { display: none !important; }
+  .hidden-lg {
+    display: block !important;
+    tr& { display: table-row !important; }
+    th&,
+    td& { display: table-cell !important; }
+  }
 }
 
 // For desktops
 @media (min-width: @screen-desktop) {
-  .visible-sm   { display: none !important; }
-  .visible-md   { display: none !important; }
-  .visible-lg   { display: block !important; }
+  .visible-sm { display: none !important; }
+  .visible-md { display: none !important; }
+  .visible-lg {
+    display: block !important;
+    tr& { display: table-row !important; }
+    th&,
+    td& { display: table-cell !important; }
+  }
 
-  .hidden-sm    { display: block !important; }
-  .hidden-md    { display: block !important; }
-  .hidden-lg    { display: none !important; }
+  .hidden-sm {
+    display: block !important;
+    tr& { display: table-row !important; }
+    th&,
+    td& { display: table-cell !important; }
+  }
+  .hidden-md {
+    display: block !important;
+    tr& { display: table-row !important; }
+    th&,
+    td& { display: table-cell !important; }
+  }
+  .hidden-lg { display: none !important; }
 }
 
 // Print utilities
-.visible-print  { display: none !important; }
-.hidden-print   { }
+.visible-print { display: none !important; }
+.hidden-print  { }
 
 @media print {
-  .visible-print  { display: block !important; }
-  .hidden-print   { display: none !important; }
+  .visible-print {
+    display: block !important;
+    tr& { display: table-row !important; }
+    th&,
+    td& { display: table-cell !important; }
+  }
+  .hidden-print { display: none !important; }
 }