XF 2.0 Large avatar in member card possible

[Mr Lucky]

I have members complain that when clicking on a post avatar, they expect to see a larger version. Instead they get a smaller version in the member card and to them this seems counter-intuitive.

perhaps there is a reason for this, however my question in this forum is can I make that avatar large?

Thanks

 

[Ozzy47]

There is a suggestion thread,

Keep avatars square in member card and profile page

I think I figured out why I've been so adverse to the change to circles in 2.1 They actually look alright in the thread view, the thing that I find really annoying is if the circle ends up cropping an image where I may want to view the whole thing, I'm completely unable to do so. So for example...

xenforo.com

and this post by Mike gives you a class you can use to have square avatars in specific areas,

Keep avatars square in member card and profile page

I think I figured out why I've been so adverse to the change to circles in 2.1 They actually look alright in the thread view, the thing that I find really annoying is if the circle ends up cropping an image where I may want to view the whole thing, I'm completely unable to do so. So for example...

xenforo.com

 

[Mr Lucky]

Aha, I can change member_tooltip

<xf:avatar user="{$user}" size="l" notooltip="true" />

But then the text around it goes out of whack so I need some help with that

 

[Mr Lucky]

There is a suggestion thread,
https://xenforo.com/community/threads/keep-avatars-square-in-member-card-and-profile-page.156108/

and this post by Mike gives you a class you can use to have square avatars in specific areas,
https://xenforo.com/community/threa...ber-card-and-profile-page.156108/post-1299748

But that is about making them square, that isn't the issue as I can do that in style properties. I want to make them large.

NB: this is relevant to version 2 .0 as well as 2.1 so have changed the prefix to avoid confusion.

 

[Mike]

Worth noting that the avatar is actually bigger in 2.1, though it's not the large version.

If you're changing the size in the template, you need to change the space allocated to it in member_tooltip.less. See the @_memberTooltip-avatarSize variable at the top of it.

 

[Ozzy47]

Okay I would suggest "m" instead of "l"

So change the member_tooltip line to "m" then edit member_tooltip.less and change

@_memberTooltip-avatarSize: @avatar-s;

to this,

@_memberTooltip-avatarSize: @avatar-m;

 

[Mr Lucky]

If you're changing the size in the template, you need to change the space allocated to it in member_tooltip.less. See the @_memberTooltip-avatarSize variable at the top of it.

Thanks that works, but now I need to make the card wider, .tooltip.tooltip--member { width: 460px;} or will that cause problems on mobile view?

Worth noting that the avatar is actually bigger in 2.1, though it's not the large version.

Ah, yes that's true but in this case m,embvers are asking for the large version.

Okay I would suggest "m" instead of "l"

See above

 

[Mike]

Thanks that works, but now I need to make the card wider, .tooltip.tooltip--member { width: 460px;} or will that cause problems on mobile view?

Not exactly. It should have its width limited as appropriate, but you may find that you need to make further changes to allow the tooltip to work as expected on small screens, because the avatar is so large now. (I don't recall if we shrink the width as is; I don't think we do.)

 

[Mr Lucky]

Not exactly. It should have its width limited as appropriate, but you may find that you need to make further changes to allow the tooltip to work as expected on small screens, because the avatar is so large now. (I don't recall if we shrink the width as is; I don't think we do.)

Yes, seems to be OK so far, many thanks. Bit less room for text so more long member names get wrapped.