Featured member list now responsive with only 1 or 2 items on a row

diff --git a/css/front.css b/css/front.css
index 5a8dcac..f792401 100644 (file)
--- a/css/front.css
+++ b/css/front.css
@@ -1125,10 +1125,29 @@ glm-member-detail-content-toggle {
 /* Featured Grid Start */
 #featured-grid {
     list-style: none;
+    overflow: hidden;
+    text-align: center;
 }
 #featured-grid .featured-grid-item-wrapper {
     padding: 10px;
     list-style: none;
+    display: inline-block;
+    float: none;
+    vertical-align: top;
+    width: 33%;
+}
+@media (max-width: 1024px) {
+    #featured-grid .featured-grid-item-wrapper {
+        width: 48%;
+    }
+}
+@media (max-width: 640px) {
+    #featured-grid .featured-grid-item-wrapper {
+        width: 100%;
+        max-width: 320px;
+        float: none;
+        margin: 0 auto;
+    }
 }
 #featured-grid .featured-grid-item {
     border: 1px solid lightgrey;

diff --git a/views/front/members/list.html b/views/front/members/list.html
index 270b95d..f3230f4 100755 (executable)
--- a/views/front/members/list.html
+++ b/views/front/members/list.html
@@ -205,7 +205,7 @@
             
             <h3>Featured {$terms.term_member_plur_cap}</h3>
             
-            <ul id="featured-grid" class="small-block-grid-1 medium-block-grid-2 large-block-grid-3">
+            <ul id="featured-grid" class="">
                 {foreach $featuredMembers as $fm}
                     <li class="featured-grid-item-wrapper">
                         {if $settings.list_show_detail_link && !$fm.has_no_profile.value}