Jump to the post that solved this thread.
Solved: 4 Years, 1 Month, 3 Weeks ago Responsive Postbit / Showthread
#2
Solved: 4 Years, 1 Month, 3 Weeks ago
postbit_classic is the correct template that you need to edit. You need to force it to all users to use the classic postbit.
To make postbit responsive, you can use css media query or flexbox or grid.
Here is an example using CSS media query

Template - postbit_classic
{$ignore_bit}{$deleted_bit}
<a name="pid{$post['pid']}" id="pid{$post['pid']}"></a>
<div class="post classic {$unapproved_shade}" style="{$post_visibility}" id="post_{$post['pid']}">
<div class="authinfo">
	{$post['useravatar']}
	<div class="author_information">
			<strong><span class="largetext">{$post['profilelink']}</span></strong> {$post['onlinestatus']}<br />
			<span class="smalltext">
				{$post['usertitle']}<br />
				{$post['userstars']}
				{$post['groupimage']}
			</span>
	</div>
	<div class="author_statistics">
		{$post['user_details']}
	</div>
</div>
<div class="authpostcontent">
	<div class="post_head">
		{$post['posturl']}
		{$post['icon']}
		<span class="post_date">{$post['postdate']} <span class="post_edit" id="edited_by_{$post['pid']}">{$post['editedmsg']}</span></span>
	{$post['subject_extra']}
	</div>
	<div class="post_body scaleimages" id="pid_{$post['pid']}">
		{$post['message']}
	</div>
	{$post['attachments']}
	{$post['signature']}
	<div class="post_meta" id="post_meta_{$post['pid']}">
		{$post['iplogged']}
		<div class="float_right">
			{$post['poststatus']}
		</div>
	</div>
	{$post['input_editreason']}
</div>
<div class="post_controls">
	<div class="postbit_buttons author_buttons float_left">
		{$post['button_email']}{$post['button_pm']}{$post['button_www']}{$post['button_find']}{$post['button_rep']}
	</div>
	<div class="postbit_buttons post_management_buttons float_right">
		{$post['button_edit']}{$post['button_quickdelete']}{$post['button_quickrestore']}{$post['button_quote']}{$post['button_multiquote']}{$post['button_report']}{$post['button_warn']}{$post['button_purgespammer']}{$post['button_reply_pm']}{$post['button_replyall_pm']}{$post['button_forward_pm']}{$post['button_delete_pm']}
	</div>
</div>
</div>

CSS
.authpostcontent{
    overflow: hidden;
}
.authinfo{
    width: 22%;
    float: left;
    margin-right: 10px;
}

@media only screen and (max-width: 420px) {
.authinfo{
    border: 0 none;
    float: none;
    margin-right: 0;
    width: auto;
}
}

NOTE:- This is a rough code I wrote as an example, you will need to edit it to make it suitable for your needs

Regards
WallBB
- MyBB Heart
Reply
Jump to the post that solved this thread.


Messages In This Thread
Responsive Postbit / Showthread - by Kieria - 2020-07-05, 12:56 PM
RE: Responsive Postbit / Showthread - by WallBB - 2020-07-06, 02:53 AM
RE: Responsive Postbit / Showthread - by Kieria - 2020-07-11, 10:00 PM

Forum Jump:


Users browsing this thread: 1 Guest(s)