Jump to content

Subforums on mobile, please align... example:

Featured Replies

Posted

Subforums look like this:

ips_subforums.jpg.17f8d96eee8adde7424672

Would look better like this:

ips_subforums2.jpg.fded34951a28f2420a9dd

Because they look especially disorderly when there are mixed read/unread like this:

ips_subforums3.jpg.bd984038326666987e50c

Also the comma is not needed since on mobile they are a vertical list only.

@Rikki, what do you think?

Thanks

 

 

 

  • Author

I could even live without the dot, bold is enough and not as busy. Then they would be aligned.

  • 3 weeks later...
  • Author

I'll just remove the blue dot.

Can anyone tell me how for mobile as well as full site? To be honest it's gaudy on the full site as well, the sub-forums only have them if new content, but are bold as well so not needed in a sub-forum tree for me. Thanks!

  • Community Expert

Honestly, the dot is not necessary. The forum nane is bolded. It's enough.

It is just my board or does it work this way in general:

 

If someone posts something in a sub-forum, the sub-forum gets a dot and bolded, but the main board doesn't show up as having any unread content. The status icon remains transparent, etc..

  • Author
19 hours ago, Adriano Faria said:

Honestly, the dot is not necessary. The forum nane is bolded. It's enough.

Exactly. I'd like to know where to remove it. Does anyone know?

  • Community Expert

Untested: take a look on template forums -> front -> index -> forumRow.

			{{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>&nbsp;{{endif}}{$subforum->_title}</a>
						</li>
					{{endforeach}}
				</ul>
			{{endif}}

The <i class="fa fa-circle"></i> above.

  • Author

Thanks. Would that remove for mobile and full?

  • Community Expert

Not sure... as I said, it is untested.

Try to put a display none in one of this two class in your custom css:

<span class="ipsItemStatus ipsItemStatus_tiny "><i class="fa fa-circle"></i></span>

i've try with firebug, and work with both.

Cattura.PNG

  • Author

Thanks but your alignment is off how to correct? And the post count alignment too.

I'll tinker, thanks!

I think just removing will fix like @Adriano Lucas said. 

sorry For delay!

issued with alignment is caused by a Space in active Content.

unactive Content do not contain class, so, we cannot add Space in this via ::before rule.

to fix via css (imho is best instead to edit template), i think is sufficient a negative margin (eg 5px) in active link.

regards :)

  • Author

Cool. Last question if you know... how would you remove the comma from mobile only? It's a vertical list it looks silly with commas. Thanks!!

untested:

@media screen and (max-width: 767px) {
	.ipsDataItem_subList li a::after {
		content: "" !important;
	}
}

 

  • Author

Gracias, I'll test later.

Archived

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

Recently Browsing 0

  • No registered users viewing this page.