[responsive/portal] Make compact announcements module block responsive

This commit is contained in:
Marc Alexander
2013-12-02 14:13:11 +01:00
parent f164d2e901
commit 3dc7e79cfd
4 changed files with 59 additions and 31 deletions

View File

@@ -1,4 +1,4 @@
<!-- IF T_EXT_THEME_PATH -->
<!-- INCLUDECSS ../theme/portal.css -->
<link href="{T_EXT_THEME_PATH}responsive.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 950px), only screen and (max-device-width: 950px)" />
<link href="{T_EXT_THEME_PATH}responsive.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 980px), only screen and (max-device-width: 980px)" />
<!-- ENDIF -->

View File

@@ -10,32 +10,41 @@
<!-- ELSE -->
<!-- IF announcements_center_row.S_FIRST_ROW -->
{$CC_BLOCK_H_L}
<dt id="a" <!-- IF S_DISPLAY_ANNOUNCEMENTS_RVS -->style="width: 44%"<!-- ELSE -->style="width: 60%"<!-- ENDIF -->>{$TITLE}</dt>
<dt id="a">{$TITLE}</dt>
<!-- IF S_DISPLAY_ANNOUNCEMENTS_RVS -->
<dd class="posts" style="width: 11%">{L_REPLIES}</dd>
<dd class="views" style="width: 11%">{L_VIEWS}</dd>
<dd class="posts responsive-portal-announcements">{L_REPLIES}</dd>
<dd class="views responsive-portal-announcements">{L_VIEWS}</dd>
<!-- ENDIF -->
<dd class="lastpost" style="width: 25%"><span>{L_LAST_POST}</span></dd>
<dd class="lastpost responsive-portal-announcements"><span>{L_LAST_POST}</span></dd>
{$CC_BLOCK_H_R}
<ul class="topiclist topics">
<ul class="topiclist topics responsive-portal-announcements">
<!-- ENDIF -->
<li class="row<!-- IF announcements_center_row.S_ROW_COUNT is even --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">
<dl class="icon" style="background-image: url({announcements_center_row.TOPIC_FOLDER_IMG_SRC}); background-repeat: no-repeat;">
<dt style="<!-- IF S_DISPLAY_ANNOUNCEMENTS_RVS -->width: 44%;<!-- ELSE -->width: 60%;<!-- ENDIF --> <!-- IF announcements_center_row.TOPIC_ICON_IMG -->background-image: url({T_ICONS_PATH}{announcements_center_row.TOPIC_ICON_IMG}); background-repeat: no-repeat;<!-- ENDIF -->" title="{announcements_center_row.TOPIC_FOLDER_IMG_ALT}"><!-- IF announcements_center_row.S_UNREAD_TOPIC --><a href="{announcements_center_row.U_NEWEST_POST}">{NEWEST_POST_IMG}</a> <!-- ENDIF --><!-- IF announcements_center_row.ATTACH_ICON_IMG -->{announcements_center_row.ATTACH_ICON_IMG} <!-- ENDIF --><!-- IF announcements_center_row.S_POLL --><strong>{L_VIEW_TOPIC_POLL}</strong><!-- ENDIF --><a href="{announcements_center_row.U_VIEW_COMMENTS}" title="{announcements_center_row.TITLE}" class="topictitle">{announcements_center_row.TITLE}</a><!-- IF U_VIEW_UNREAD_POST and not S_IS_BOT --> &bull; <a href="{U_VIEW_UNREAD_POST}">{L_VIEW_UNREAD_POST}</a> &bull; <!-- ENDIF -->
<!-- IF announcements_center_row.PAGINATION --><strong class="pagination"><span>{announcements_center_row.PAGINATION}</span></strong><!-- ENDIF -->
<br />{L_POSTED} {L_POST_BY_AUTHOR} {announcements_center_row.POSTER_FULL} &raquo; {announcements_center_row.TIME}
<!-- IF announcements_center_row.FORUM_NAME -->
<br />{L_FORUM}: <a href="{announcements_center_row.U_VIEWFORUM}" style="font-weight: bold;">{announcements_center_row.FORUM_NAME}</a>
<!-- ELSE -->
<br />{L_GLOBAL_ANNOUNCEMENT}
<dl class="icon {announcements_center_row.TOPIC_IMG_STYLE}">
<dt style="<!-- IF announcements_center_row.TOPIC_ICON_IMG -->background-image: url({T_ICONS_PATH}{announcements_center_row.TOPIC_ICON_IMG}); background-repeat: no-repeat;<!-- ENDIF -->" title="{announcements_center_row.TOPIC_FOLDER_IMG_ALT}">
<!-- IF announcements_center_row.S_UNREAD_TOPIC -->
<a href="{announcements_center_row.U_NEWEST_POST}">{NEWEST_POST_IMG}</a>
<!-- ENDIF -->
<!-- IF not S_DISPLAY_ANNOUNCEMENTS_RVS --><!-- IF announcements_center_row.FORUM_NAME -->&bull; <!-- ENDIF -->{L_REPLIES}: <strong>{announcements_center_row.REPLIES}</strong> &bull; {L_VIEWS}: <strong>{announcements_center_row.TOPIC_VIEWS}</strong><!-- ENDIF -->
<div class="list-inner">
<!-- IF announcements_center_row.ATTACH_ICON_IMG -->{announcements_center_row.ATTACH_ICON_IMG} <!-- ENDIF -->
<!-- IF announcements_center_row.S_POLL --><strong>{L_VIEW_TOPIC_POLL}</strong><!-- ENDIF -->
<a href="{announcements_center_row.U_VIEW_COMMENTS}" title="{announcements_center_row.TITLE}" class="topictitle">{announcements_center_row.TITLE}</a>
<!-- IF U_VIEW_UNREAD_POST and not S_IS_BOT --> &bull; <a href="{U_VIEW_UNREAD_POST}">{L_VIEW_UNREAD_POST}</a> &bull; <!-- ENDIF -->
<!-- IF announcements_center_row.PAGINATION --><strong class="pagination"><span>{announcements_center_row.PAGINATION}</span></strong><!-- ENDIF -->
<br />{L_POSTED} {L_POST_BY_AUTHOR} {announcements_center_row.POSTER_FULL} &raquo; {announcements_center_row.TIME}
<!-- IF announcements_center_row.FORUM_NAME -->
<br />{L_FORUM}: <a href="{announcements_center_row.U_VIEWFORUM}" style="font-weight: bold;">{announcements_center_row.FORUM_NAME}</a>
<!-- ELSE -->
<br />{L_GLOBAL_ANNOUNCEMENT}
<!-- ENDIF -->
<!-- IF not S_DISPLAY_ANNOUNCEMENTS_RVS --><!-- IF announcements_center_row.FORUM_NAME -->&bull; <!-- ENDIF -->{L_REPLIES}: <strong>{announcements_center_row.REPLIES}</strong> &bull; {L_VIEWS}: <strong>{announcements_center_row.TOPIC_VIEWS}</strong><!-- ENDIF -->
</div>
</dt>
<!-- IF S_DISPLAY_ANNOUNCEMENTS_RVS -->
<dd class="posts" style="width: 11%">{announcements_center_row.REPLIES} <dfn>{L_REPLIES}</dfn></dd>
<dd class="views" style="width: 11%">{announcements_center_row.TOPIC_VIEWS} <dfn>{L_VIEWS}</dfn></dd>
<dd class="posts">{announcements_center_row.REPLIES} <dfn>{L_REPLIES}</dfn></dd>
<dd class="views">{announcements_center_row.TOPIC_VIEWS} <dfn>{L_VIEWS}</dfn></dd>
<!-- ENDIF -->
<dd class="lastpost" style="width: 25%"><span><dfn>{L_LAST_POST}</dfn>{L_POST_BY_AUTHOR} {announcements_center_row.USERNAME_FULL_LAST} <!-- IF announcements_center_row.S_UNREAD_INFO --><a href="{announcements_center_row.U_VIEW_UNREAD}">{NEWEST_POST_IMG}</a><!-- ELSE --><a href="{announcements_center_row.U_LAST_COMMENTS}">{READ_POST_IMG}</a><!-- ENDIF --><br />
<dd class="lastpost"><span><dfn>{L_LAST_POST}</dfn>{L_POST_BY_AUTHOR} {announcements_center_row.USERNAME_FULL_LAST} <!-- IF announcements_center_row.S_UNREAD_INFO --><a href="{announcements_center_row.U_VIEW_UNREAD}">{NEWEST_POST_IMG}</a><!-- ELSE --><a href="{announcements_center_row.U_LAST_COMMENTS}">{READ_POST_IMG}</a><!-- ENDIF --><br />
{announcements_center_row.LAST_POST_TIME}</span>
</dd>
</dl>

View File

@@ -12,8 +12,8 @@
{$CC_BLOCK_H_L}
<dt id="n">{$TITLE}</dt>
<!-- IF S_DISPLAY_NEWS_RVS -->
<dd class="posts responsive-portal-news" data-skip-responsive="true">{L_REPLIES}</dd>
<dd class="views responsive-portal-news" data-skip-responsive="true">{L_VIEWS}</dd>
<dd class="posts responsive-portal-news">{L_REPLIES}</dd>
<dd class="views responsive-portal-news">{L_VIEWS}</dd>
<!-- ENDIF -->
<dd class="lastpost responsive-portal-news"><span>{L_LAST_POST}</span></dd>
{$CC_BLOCK_H_R}
@@ -25,8 +25,8 @@
<!-- IF news_row.S_UNREAD_TOPIC -->
<a href="{news_row.U_NEWEST_POST}">{NEWEST_POST_IMG}</a>
<!-- ENDIF -->
<!-- IF news_row.ATTACH_ICON_IMG -->{news_row.ATTACH_ICON_IMG} <!-- ENDIF -->
<div class="list-inner">
<!-- IF news_row.ATTACH_ICON_IMG -->{news_row.ATTACH_ICON_IMG} <!-- ENDIF -->
<a href="{news_row.U_VIEW_COMMENTS}" title="{news_row.TITLE}" class="topictitle">{news_row.TITLE}</a><!-- IF U_VIEW_UNREAD_POST and not S_IS_BOT --> &bull; <a href="{U_VIEW_UNREAD_POST}">{L_VIEW_UNREAD_POST}</a> &bull; <!-- ENDIF -->
<!-- IF news_row.PAGINATION -->
<div class="pagination">

View File

@@ -7,28 +7,47 @@
}
}
dd.responsive-portal-news { display: none !important; }
.responsive-portal-news dd.posts, .responsive-portal-news dd.views { display: none !important; }
.responsive-portal-news dt { width: 125% !important; }
dt#n { width: 125% !important; }
.topiclist .topics, .topiclist .posts { display: none !important; }
#portal-forumlist dl.icon dt { width: 125% !important; }
.responsive-portal-announcements dd.views { display: none !important; }
dd.responsive-portal-announcements { display: none !important; }
.responsive-portal-announcements dd.posts, .responsive-portal-announcements dd.views {
display: none !important;
}
dt#a { width: 125% !important; }
.responsive-portal-announcements dt { width: 125% !important; }
@media only screen and (max-width: 950px), only screen and (max-device-width: 950px)
{
dd.responsive-portal-news { display: none !important; }
.responsive-portal-news dd.posts, .responsive-portal-news dd.views {
display: none !important;
}
.responsive-portal-news dt { width: 125% !important; }
dt#n { width: 125% !important; }
.topiclist .topics, .topiclist .posts { display: none !important; }
#portal-forumlist dl.icon dt { width: 125% !important; }
}
@media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
{
.responsive-portal-news dd.lastpost { display: none !important; }
.responsive-portal-news dt .list-inner { margin-right: 0px !important; }
.responsive-portal-news dt { width: 100% !important; }
dt#n { width: 100% !important; }
.responsive-portal-news dd.lastpost, .responsive-portal-announcements dd.lastpost { display: none !important; }
.responsive-portal-news dt .list-inner, .responsive-portal-announcements dt .list-inner { margin-right: 0px !important; }
.responsive-portal-news dt, .responsive-portal-announcements dt { width: 100% !important; }
dt#n, dt#a { width: 100% !important; }
.portal-responsive-poll .resultbar {
display: none !important;
}
.portal-responsive-poll dt { width: 45% !important; }
.portal-responsive-poll dd {
width: 45% !important;
float: right !important;
}
#portal-forumlist dl.icon dt { width: 100% !important; }
#portal-left ul.topiclist dd, #portal-right ul.topiclist dd { display: block !important; }
.portal-responsive-show { display: block !important; }