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

XF 1.2 Top Border on Discussion List Containing Sub-Nodes

Discussion in 'Styling and Customization Questions' started by Amaury, Jan 17, 2014.

  1. Amaury

    Amaury Well-Known Member

    How can I add a top border here? I've tried a few things and to be specific, including adding border-top to the code @Tracy Perry provided here, but they've added borders around the whole thing. I only need it on the top since the other sides already have borders.

    It's not too big of a deal if it's not possible, though. It's strangely a bit cosmetically pleasant.

    Top Border.png
     
  2. katsulynx

    katsulynx Well-Known Member

    Can you provide a link to your forum? Then I can give you a quick answer on that one.
     
  3. Amaury

    Amaury Well-Known Member

    Link is in my signature. That's why I never provide it. :)
     
  4. katsulynx

    katsulynx Well-Known Member

    I normally tend to ignore signatures, sorry ;) Could you activate the style for some minutes so I can have a look at it?
     
  5. Amaury

    Amaury Well-Known Member

    I'm still working on it, but all my styles are styled the same. Choose something like New Year's Day. It's noticeable there as well.
     
  6. katsulynx

    katsulynx Well-Known Member

    Code:
    .nodeList .nodeList .node:first-child {
    border: YourBorderCode
    }
    Try this.
     
  7. Amaury

    Amaury Well-Known Member

    That did not work.

    Code:
    .nodeList .nodeList .node:first-child {
        border: @primaryLight;
    }
     
  8. katsulynx

    katsulynx Well-Known Member

    Try a more explicit definition like
    Code:
    .nodeList .nodeList .node:first-child .nodeInfo.primaryContent {
    boder: yourcode
    }
    It is always difficult to tell without being able to see the example the screenshot is taken of. In general, when using chrome or firefox you can see what classes your element has. As you want to add the border only to your first node, you'll definitly need the .node:first-child in your definition, the rest is a matter of the most explicit definition. You can however try to add the !important-attribute to your code, to ignore every more explicit setting.

    In general, if I got you right, this is what you're trying to achieve:
    Unbenannt-2.png
     
  9. katsulynx

    katsulynx Well-Known Member

    Or are you trying to modify the subforum-list? In that case it would be
    Code:
    .forum_view .nodeList .node:first-child {
    border: yourborder
    }
     
  10. Amaury

    Amaury Well-Known Member

    Nope, that didn't work, either.

    Go into a forum, like Visual Arts, that contains sub-forums. Notice how there's no border at the top? That's what I want to get a border on.
     
  11. katsulynx

    katsulynx Well-Known Member

    Yeap, have seen that and the code above worked for me to get a border right where I needed it. In general, follow these steps to get the element you need:
    1. Go to where your subject of change is
    2. Right click it in Chrome or Firefox and click "Inspect Element"
    3. In the following code window, search for the outest div containing your subject of change. In your case, this would probably be the .nodeInfo-div.

    You need to select the same elements like when you alter every single element of the list but add the pseudo-selector :first-child to it. When I apply the code above to your forum, it works fine. As stated above, try adding the !important after your color.
     
  12. Amaury

    Amaury Well-Known Member

    I don't need border-right, though. I need border-top.

    I edited my picture to show where the border would be. It's shown in red:

    Top Border Highlight.png
     
  13. katsulynx

    katsulynx Well-Known Member

    try using border-top then.
     
  14. Amaury

    Amaury Well-Known Member

    Yeah, that's still not doing it.

    @Tracy Perry, any help?
     
  15. Tracy Perry

    Tracy Perry Well-Known Member

    Will have to wait until I'm back home at a computer (on phone now) since I'm at a client location helping install/transfer 3 servers.
    I went to your site to look at that specific style but didn't see it (as a guest). Is it only available for administrators?
     
    Amaury likes this.
  16. Amaury

    Amaury Well-Known Member

    Yes, but choose one like New Year's Day. All my styles are styled the same. I'm still working on the one I used in the screenshot.
     
  17. Tracy Perry

    Tracy Perry Well-Known Member

    I'm going to have to set up a test server to work with on it as I use a different setup (I use child nodes below a lot of my parents) and it's causing some REAL headaches to figure out for me.
     
    Amaury likes this.
  18. mistypants

    mistypants Well-Known Member

    This is working for me in Firebug:
    Code:
    .forum_view .nodeList .node:first-child { border-top: 1px solid red !important; }
     
    Amaury likes this.
  19. Amaury

    Amaury Well-Known Member

    That did it! Thanks, Misty!

    I of course changed red to @primaryLight. :)
     
  20. katsulynx

    katsulynx Well-Known Member

    Quite actually what I stated some time ago... ;)
     
    Amaury likes this.

Share This Page