asrfsaafafsafa Posted March 7, 2018 Share Posted March 7, 2018 Well, hello... my english is pretty bad, i hope you will understand me. Well i tried to change my subforums like this with font-awensome, no luck in doin' that, also i find some tutorials what include editing of custom.css, well still no luck, i got just icons missing from sub-forums and descriptions for category/sub-forum/forum to be under the subforums, what i have to edit for my subforums to look like this? thanks. Link to comment Share on other sites More sharing options...
asrfsaafafsafa Posted March 11, 2018 Author Share Posted March 11, 2018 Solved. HTML/CSS username /forums/front/index/forumRow {{if $forum->can('view')}} {{$lastPost = $forum->lastPost();}} <li class="cForumRow ipsDataItem ipsDataItem_responsivePhoto {{if \IPS\forums\Topic::containerUnread( $forum ) && !$forum->redirect_on}}ipsDataItem_unread{{endif}} ipsClearfix" data-forumID="{$forum->_id}"> <div class="ipsDataItem_icon ipsDataItem_category"> {{if !$forum->redirect_on}} {{if \IPS\forums\Topic::containerUnread( $forum ) AND \IPS\Member::loggedIn()->member_id}}<a href="{{if $isSubForum}}{$forum->url()->setQueryString( array( 'do' => 'markRead', 'return' => $forum->parent_id ) )->csrf()}{{else}}{$forum->url()->setQueryString( 'do', 'markRead' )->csrf()}{{endif}}" data-action='markAsRead' title='{lang="mark_forum_read"}' data-ipsTooltip>{{endif}} {{endif}} {{if $forum->icon}} <img src="{file="$forum->icon" extension="forums_Icons"}" class='ipsItemStatus ipsItemStatus_custom {{if !\IPS\forums\Topic::containerUnread( $forum ) && !$forum->redirect_on}}ipsItemStatus_read{{endif}}'> {{else}} {{if $forum->redirect_on}} <span class='ipsItemStatus ipsItemStatus_large cForumIcon_redirect {{if !\IPS\forums\Topic::containerUnread( $forum ) && !$forum->redirect_on}}ipsItemStatus_read{{endif}}' {template="formattedInlineStyle" params="$forum" app="core" group="global" location="front"}> <i class='fa fa-arrow-right'></i> </span> {{elseif $forum->forums_bitoptions['bw_enable_answers']}} <span class='ipsItemStatus ipsItemStatus_large cForumIcon_answers {{if !\IPS\forums\Topic::containerUnread( $forum ) && !$forum->redirect_on}}ipsItemStatus_read{{endif}}' {template="formattedInlineStyle" params="$forum" app="core" group="global" location="front"}> <i class='fa fa-question'></i> </span> {{elseif $forum->password}} <span class='ipsItemStatus ipsItemStatus_large cForumIcon_password {{if !\IPS\forums\Topic::containerUnread( $forum ) && !$forum->redirect_on}}ipsItemStatus_read{{endif}}' {template="formattedInlineStyle" params="$forum" app="core" group="global" location="front"}> {{if $forum->loggedInMemberHasPasswordAccess()}} <i class='fa fa-unlock'></i> {{else}} <i class='fa fa-lock'></i> {{endif}} </span> {{else}} <span class='ipsItemStatus ipsItemStatus_large cForumIcon_normal {{if !\IPS\forums\Topic::containerUnread( $forum ) && !$forum->redirect_on}}ipsItemStatus_read{{endif}}' {template="formattedInlineStyle" params="$forum" app="core" group="global" location="front"}> <i class="fa fa-comments"></i> </span> {{endif}} {{endif}} {{if !$forum->redirect_on and \IPS\forums\Topic::containerUnread( $forum ) AND \IPS\Member::loggedIn()->member_id}} </a> {{endif}} </div> <div class="ipsDataItem_main"> <h4 class="ipsDataItem_title ipsType_large ipsType_break"> {{if $forum->password && !$forum->loggedInMemberHasPasswordAccess()}} <a href="{$forum->url()->setQueryString( 'passForm', '1' )}" data-ipsDialog data-ipsDialog-size='narrow' data-ipsDialog-title='{lang="forum_requires_password" sprintf="$forum->_title"}'>{$forum->_title}</a> {{else}} <a href="{$forum->url()}">{$forum->_title}</a> {{endif}} {{if $forum->redirect_on}} <span class='ipsType_light ipsType_medium'>({lang="redirect_hits" pluralize="$forum->redirect_hits"})</span> {{endif}} </h4>{{if $forum->description}} <div class="ipsDataItem_meta ipsType_richText ipsContained">{$forum->description|raw}</div> {{endif}} {{if $forum->hasChildren()}} <ul class="ipsDataItem_subList ipsList_inline"> {{foreach $forum->children() as $subforum}} <li class="{{if \IPS\forums\Topic::containerUnread( $subforum )}}ipsDataItem_unread{{endif}}"> <a href="{$subforum->url()}">{{if \IPS\forums\Topic::containerUnread( $subforum )}}<span class='ipsItemStatus ipsItemStatus_tiny {{if !\IPS\forums\Topic::containerUnread( $subforum ) && !$subforum->redirect_on}}ipsItemStatus_read{{endif}}'><i class="fa fa-circle"></i></span> {{endif}}{$subforum->_title}</a> </li> {{endforeach}} </ul> {{endif}} </div> {{if !$forum->redirect_on}} <div class="ipsDataItem_stats ipsDataItem_statsLarge"> {{if $lastPost}} <dl> {{$count = \IPS\forums\Topic::contentCount( $forum, TRUE );}} <dt class="ipsDataItem_stats_number">{number="$count"}</dt> <dd class="ipsDataItem_stats_type ipsType_light">{lang="posts_no_number" pluralize="$count"}</dd> </dl> {{endif}} {{if \IPS\forums\Topic::modPermission( 'unhide', NULL, $forum ) AND $unapprovedContent = $forum->unapprovedContentRecursive() and ( $unapprovedContent['topics'] OR $unapprovedContent['posts'] )}} <strong class='ipsType_warning ipsType_medium'> <i class='fa fa-warning'></i> {{if $unapprovedContent['topics']}} <a href='{$forum->url()->setQueryString( array( 'advanced_search_submitted' => 1, 'topic_type' => 'queued_topics' ) )->csrf()}' data-ipsTooltip title='{lang="queued_topics_badge" pluralize="$unapprovedContent['topics']"}' class='ipsType_blendLinks'>{$unapprovedContent['topics']}</a> {{else}} <span class='ipsType_light'>0</span> {{endif}} / {{if $unapprovedContent['posts']}} <a href='{$forum->url()->setQueryString( array( 'advanced_search_submitted' => 1, 'topic_type' => 'queued_posts' ) )->csrf()}' data-ipsTooltip title='{lang="queued_posts_badge" pluralize="$unapprovedContent['posts']"}' class='ipsType_blendLinks'>{$unapprovedContent['posts']}</a> {{else}} <span class='ipsType_light'>0</span> {{endif}} </strong> {{endif}} </div> <ul class="ipsDataItem_lastPoster ipsDataItem_withPhoto"> {{if $lastPost}} <li>{template="userPhoto" app="core" group="global" params="$lastPost['author'], 'tiny'"}</li> {{if $lastPost['topic_title']}}<li><a href="{$lastPost['topic_url']->setQueryString( 'do', 'getNewComment' )}" title='{$lastPost['topic_title']}'>{truncate="$lastPost['topic_title']" length="26"}</a></li>{{endif}} <li class='ipsType_blendLinks'>{lang="byline_nodate" htmlsprintf="$lastPost['author']->link()"}</li> {{if $lastPost['topic_title']}} <li class="ipsType_light"><a href='{$lastPost['topic_url']->setQueryString( 'do', 'getLastComment' )}' title='{lang="get_last_post"}' class='ipsType_blendLinks'>{datetime="$lastPost['date']"}</a></li> {{else}} <li class="ipsType_light">{datetime="$lastPost['date']"}</li> {{endif}} {{else}} <li class='ipsType_light ipsResponsive_showDesktop'>{{if $forum->password}}{lang="no_forum_posts_password"}{{else}}{lang="no_forum_posts"}{{endif}}</li> {{endif}} </ul> {{endif}} {{if $table and $table->canModerate()}} <div class='ipsDataItem_modCheck'> <span class='ipsCustomInput'> <input type='checkbox' data-role='moderation' name="moderate[{$forum->_id}]" data-actions="{expression="implode( ' ', $table->multimodActions( $forum ) )"}" data-state=''> <span></span> </span> </div> {{endif}} </li> {{endif}} Custom.css /* Subforum columns - start */ .ipsDataItem_subList{ display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; } .ipsDataItem_subList li{ width: calc((99% / 1)); line-height: 26px; flex: 0 0 auto; position: relative; } .ipsDataItem_subList > li, html[dir="rtl"] .ipsDataItem_subList > li { margin-right: 0 !important; margin-left: 0; } .ipsDataItem_subList li:before{ content: '\f18e'; font-family: 'FontAwesome'; font-size: 14px; display: inline-block; transform: translate(0,0); font-weight: normal; } .ipsDataItem_subList a{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: absolute; top: 0; bottom: 0; left: 15px; right: 5px; } html[dir='rtl'] .ipsDataItem_subList a{ left: 5px; right: 15px; } html[dir='ltr'] .ipsDataItem_subList .ipsDataItem_unread a{ left: 12px; } html[dir='rtl'] .ipsDataItem_subList .ipsDataItem_unread a{ right: 12px; } .ipsDataItem_subList:before, .ipsDataItem_subList li a::after{ display: none; } @media screen and (min-width: 550px){ /* Increase to 2 columns when appropriate */ .ipsDataItem_subList li{ width: calc((99% / 2)); } } @media screen and (min-width: 1300px){ /* Increase to 3 columns on large screens */ .ipsDataItem_subList li{ width: calc((99% / 3)); } } /* Subforum columns - end */ Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.