Adding mobile responsive table support to UC People

weblab · Mar 3, 2016 · 50164fb · 50164fb
1 parent 281e17c
commit 50164fb
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 2 deletions.
diff --git a/inc/people-table.php b/inc/people-table.php
@@ -8,7 +8,8 @@ if ( $the_query->have_posts() ) {
 	//var_dump($num_cols);
 
 	?>
-	<table class="table table-striped">
+<div class="table-responsive">
+    <table class="table table-striped">
 		<legend class="sr-only">List of People</legend>
 		<thead>
 			<tr>
@@ -138,7 +139,7 @@ if ( $the_query->have_posts() ) {
 			} //end of posts?>
 		</tbody>
 	</table>
-
+</div>
 	<?php
 } else {
 	// no posts found

diff --git a/sass/_ucpeople.scss b/sass/_ucpeople.scss
@@ -11,4 +11,14 @@
 		min-height:100%;
 	}
 	*/
+}
+
+.uc-people {
+    table {
+        img {
+            @media (max-width:767px) {
+                max-width:none;
+            }
+        }
+    }
 }
diff --git a/style.css b/style.css
@@ -9842,6 +9842,12 @@ q:before, table q:after {
   */
 }
 
+@media (max-width: 767px) {
+  .uc-people table img {
+    max-width: none;
+  }
+}
+
 /* - - - - - - - - - - - - - - - - - - - 
 	== Calendar 
 - - - - - - - - - - - - - - - - - - - */