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

XF 1.5 Font Awesome replace 'Discussions:' 'Messages:'

Discussion in 'Styling and Customization Questions' started by jellytoe, Feb 9, 2016.

  1. jellytoe

    jellytoe Member

    TSIA (anyone use that acronym for 'title says it all' maybe too close to US airport security)

    Anyways. Is there a resource or add-on to change the "Discussions:" and "Messages:" under each forum to font-awesome chat icons or something similar? Thinking I need less text in my forum_list
     
  2. Arty

    Arty Well-Known Member

    This should help:
    Code:
    .node .nodeStats.pairsInline dl:first-child dt { display: none; }
    .node .nodeStats.pairsInline dl:first-child:before { content: '\f086'; font-family: FontAwesome; }
    
    .node .nodeStats.pairsInline dl:nth-child(2) dt { display: none; }
    .node .nodeStats.pairsInline dl:nth-child(2):before { content: '\f0f6'; font-family: FontAwesome; }
    
    First 2 lines are for discussions icon, last 2 lines for messages icon. Add color and spacing as needed.
     
    jellytoe likes this.
  3. jellytoe

    jellytoe Member

    Ahh exactly. How about adding spacing between the two fields?
     
  4. Arty

    Arty Well-Known Member

    Add left or right margin to text
     
    jellytoe likes this.
  5. jellytoe

    jellytoe Member

    Hmm not sure how that's done. But having a different thought. What it be difficult to get ride of Discussions: 150 which is now a font awesome icon and number and just have the Messages. Then I am thinking to move it next to the forum name instead of underneath it. Is this too complex?
     
  6. Arty

    Arty Well-Known Member

    Getting rid of discussions: sure.
    Moving it next to forum name: that's more complex. Probably not doable.

    Code:
    .node .nodeStats.pairsInline dl:first-child { display: none; }
    
    .node .nodeStats.pairsInline dl:nth-child(2) dt { display: none; }
    .node .nodeStats.pairsInline dl:nth-child(2):before { content: '\f0f6'; font-family: FontAwesome; }
     
    jellytoe likes this.
  7. jellytoe

    jellytoe Member

    Impossible? :( What about moving the Latest: (time) up onto the same line as Messages:
     
  8. katsulynx

    katsulynx Well-Known Member

    You can move stuff around as you like by editing the appropriate templates.
     
  9. CFMack

    CFMack New Member

    I am wondering if there is an add-on to do this yet. I am not good with coding, and I would love to be able to change these words ("Discussions" "Messages") to icons.
     
  10. Nudaii

    Nudaii Well-Known Member

  11. CFMack

    CFMack New Member

    Thank you.
     

Share This Page