Adding Avatar & logout to Notifications module

By Sunny on Thursday, 06 November 2014

Posted in General Issues

Likes 0

Votes 0

I'm trying to add avatar & logout button to mod_notifications, i have achieved some progress by adding the below

For Avatar i added below line 13 on default.php:

<div class="es-menu-item notice-recent">

				<div class="es-avatar pull-left">

					<img src="/<?php echo $my->getAvatar( SOCIAL_AVATAR_MEDIUM );?>" alt="<?php echo $modules->html( 'string.escape' , $my->getName() );?>" />

				</div>

			</div>

For Logout button i added the below just above " <?php } ?> "

<div class="es-menu-item notice-message"

				data-original-title="<?php echo JText::_( 'Logout' );?>"

				data-es-provide="tooltip"

				data-placement="bottom"

			>

				<form action="index.php" id="es-mod-login-signout" method="post" data-es-menu-signout-form>

					<a href="javascript:void(0);" onclick="document.getElementById( 'es-mod-login-signout' ).submit();" data-es-menu-signout>

						<i class="ies-switch ies-small"></i>

						<span><?php echo JText::_( '' );?></span>

					</a>



					<input type="hidden" name="return" value="<?php echo $logoutReturn;?>" />

					<input type="hidden" name="option" value="com_easysocial" />

					<input type="hidden" name="controller" value="account" />

					<input type="hidden" name="task" value="logout" />

					<?php echo $modules->html( 'form.token' ); ?>

				</form>

				

			</div>

Now the Avatar & Logout buttons are showing, but the display is messed (Attaching screenshot), i want to show them in a straight line with | seperators. Can you pls guide me on how?

regards

/* adjust the sytling in the Easysocial menu module */ .es-menu-item + .es-menu-item { border-left: 1px solid rgba(0,0,0,0.05); height: 27px; } body div#fd.es.mod-es-menu .es-notification .es-menu-item { text-align: center; } body div#fd.es.mod-es-menu .es-notification .es-menu-item { width: 25% !important; }