-{include file='articleListItems' objects=$boxArticleList}
+{if $boxPosition == 'sidebarLeft' || $boxPosition == 'sidebarRight'}
+ <ul class="sidebarBoxList">
+ {foreach from=$boxArticleList item=boxArticle}
+ <li>
+ <a href="{$boxArticle->getLink()}" class="box48">
+ <span>{if $boxArticle->getImage()}{@$boxArticle->getImage()->getElementTag(48)}{/if}</span>
+
+ <div>
+ <h3>{$boxArticle->getTitle()}</h3>
+ <small>
+ {if $boxSortField == 'time'}
+ {@$boxArticle->time|time}
+ {elseif $boxSortField == 'views'}
+ {lang article=$boxArticle}wcf.article.articleViews{/lang}
+ {elseif $boxSortField == 'comments'}
+ {lang article=$boxArticle}wcf.article.articleComments{/lang}
+ {elseif $boxSortField == 'cumulativeLikes'}
+ {if MODULE_LIKE && $__wcf->getSession()->getPermission('user.like.canViewLike') && ($boxArticle->likes || $boxArticle->dislikes)}
+ <span class="wcfLikeCounter{if $boxArticle->cumulativeLikes > 0} likeCounterLiked{elseif $boxArticle->cumulativeLikes < 0}likeCounterDisliked{/if}">
+ <span class="icon icon16 fa-thumbs-o-{if $boxArticle->cumulativeLikes < 0}down{else}up{/if} jsTooltip" title="{lang likes=$boxArticle->likes dislikes=$boxArticle->dislikes}wcf.like.tooltip{/lang}"></span>{if $boxArticle->cumulativeLikes > 0}+{elseif $boxArticle->cumulativeLikes == 0}±{/if}{#$boxArticle->cumulativeLikes}
+ </span>
+ {/if}
+ {/if}
+ </small>
+ </div>
+ </a>
+ </li>
+ {/foreach}
+ </ul>
+{elseif $boxPosition == 'footerBoxes'}
+ <ul class="articleList">
+ {foreach from=$boxArticleList item=boxArticle}
+ <li>
+ <a href="{$boxArticle->getLink()}">
+ {if $boxArticle->getImage()}
+ <div class="articleListImage">{@$boxArticle->getImage()->getThumbnailTag('small')}</div>
+ {/if}
+
+ <h3 class="articleListTitle">{$boxArticle->getTitle()}</h3>
+ <ul class="inlineList articleListMetaData">
+ <li>
+ <span class="icon icon16 fa-clock-o"></span>
+ {@$boxArticle->time|time}
+ </li>
+
+ <li>
+ <span class="icon icon16 fa-comments"></span>
+ {lang article=$boxArticle}wcf.article.articleComments{/lang}
+ </li>
+ </ul>
+ </a>
+ </li>
+ {/foreach}
+ </ul>
+{else}
+ {include file='articleListItems' objects=$boxArticleList}
+{/if}
+++ /dev/null
-<ul class="sidebarBoxList">
- {foreach from=$boxArticleList item=boxArticle}
- <li>
- <a href="{$boxArticle->getLink()}" class="box48">
- <span>{if $boxArticle->getImage()}{@$boxArticle->getImage()->getElementTag(48)}{/if}</span>
-
- <div>
- <h3>{$boxArticle->getTitle()}</h3>
- <small>
- {if $boxSortField == 'time'}
- {@$boxArticle->time|time}
- {elseif $boxSortField == 'views'}
- {lang article=$boxArticle}wcf.article.articleViews{/lang}
- {elseif $boxSortField == 'comments'}
- {lang article=$boxArticle}wcf.article.articleComments{/lang}
- {elseif $boxSortField == 'cumulativeLikes'}
- {if MODULE_LIKE && $__wcf->getSession()->getPermission('user.like.canViewLike') && ($boxArticle->likes || $boxArticle->dislikes)}
- <span class="wcfLikeCounter{if $boxArticle->cumulativeLikes > 0} likeCounterLiked{elseif $boxArticle->cumulativeLikes < 0}likeCounterDisliked{/if}">
- <span class="icon icon16 fa-thumbs-o-{if $boxArticle->cumulativeLikes < 0}down{else}up{/if} jsTooltip" title="{lang likes=$boxArticle->likes dislikes=$boxArticle->dislikes}wcf.like.tooltip{/lang}"></span>{if $boxArticle->cumulativeLikes > 0}+{elseif $boxArticle->cumulativeLikes == 0}±{/if}{#$boxArticle->cumulativeLikes}
- </span>
- {/if}
- {/if}
- </small>
- </div>
- </a>
- </li>
- {/foreach}
-</ul>
/**
* @inheritDoc
*/
- protected $supportedPositions = ['sidebarLeft', 'sidebarRight', 'contentTop', 'contentBottom', 'top', 'bottom'];
+ protected $supportedPositions = ['sidebarLeft', 'sidebarRight', 'contentTop', 'contentBottom', 'top', 'bottom', 'footerBoxes'];
/**
* @inheritDoc
*/
protected $sortFieldLanguageItemPrefix = 'wcf.article';
+ /**
+ * @inheritDoc
+ */
+ public $defaultLimit = 3;
+
/**
* @inheritDoc
*/
* @inheritDoc
*/
protected function getObjectList() {
- return new AccessibleArticleList();
+ $objectList = new AccessibleArticleList();
+
+ switch ($this->sortField) {
+ case 'comments':
+ $objectList->getConditionBuilder()->add('article.comments > ?', [0]);
+ break;
+ case 'views':
+ $objectList->getConditionBuilder()->add('article.views > ?', [0]);
+ break;
+ case 'cumulativeLikes':
+ $objectList->getConditionBuilder()->add('article.cumulativeLikes > ?', [0]);
+ break;
+ }
+
+ return $objectList;
}
/**
* @inheritDoc
*/
protected function getTemplate() {
- $templateName = 'boxArticleList';
- if ($this->box->position === 'sidebarLeft' || $this->box->position === 'sidebarRight') {
- $templateName = 'boxArticleListSidebar';
- }
-
- return WCF::getTPL()->fetch($templateName, 'wcf', [
+ return WCF::getTPL()->fetch('boxArticleList', 'wcf', [
'boxArticleList' => $this->objectList,
- 'boxSortField' => $this->sortField
+ 'boxSortField' => $this->sortField,
+ 'boxPosition' => $this->box->position
]);
}
}
.articleImageWrapper {
align-items: center;
display: flex;
- height: 300px;
+ max-height: 300px;
overflow: hidden;
img {
> li:not(:first-child) {
margin-top: 30px;
}
+
+ @include screen-xs {
+ .box128 > .articleListImage {
+ margin-right: 10px;
+ }
+
+ .articleListImage > img {
+ height: 64px !important;
+ width: 64px !important;
+ }
+ }
+}
+
+.boxesFooterBoxes {
+ .articleList {
+ display: flex;
+ flex-wrap: wrap;
+ margin: 0 -5px -20px -5px;
+
+ > li {
+ margin: 0 5px 20px 5px;
+ }
+
+ .articleListImage > img {
+ height: auto !important;
+ max-width: 280px;
+ width: 100% !important;
+ }
+
+ .articleListImage + .articleListTitle {
+ margin-top: 5px;
+ }
+
+ .articleListMetaData {
+ display: none;
+ }
+ }
+
+ @include screen-lg {
+ .articleList {
+ > li {
+ flex: 0 0 calc(100%/3 - 10px);
+ max-width: calc(100%/3 - 10px);
+ }
+ }
+
+ .boxFullWidth {
+ .articleList {
+ > li {
+ flex: 0 0 calc(100%/6 - 10px);
+ max-width: calc(100%/6 - 10px);
+ }
+ }
+ }
+ }
+
+ @include screen-sm-up {
+ .articleList {
+ > li {
+ flex: 0 0 calc(100%/3 - 10px);
+ max-width: calc(100%/3 - 10px);
+ }
+ }
+ }
+
+ @include screen-xs {
+ .articleList {
+ justify-content: center;
+
+ > li {
+ width: 280px;
+ }
+ }
+ }
}