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.
Options 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.


  • Options
    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.