a few important facts to remember
1 your skin is not the only templates you will need to add classes to, the skin and modules work together to build a page. 1 example is the ning discussion page and details, these templates are found in the ning discussions module
2 templates call other templates and modules and if you cant find what your looking for, like the comments on a forum post, chances are (and in this case is) theres an if for else type statement calling those comments, the likes, and everything else in that block
3 surrounding an if else type statement with a containing div alows you to target all items within that div you added
4 little lost? 2 quick ways to find yourself and the code your targetting 1 put .hereiam {background-color:red!important;} in your css then simply add heriam to any element and everything withinit turns bright red you can alternately add <h1>here i am</h1> and see a heading in the page (yes this is a guide for dummies)
on the front page i i targetted the headings and "items" to get this glazed "capped" look but that left all other items hanging out there with that flat chopped off top look
to fix this i had to edit a few templates adding classes then targetting all items within or in some cases all but the 1st item (.item:nth-child(n+2) targets all items after the 1st child)
on the forum lists page this was simple to do using the nth-child method and adding classes to the title area for padding
and all i did was add the border radius to all but the 1st "item"
i am not near done just wanted to share examples of how to get the control you want
heres the css ive used so far for forum tweaks
.ningdiscusscommentdetails .item,.discussfirstpost .item:nth-child(n+2),.ningdiscussblockcontent .item:nth-child(n+2) {-webkit-border-radius:2em;-moz-border-radius:2em;border-radius:2em;}
.title.discusstitleblock {
padding: 1em 3em 0.3em 2em;
}
real simple
heres a discussuion detail page now to target the comments likes shares etc all i did was wrap a div around the if that brings in those items
<div class="ningdiscusscommentdetails">
{if !isset($item.discuss_forbidden)}
{* bring in the item details *}
{jrCore_item_detail_features module="jrNingDiscuss" item=$item}
{/if}
</div>
at 1st i felt like it was a real oversight to not have built in classes but now im starting to see how it makes sence to have a more "blank slate" aproach that lets you put them where you want them or to surround them with containing divs to target a group of items
just thought this would help some of you out who are trying to get used to the new system
--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
updated by @soaringeagle: 01/13/15 10:55:06AM