Jump to content
FLASH SALE (EXTENDED TO 2/21/19)! Take 20% off all store products! Read more... ×
We're hiring! We are accepting applications for Junior Moderator, Uploader, and Support Team. Read more... ×
Having trouble connecting to our Discord server or has your role been mistakenly removed? Let us know! Read more... ×
S!r.ReaDy

XF 1.5 Frames for avatars 1.5x

Recommended Posts

As requested by @ErronBlack95

 

To add in message_user_info, after </xen:hook> and before <xen:if is="!{$isQuickReply}">. check the first screenshot, if udont get it.
  

<div class="avatarHoldercustom {xen:if '{xen:helper ismemberof, $user, 3}', 'avatarOutline_admin'}
{xen:if '{xen:helper ismemberof, $user, 4}', 'avatarOutline_moderator'}
{xen:if '{xen:helper ismemberof, $user, 5}', 'avatarOutline_vip'}
{xen:if '{xen:helper ismemberof, $user, 2}', 'avatarOutline_registered'} ">
  
  </div>

 

Add this to  message_user_info.css

 



.message .messageContent {
    padding-bottom: 2px;
    padding-top: 8px;
    padding-left: 20px;
    min-height: 100px;
    overflow: hidden;
    *zoom: 1;
}

.avatarHoldercustom {
    background-color: #FFFFFF;
    position: relative;
    z-index: 10;
    width: 145px;
    height: 143px;
    margin-top: -132px;
    margin-left: 4px;
}
.messageUserBlock div.avatarOutline_admin
{
background: transparent url('https://i.imgur.com/bn96CZe.png') no-repeat;
}

.messageUserInfo
{
	@property "messageUserInfo";
	float: left;
	width: 150px;
	@property "/messageUserInfo";
}


.messageUserBlock div.avatarHolder
{
	@property "messageAvatarHolder";
	background-color: @primaryLightest;
	padding: 20px;
	border-radius: 4px;
	@property "/messageAvatarHolder";
	position: relative;	
}

 

Notes:

1) Individually for each theme adjust the CSS. I was using the default one.

2) Overwriting default class to make the userblock larger to fit the frame.

All classes are present in all themes, except the

.avatarHoldercustom { 
and
.messageUserBlock div.avatarOutline_admin{

Make sure to overwrite or remove the previous ones.

3) The online indicator is not showing coz of the frame. Work it yourself.

 


a.png


Result :

 

asd.thumb.png.51e408526cf5e5f217112441d12bd77d.png

Edited by S!r.ReaDy

Share this post


Link to post
Share on other sites
What do you think? Remember the human.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

×