Mobile friendly changes for the list front view
authorLaury GvR <laury@gaslightmedia.com>
Tue, 25 Oct 2016 20:28:30 +0000 (16:28 -0400)
committerLaury GvR <laury@gaslightmedia.com>
Tue, 25 Oct 2016 20:28:30 +0000 (16:28 -0400)
For mobile size, member list front view: Remove short descriptions
and social icons. Toll Free numbers no longer wrap. Option in
management to view image or not (logo).

classes/data/settings/dataSettingsGeneral.php
css/front.css
views/admin/management/index.html
views/front/members/list.html

index b815811..aeaf2e4 100644 (file)
@@ -316,18 +316,18 @@ class GlmDataSettingsGeneral extends GlmDataAbstract
 
                 // Front-end Listings - Whether the Search/Filters box should be sticky
                 'list_floating_search' => array(
-                        'field' => 'list_floating_search',
-                        'type' => 'checkbox',
-                        'default' => false,
-                        'use' => 'a'
+                    'field' => 'list_floating_search',
+                    'type' => 'checkbox',
+                    'default' => false,
+                    'use' => 'a'
                 ),
 
                 // Front-end Listings - How far from the top the sticky Search/Filters box should hover
                 'list_floating_search_distance_top' => array(
-                        'field' => 'list_floating_search_distance_top',
-                        'type' => 'integer',
-                        'default' => 0,
-                        'use' => 'a'
+                    'field' => 'list_floating_search_distance_top',
+                    'type' => 'integer',
+                    'default' => 0,
+                    'use' => 'a'
                 ),
 
                 /*
@@ -343,16 +343,16 @@ class GlmDataSettingsGeneral extends GlmDataAbstract
 
                 // Front-end Listings - Show Logo
                 'list_show_logo' => array(
-                        'field' => 'list_show_logo',
-                        'type' => 'checkbox',
-                        'use' => 'a'
+                    'field' => 'list_show_logo',
+                    'type' => 'checkbox',
+                    'use' => 'a'
                 ),
 
                 // Front-end Listings - Show Logo for Mobile
                 'list_logo_for_mobile' => array(
-                        'field' => 'list_logo_for_mobile',
-                        'type' => 'checkbox',
-                        'use' => 'a'
+                    'field' => 'list_logo_for_mobile',
+                    'type' => 'checkbox',
+                    'use' => 'a'
                 ),
 
                 // Front-end Listings - Show Logo Filler
index 0786d26..b00a716 100644 (file)
 .glm-member-db-list-view .glm-member-list-sub-links:last-child {
 /*    text-align: right;*/
 }
+@media (max-width: 640px) {
+    .glm-member-db-list-view .glm-member-db-phone-tollfree {
+        float: left;
+        width: 100%;
+    }
+    .glm-member-db-list-view .glm-member-db-phone-tollfree::before {
+        padding-left: 0;
+    }
+    .glm-member-db-list-view .mobile-hide {
+        display: none;
+    }
+    .glm-member-db-list-view .glm-member-list-description {
+        display: none;
+    }
+    .glm-member-db-list-view .glm-member-db-socials {
+        display: none;
+    }
+}
 .glm-member-db-list .glm-member-list-listing-container {
     padding: 0 20px;
 }
index fae4d30..23b59d3 100644 (file)
                         <tr><th>Show Member Name as Link to Detail:</th><td><input type="checkbox" name="list_show_detail_link"{if $genSettings.fieldData.list_show_detail_link.value} checked="checked"{/if}></td></tr>
                         <tr><th>List Header Text:</th><td><input type="text" name="list_header_text" value="{$genSettings.fieldData.list_header_text}" class="glm-form-text-input-small" placeholder="Members List"></td></tr>
                         <tr><th>Show Member Logo:</th><td><input type="checkbox" name="list_show_logo"{if $genSettings.fieldData.list_show_logo.value} checked="checked"{/if}></td></tr>
-                        <tr><th>Show Member Logo for Mobile:</th><td><input type="checkbox" name="list_logo_for_mobile"{if $genSettings.fieldData.list_logo_for_mobile.value} checked="checked"{/if}></td></tr>
                         <tr>
                             <th {if $genSettings.fieldRequired.list_logo_size}class="glm-required"{/if}>Logo Size:</th>
                             <td {if $genSettings.fieldFail.list_logo_size}class="glm-form-bad-input glm-form-bad-input-list"{/if}>
                         <tr><th>Floating Search Distance From Top:</th><td><input type="text" pattern="[0-9]{literal}{0,4}{/literal}" name="list_floating_search_distance_top" value="{$genSettings.fieldData.list_floating_search_distance_top}" class="glm-form-numeric-input" placeholder="0" maxlength="4">px</td></tr>
                     </table>
                 </td>
+                <td>
+                    <table class="glm-admin-table">
+                        <tr><td colspan="2"><h2>Member List Mobile Options</h2></td></tr>
+                        <tr><th>Show Member Logo for Mobile:</th><td><input type="checkbox" name="list_logo_for_mobile"{if $genSettings.fieldData.list_logo_for_mobile.value} checked="checked"{/if}></td></tr>
+                    </table>
+                </td>
             </tr>
         </table>
         
index fb191d8..a2b8d1d 100644 (file)
 
                     <div class="glm-member-list-data small-12 columns">
                     {if $member.logo && $settings.list_show_logo}
-                        <div class="glm-member-list-image-wrapper right small-12 medium-4 columns">
+                        <div class="glm-member-list-image-wrapper right small-12 medium-4 columns {if !$settings.list_logo_for_mobile}mobile-hide{/if}">
                             <div class="glm-member-list-image-border">
                                 <img src="{$glmPluginMediaUrl}/images/{$settings.list_logo_size}/{$member.logo}">
                             </div>