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

XF 1.2 Sub forum display

Discussion in 'Styling and Customization Questions' started by Gazhyde, Sep 18, 2013.

  1. Gazhyde

    Gazhyde Well-Known Member

    I'm looking at tweaking my forum list, and using sub-forums a bit more.

    If I display sub-forums, by default it shows like this...

    upload_2013-9-18_15-18-16.png

    Would it be possible to change it to look like this?
    upload_2013-9-18_15-19-37.png

    Thanks for any suggestions, or links to something I've clearly missed in search ;)
     
  2. Chris D

    Chris D XenForo Developer Staff Member

    In node_list.css

    Find:

    Code:
            .node .subForumList li
            {
                float: left;
                width: 31%;
                margin: 2px 0 2px 2%;
            }
    And Replace it with:

    Code:
            .node .subForumList li
            {
                width: 31%;
                margin: 2px 0 2px 2%;
            }
    (Remove the float: left; bit)
     
    Gazhyde likes this.
  3. Gazhyde

    Gazhyde Well-Known Member

    Perfect! :notworthy:

    Thanks Chris.
     
  4. Gazhyde

    Gazhyde Well-Known Member

    As an aside, I had to tweak width to 100% or it didn't look right as the screen width decreased...

    Then noticed that when on mobile view there is no indication of sub-forums.
    upload_2013-9-18_16-4-1.png

    Same here on xf.com :confused: Is this an known 'issue', or as designed?

    upload_2013-9-18_16-6-39.png

    Shows as this in responsive...

    upload_2013-9-18_16-7-11.png
     
  5. Chris D

    Chris D XenForo Developer Staff Member

    It's as designed.
     
  6. Gazhyde

    Gazhyde Well-Known Member

    Hmmm... OK then, I will have to rethink what I'm doing then!

    Thanks again Chris.
     
  7. Chris D

    Chris D XenForo Developer Staff Member

    In node_list.css again, you could remove this (near the bottom):

    Code:
        .Responsive .node .subForumList,
        .Responsive .subForumsPopup
        {
            display: none;
        }
    And maybe remove this too:

    Code:
        .Responsive .node .subForumList li
        {
            width: 48%;
        }
     
  8. Gazhyde

    Gazhyde Well-Known Member

    Removing the first section gives this... At least there is some indication that there is more to see!

    upload_2013-9-18_16-37-28.png

    Removing the second section doesn't appear to make any obvious difference that I can see.
     
  9. Gazhyde

    Gazhyde Well-Known Member

    When drop down is clicked.
    upload_2013-9-18_16-40-22.png
     
  10. Gazhyde

    Gazhyde Well-Known Member

    Just a quick note if anyone follows this thread!

    Having just upgraded my dev site to 1.2.2, I've noticed in the changelog there was a change to node_list.css
    This change is lovely, but it makes the 'new' indicator disappear off the edge of the screen. I'm personally not too worried about it, as it looks better than before. May revisit it later on.
    2013-10-07 19.22.24.png
     

    Attached Files:

    vfustar likes this.

Share This Page