MyBB Community Forums
Moving The Panel - Printable Version

+- MyBB Community Forums (https://community.mybb.com)
+-- Forum: Extensions (https://community.mybb.com/forum-201.html)
+--- Forum: Themes (https://community.mybb.com/forum-103.html)
+---- Forum: Theme Support (https://community.mybb.com/forum-10.html)
+---- Thread: Moving The Panel (/thread-95181.html)



Moving The Panel - MrJohn - 2011-05-26

I ran in to yet another problem with my theme creation. I need to move the panel to the area that I have made for it in the logo. How would I go about doing that? I would also want to make it transparent if I could.

Screenshot: http://i54.tinypic.com/j9vs03.png


RE: Moving The Panel - Alan S. - 2011-05-26

Float it within the header, add float:right; to #panel

Without seeing the code you're using it's hard to give any more guidance than that.



RE: Moving The Panel - MrJohn - 2011-05-26

Here is my header:

<div id="container">
<div class="menu">
				<ul>
					<li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.gif" alt="" title="" />{$lang->toplinks_search}</a></li>
					<li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.gif" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
					<li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$theme['imgdir']}/toplinks/calendar.gif" alt="" title="" />{$lang->toplinks_calendar}</a></li>
					<li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$theme['imgdir']}/toplinks/help.gif" alt="" title="" />{$lang->toplinks_help}</a></li>
				</ul>
			</div>

		<a name="top" id="top"></a>
		<div id="header">

			
	<div id="panel">
				{$welcomeblock}
			</div>
			<div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
		</div>
			
			<hr class="hidden" />

		<hr class="hidden" />
		<br class="clear" />
		<div id="content">
			{$pm_notice}
			{$bannedwarning}
			{$bbclosedwarning}
			{$unreadreports}
			{$pending_joinrequests}
			<navigation>
			<br />

Here is my #Panel:

#panel {
	background: #000;
              width: 350px;
              float: right;
	color: #fff;
	font-size: 11px;
	border: 1px solid #D4D4D4;
	padding: 8px;
}



RE: Moving The Panel - Alan S. - 2011-05-26

Try putting the panel inside the logo div:

            <div class="logo">
<div id="panel">{$welcomeblock}</div>

Then add some margins to align it correctly.


RE: Moving The Panel - MrJohn - 2011-05-26

Did not change any thing. Thanks for the suggestion though.


RE: Moving The Panel - Alan S. - 2011-05-26

Is that whole image set as the logo? It needs to be set as a background image in the CSS for what I suggested to work. Without seeing all the code together it's not easy to see what will work.


RE: Moving The Panel - MrJohn - 2011-05-27

Ah that was it, worked like a charm. Thanks mate!