Skip to:
Content
Pages
Categories
Search
Top
Bottom

Theme designers: contribute to core

  • In the trunk version of BuddyPress (what will become BP 1.3), I’ve changed the default theme to support the custom menus that were introduced in WordPress 3.0. What this means is that the default theme now supports nested menu items, in the same way that twentyten does (hover dropdowns).

    It looks like something this (Activity is nested under Groups):

    You will note, however, that the styling is horrible. I’d love it if one of the community here who design themes is able to dive in and produce a patch (or just an updated CSS file). Restrictions: no javascript. You can find the CSS that I mostly copied-and-pasted from twentyten at the very bottom of http://svn.buddypress.org/trunk/bp-themes/bp-default/_inc/css/default.css

    Trac ticket: http://trac.buddypress.org/ticket/2691

Viewing 11 replies - 26 through 36 (of 36 total)
  • Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    guess i better upgrade to trunk

    bump

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    @DJPaul what are you after Paul? I think everyone might be a little lost as to what actually needs doing? is it just the styles that need sorting, As for my earlier question regarding changes to nav menus for 3.1 and as much as it may be irrelevant? I managed to track down a ticket correcting the issue of not being able to remove parent ul elements which is helpful but couldn’t spot anything dealing with child pages and nesting thereof

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    is this for 1.3? Thought that wasnt arriving until January. Anyhoo I cant seem to get trunk installed to work properly.

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    The thread is in reference to 1.3, I think that the styles just need to be worked up and then submitted as a patch. I had issues using trunk on a fairly clean MS install not sure why but lots of odd issues had to install on a plain WP copy in the end.

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    yeah I have a MS install let me try on a single. I have the styles almost worked out. Also back to the IE6 issue. If the rest of BP is not supporting it why should the nav not to mention 2010 doesn’t. The display:none method is easier for customization on the user end

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    Display:none is an accessibility no no, left:-999em ought to be used, not so much a IE thing.

    My concern was more for the inability of IE6 to grok :hover on anything but anchor elements, adminbar covers this aspect so I added / submitted a patch to add sfhover class so any hover styles need to be grouped with the class selector .sfhover so IE6 can function.

    tbh it shouldn’t really be a question of whether BP is supporting IE6 although naturally if that’s the descision it wants to make for bp-default then that’s fine, I have on a to do list and promised a while back a IE6 CC stylesheet and will get around to it at some point soon? hopefully

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    well that was my next suggestion. browser fixes should be in it’s own file.

    @modemlooper great to hear :)

    @hnla I’ve put those two patches on the ticket into trunk

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    @djpaul here’s what I got so far. I think a couple of these styles are redundant or could be redone with less code. I didn’t mess with the original nav css, that code might be able to be integrated into the drop menu’s css.

    /* Menu


    */

    ul#nav li.selected:hover > a,
    ul#nav li.current_page_item:hover > a,
    ul#nav li.current_menu_item:hover > a {
    background: #333;
    color: #fff;
    }

    #nav ul {
    box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    display: none;
    position: absolute;
    top: 30px;
    left: 0;
    float: left;
    width: 180px;
    z-index: 99999;
    }

    #nav ul li {
    min-width: 180px;
    position: relative;
    }

    #nav ul a {
    background: #333;
    padding: 10px;
    width: 160px;
    height: auto;
    }

    #nav ul li a {
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topright: 0px;
    -webkit-border-top-right-radius: 0px;
    }

    #nav ul.sub-menu li a {
    background: #333;
    color: #fff;
    }

    #nav li.current_page_item a:hover,
    #nav li.current_menu_item a:hover,
    #nav ul.sub-menu li a:hover {
    background: #222;
    }

    #nav li:hover > a,
    #nav ul ul :hover > a {
    background: #333;
    color: #fff;
    }

    #nav li:hover > ul {
    display: block;
    }

    #nav ul ul {
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    }

Viewing 11 replies - 26 through 36 (of 36 total)

You must be logged in to reply to this topic.