1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.5 How to change avatar size in newsfeed?

Discussion in 'Styling and Customization Questions' started by Alfa1, Oct 9, 2016.

  1. Alfa1

    Alfa1 Well-Known Member

    I would like to make the newsfeed more compact and orderly. I applied various changes through extra.css
    Currently the newsfeed uses a 48 x 48px avatar size. I would like to change this to 36 x 36px
    I tried setting this height for .event .avatar, .event .icon but that only reduces div height but not the icon itself.

    Is this possible through extra.css or is it needed to use a different avatar icon and do so through template modification?
     
  2. Steve F

    Steve F Well-Known Member

    You can try
    Code:
    .news_feed_page span.img.s {
        width: 36px;
        height: 36px;
    }
    Or are you talking about the recent-activity (news feed global) page?

    If so change it to
    Code:
    .news_feed_page_global span.img.s {
        width: 36px;
        height: 36px;
    }
     
    Alfa1 likes this.
  3. Alfa1

    Alfa1 Well-Known Member

    Strange. I added both to extra.css and neither the recent-activity page nor the news-feed page avatar size were changed.
     
  4. Steve F

    Steve F Well-Known Member

    Hmm I'll test it when I get back to my PC.
     
    Alfa1 likes this.
  5. Alfa1

    Alfa1 Well-Known Member

    If you can find out then this would be helpful. I am trying different things but not seeing it.
     
  6. king8084

    king8084 Active Member

    just change the _l to _s
     
    Alfa1 likes this.
  7. Alfa1

    Alfa1 Well-Known Member

    The default news_feed_item template has:
    <xen:avatar user="$item" size="s" class="icon" />
     
    Last edited: Oct 16, 2016
  8. Alfa1

    Alfa1 Well-Known Member

    Yes! This worked:
    .news_feed_page_global .avatar img, .avatar .img, .avatarCropper {
    width: 36px;
    height: 36px;
    }
     

Share This Page