Jump to content

Hiding blocks on mobile.


pilotguy

Recommended Posts

Ok so I've read a few posts regarding hiding blocks when viewed on smaller devices.  They talk about this "hidden mobile class" but no where have I found the actual code and a decent explanation on where to place it. 

Can anyone help?

Link to comment
Share on other sites

I'm trying to apply this hide code to a videos widget I have.  It doesn't seem to change anything.  I can still see the block on my phone.  Here's the code I added to the widget template:

{{if $orientation == 'vertical'}}
    <h3 class='ipsWidget_title ipsType_reset'>{{if $widgetTitle}}{$widgetTitle}{{else}}{{if $orderField == 'last_updated'}}{lang="block_videosVideos_last_updated"}{{elseif $orderField == 'video_rating'}}{lang="block_videosVideos_top_rated"}{{else}}{lang="block_videosVideos_latest_videos"}{{endif}}{{endif}}</h3>
    <div class='ipsWidget_inner'>
       	<div class='ipsPad_half'>
          <div class='ipsResponsive_hidePhone'>
            {{if count( $videos )}}
                <ul class='ipsDataList ipsDataList_reducedSpacing'>
    				{{foreach $videos as $row}}
    					<li class='ipsDataItem'>
    						<div class='ipsDataItem_icon ipsPos_top'>
                                {template="thumb" group="global" app="videos" params="$row, 'tiny'"}
    						</div>
    						<div class='ipsDataItem_main'>
                                {{if settings.vs_enable_comments AND member.group['g_vs_view_comments']}}
                                    <div class="ipsCommentCount ipsPos_right {{if ( $row->num_comments ) === 0}}ipsFaded{{endif}}" data-ipsTooltip title='{lang="num_video_comments" pluralize="$row->num_comments"}'>{expression="$row->num_comments"}</div>
                                {{endif}}
    
    							<a href="{$row->url()}" class='ipsDataItem_title ipsType_break'>{wordbreak="$row->title"}</a>
                                {{if $orderField == 'video_rating' AND $row->averageRating()}}<br>{template="rating" app="core" params="'small', $row->averageRating()" group="global"}{{endif}}<br>
    							<span class='ipsType_light ipsType_small'>{lang="videos_by"}: {$row->author()->link()|raw} &middot; {datetime="( $orderField == 'last_updated' AND $row->last_updated ) ? $row->last_updated : $row->date" dateonly="true"}</span>
    						</div>
    					</li>
    				{{endforeach}}
     				<li class='ipsDataItem'>
    					<div class='ipsDataItem_main ipsType_small ipsType_light ipsType_center'>
                            <a {{if $orderField == 'date'}}href='{url="app=videos&module=videos&controller=browse&do=listall" seoTemplate="videos_listall"}{{else}}href='{url="app=videos&module=videos&controller=browse&do=listall&sortby={$orderField}&sortdirection=desc" seoTemplate="videos_listall"}{{endif}}'>{lang="view_all_videos"}</a>
    					</div>
    				</li>                    
                </ul>
    		{{else}}
    			<p class='ipsType_reset'>{lang="no_new_videos"}</p>
    		{{endif}}                    
    	</div>
    </div>    
{{else}}
    <h3 class='ipsWidget_title ipsType_reset'>{{if $widgetTitle}}{$widgetTitle}{{else}}{{if $orderField == 'last_updated'}}{lang="block_videosVideos_last_updated"}{{elseif $orderField == 'video_rating'}}{lang="block_videosVideos_top_rated"}{{else}}{lang="block_videosVideos_latest_videos"}{{endif}}{{endif}}</h3>
    <div class='ipsWidget_inner'>
		{{if count( $videos )}}
			<ul class='ipsGrid ipsGrid_collapsePhone ipsWidget_columns'>
				{{foreach $videos as $idx => $row}}
                    <li class='ipsGrid_span3 ipsType_center ipsType_blendLinks ipsClearfix ipsPad_half' style='min-width: 150px;'>
                    	{template="thumb" group="global" app="videos" params="$row"}
                		<div class='ipsSpacer_top ipsSpacer_half'>
                			<h3 class='ipsType_normal ipsType_reset ipsTruncate ipsTruncate_line' data-ipsTruncate data-ipsTruncate-size='1 lines' data-ipsTruncate-type='remove'>
                                <a href='{$row->url()}' title='{lang="view_this" sprintf="$row->title"}'>{$row->title}</a>
                			</h3>
                			<span class='ipsType_light ipsType_small'>{lang="videos_by"}: {$row->author()->link()|raw} &middot; {datetime="$row->date" dateonly="true"}</span>                 		
                        </div>
                    </li>
				{{endforeach}}
			</ul>
		{{else}}
			<p class='ipsType_reset'>{lang="no_new_videos"}</p>
		{{endif}}
    </div>
{{endif}}

 

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...