It's been nice getting a feel for v5 here before we actually upgrade our site, and there are a lot of features that are really great. I'd just like to give a piece of feedback about the Username/Avatar and Notifications/Inbox icons here:

While I understand the design reason for moving them down, they are much too small. It's hard to notice whether I'm actually signed-in, and it makes the notifications/inbox icons difficult to notice. Will there be an option for making the larger?

To be honest, the avatar is also really small on a post. By the time the icons cover it up, it's just a partial piece. And members use those to identify each other. Hoping there will be options to allow larger view?

Thanks!

Edited April 2Apr 2 by PinPics

im quite happy with this size 🤔 but you can tweak this by yourself easily via custom css 😮 this way you can change the size for each part separately

/* navbar icons size */
.ipsUserNav__icon {
    font-size: 50px;
}

/* navbar user icon size */
.ipsUserNav__link .ipsUserPhoto {
    width: 50px;
}

/* avatars size */
.ipsData__icon .ipsUserPhoto {
    width: 50px;
}

Edited April 2Apr 2 by Vodafone CZ

54 minutes ago, PinPics said:

Hoping there will be options to allow larger view?

It looks like you use the compact view. The normal view has large profile images, at least for the forums.

3 minutes ago, opentype said:

It looks like you use the compact view. The normal view has large profile images, at least for the forums.

Thank you so much for that info! I hadn't realized all those settings were on Compact by default. Fabulous!

On 4/2/2025 at 2:52 PM, Vodafone CZ said:

im quite happy with this size 🤔 but you can tweak this by yourself easily via custom css 😮 this way you can change the size for each part separately

/* avatars size */.ipsData__icon .ipsUserPhoto {
width: 50px;
}

Is it this one to adjust avatars in posts and profiles only?

i dont know every place where avatars are so try and see 😮 i dont even remember from where i took this piece of code 🤭

just right click element you want to inspect and play with it in dev tools 😮

29 minutes ago, Vodafone CZ said:

i dont know every place where avatars are so try and see 😮 i dont even remember from where i took this piece of code 🤭

just right click element you want to inspect and play with it in dev tools 😮

It wasn't that one.

.ipsPhotoPanel .ipsAvatarStack {
    width: 100px;
}

3 minutes ago, Vodafone CZ said:

.ipsPhotoPanel .ipsAvatarStack {
    width: 100px;
}

Thanks, but strangely it isn't doing a thing when I add it as custom CSS on desktop.

add it at the end of whole css to be sure nothing is overwriting it 🤔

Streamable

Watch user-icon | Streamable

I am adding it via theme editor - custom CSS, and not seeing any change?

try it here /admin/?app=core&module=customization&controller=themes

if it still doesnt work, add space and !important before the ; 🤔

Works but on mobile view, and it's only the desktop view I was looking for. 😀

so place it in some media query 😮 this will work on bigger screens (979+px)

@media (min-width: 979px) {
	.ipsPhotoPanel .ipsAvatarStack {
	    width: 100px;
	}
}