Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied. diversification between announced Discussions and others

oliverraduneroliverraduner Contributing to Vanilla since 2010Switzerland ✭✭
edited June 2010 in Vanilla 2.0 - 2.8
Has anyone yet figured out, how one can display the Announced Discussions in a separate box on the very top (like here in the rather than just atop of the discussions list?

When I was browsing the discussions-code, I figured out that basically there is no difference whether a post is announced or not. Only that it kinda "sorts" them to the top of the list and displays an inline "Announced"-infotext.
I could not figure out, how you can check before the box-HTML starts, whether to display the announced discussions first and with separate outer styling.

Thanks for any advice.


  • It's all done with CSS.
    <h1 id="AnnouncementsHeading">Announcements</h1>
    <ul class="DataList Announcements">
    <li class="DiscussionRow Alt Announcement New"></li>
    <li class="DiscussionRow Announcement New"></li>
    <li class="DiscussionRow Alt Announcement"></li>
    <li class="DiscussionRow Announcement"></li>
    <li class="DiscussionRow Alt Announcement"></li>
    <li class="DiscussionRow Announcement"></li>
    <ul class="DataList Discussions">
    <li class="DiscussionRow Alt New"></li>
    <li class="DiscussionRow"></li>
    <li class="DiscussionRow"></li>
    <li class="DiscussionRow New"></li>
    <li class="DiscussionRow"></li>
    Looking very quickly with FireBug, it looks like they're styling the ul.Announcements to have a bottom margin.

    From the site today, here are the relevant parts:
    /* vanilla.css line 141 */

    ul.Announcements {
    margin:0 0 20px;

    /* vanilla.css line 614 */

    body.Drafts #Content h1, /* <-- this one here! */
    body.Discussion #Content h2,
    body.Discussions #Content h1,
    body.Categories #Content h1 {
    background:url("grey_fade.png") repeat-x scroll left top #ECF0F9;
    border:1px solid #9CA7B8;
    padding:4px 8px;
    text-shadow:0 1px 0 #FFFFFF;

    /* vanilla.css line 628 */

    ul.DataList {
    border-color:-moz-use-text-color #9CA7B8 #9CA7B8;
    border-right:1px solid #9CA7B8;
    border-style:none solid solid;
    border-width:0 1px 1px;
Sign In or Register to comment.