BuddyDev

Search

[Resolved] Keep avatar crop preview window inside frame

  • Participant
    Level: Yogi
    Posts: 1105
    calu on October 2, 2021 at 4:34 pm #40796

    Hi there avatar crop preview window, which exceed the frame of the mobile screen, on desktop it is fine.

    https://imgur.com/sRMo7ks
    https://imgur.com/3rcu1E2

    I have tried different selectors and properties, but I’m not able to find the right one to keep the preview window inside the frame.

    Any help would be appreciated, thanks!

    Regards
    Carsten

  • Keymaster
    (BuddyDev Team)
    Posts: 24257
    Brajesh Singh on October 3, 2021 at 11:31 am #40803

    Hi Carsten,
    You will need some css assistance. Also, different mobile screens have different view port sizes, so you will need to define in which screensize you want to keep it all inside the view.

    Since it needs custom css for your s[specific theme, I will suggest hiring a developer familiar with your theme to assist you with it.

    Regards
    Brajesh

  • Participant
    Level: Yogi
    Posts: 1105
    calu on October 3, 2021 at 12:13 pm #40807

    Hi Brajesh, thanks for the suggestions, I located the issue to be with these avatar settings, apparently the size setting is to big, I don’t know why the avatar is not centered in the view frame. Is the view port defined by Thump or Full Width avatar size?

    I’m not sure why I added this code in the first place

    https://imgur.com/AIflMtq

    Regards
    Carsten

    
// IMPORTANT! ÆNDRING AF AVATAR SIZE

 if ( ! defined( 'BP_AVATAR_THUMB_WIDTH' ) )
    define( 'BP_AVATAR_THUMB_WIDTH', 120 ); //change this with your desired thumb width
 
if ( ! defined( 'BP_AVATAR_THUMB_HEIGHT' ) )
    define( 'BP_AVATAR_THUMB_HEIGHT', 120); //change this with your desired thumb height
 
if ( ! defined( 'BP_AVATAR_FULL_WIDTH' ) )
    define( 'BP_AVATAR_FULL_WIDTH', 500); //change this with your desired full size,weel I changed it to 225,300 :)
 
if ( ! defined( 'BP_AVATAR_FULL_HEIGHT' ) )
    define( 'BP_AVATAR_FULL_HEIGHT', 500); //change this to default height for full avatar
  • Participant
    Level: Yogi
    Posts: 1105
    calu on October 3, 2021 at 1:30 pm #40808

    Hi Brajesh, I see now that the purpose with the code is to have a full width avatar on mobile.

    If I change the value to 300px I get all most full width on mobile, and the issue with the view port is solved, thank you.

    Regards
    Carsten

  • Keymaster
    (BuddyDev Team)
    Posts: 24257
    Brajesh Singh on October 4, 2021 at 8:05 pm #40822

    Hi Carsten,
    Thank you for letting me know. It’s good to know that you resolved it.

    Regards
    Brajesh

The topic ‘ [Resolved] Keep avatar crop preview window inside frame’ is closed to new replies.

This topic is: resolved