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

XF 1.3 Node List - width on resize

Discussion in 'Styling and Customization Questions' started by Neil E., Dec 9, 2014.

  1. Neil E.

    Neil E. Active Member

    I'm trying to achieve a narrow forum page on resize (below 600px). The difficulty is determining what pushes nodeLastPost down below nodeTitle. I've tried a reduced length of text for nodeTitle and nodeDescription. While this leaves more obvious space, nodeLastPost wraps before the elements get close to each other.

    Current settings:
    page width controller max-width 1200px
    page width controller min-width 568px (for testing)
    responsive design enabled with stock settings
    (wide 800/medium 610/narrow 480/non-resp min 976)

    The only way I could change the wrapping point was to change the "medium 610" to a lower value. Is there any other way to do this? The photos show about 100px that could come out.

    Node List 1.jpg

    Node List 2.jpg

    Node List 3.jpg
  2. Russ

    Russ Well-Known Member

    If you look at: node_list.css

    Towards the bottom there's a media query, you can edit the: @maxResponsiveMediumWidth to a px value. or even change it to: @maxResponsiveWideWidth this will adjust when that last post take the mobile effects(assuming this is what you want it to do)
  3. Neil E.

    Neil E. Active Member

    Thanks for the reply. I can tweak the point where it takes the mobile effects. By changing the specific responsive medium width to 500px (in node_list.css), I can get the 100px measurement down to about 30px.

    I realize now that I need the page width controller to limit the minimum page width so no wrapping occurs below a certain point. I believe pageWidth should be able to override the mobile effects, but I can't figure how to make it work.

    Let's say I set mobile effects to occur at 520px with the page width controller is set to a min-width of 500px. Mobile should happen at 520, then the page width should lock at 500 so no wrapping takes place. I'm looking for a way to force a minimum page width with responsive enabled. Isn't this how pageWidth is supposted to work?

    Testing shows that pageWidth set to min-width 500px has no effect. I am expecting "Motorcycle related discussion" to disappear via mobile at 520, then the page width to lock at 500 so node_last_post cannot wrap.
  4. Neil E.

    Neil E. Active Member

    Still testing this; now I wonder if there is a bug. When I disable Responsive Design and set the Non-Responsive Minimum Width to 500px, the minimum page width still stops at the default 976px. It seems like the non-resp min width setting is completely ignored. I do have the Page Width Controller also set to 500px, although this has no effect either. I am expecting the non-resp min width setting to have more priority than the Page Width Controller setting.

    Can someone please explain how the page width hierachy is supposted to work?

Share This Page