MyBB Community Forums

Full Version: Theme layout slightly broken on one site out of two
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Update: I worked out its the global thread announcement doing this.
It could be a theme bug after-all with forum announcement threads or just a bug with MyBB itself.
Any advice?

Its in the forumdisplay_announcements_announcement so its a theme template issue.
I am working on fixing it.


Old Post:
Been modifying the Emerald theme and noticed that the responsiveness was broken on one site with the thread listing in a forum.
Trying many things including exporting and putting the theme on a second forum the bug wasn't there.

I worked it out that it happens lower than 1280.

The theme is fine the css is fine, the scripts are fine as I put it on a second site.

I saved the page in my browser as it saves a compiled version and that is still doing it.
The working site isn't on a compiled version.

I compared all the support files css ,scripts etc using Notepad++ compare plugin they match.

The html has differences in url seo etc but overall there wasn't anything standing out.

The inline thread moderation isn't a issue as creating a thread in the forums to get that to show its still doing it..

Ill recheck the compiled html and do some tests and try to figure something out that way.

Here is a screenshot of whats going on.
On mobile the page is also clipped.
I removed my own urls etc as I'm still working on things and not ready to announce stuff yet.
The left is the forum I'm properly setting up you can see the Thread / Author bar weird the right is a test forum I had and its fine.
Its the same theme exported from the bugged site on the left and imported onto the one on the right.


[Image: k2eLAuy.jpg]

Finally sorted this out.

I changed the template with a duplicate section sections one for mobile one for full width.
Then I set media queries to hide based on width.
So on smaller width the colspan td is active which expands the subject line to the full width.
On larger resolutions the colspan td is disabled so the non colspan subject column shows with the other columns.

Here is a screenshot and the code for those interested.
This is all that's to it.

forumdisplay_announcements_announcement

 <td id="fa_subject" class="{$bgcolor} forumdisplay_announcement">
	<a href="{$announcement['announcementlink']}"{$new_class}>{$announcement['subject']}</a>
	<div class="author smalltext">{$announcement['profilelink']}</div>
</td>
<td id="fa_subject_colspan" colspan="5" class="{$bgcolor} forumdisplay_announcement">
	<a href="{$announcement['announcementlink']}"{$new_class}>{$announcement['subject']}</a>
	<div class="author smalltext">{$announcement['profilelink']}</br>{$postdate}</div>
</td>

css code

@media (max-width: 768px) {
	#fa_subject,{
display: none;
}

@media (min-width: 769px) {
#fa_subject_colspan {
    display: none;
  }

[Image: zy77iwd.jpg]