Home Forums Weaver Xtreme Theme Menu bar coloring per page – Weaver Xtreme

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #17697
    GoScoutUK
    Participant

    Joy gave me a great css list for colouring menu bars on specific pages for Weaver II.

    Can anyone update the list for Weaver Xtreme? The same css does not seem to work on the new theme.

    Thanks

    You can see them on http://www.cambodianinnocence.com, where each menu header is supposed to have its own menu bar color-set.

    /*Menu bar background color*/
    .page-id-24  #access {background-color:#ff3232 ! important;}

    /*General text and background color*/
    .page-id-24 .menu_bar li a, .page-id-24 .menu_bar a:visited {color:white !important;background-color:#ff3232 !important;}

    /*Hover text and background*/
    .page-id-24 .menu_bar a:hover, .page-id-24 .menu_bar a:focus {color:black !important;background-color:#ffafae !important;}

    /*Current menu text and background*/
    .page-id-24 .menu_bar ul li.current_page_item > a, .page-id-24 .menu_bar ul li.current-menu-item > a {color:black !important;background-color:#ff3232 !important;}

    /*Submenu text and background color*/
    .page-id-24 .menu_bar ul ul a {color:white !important;background-color:#ff3232 !important;}

    /*Sub menu hover*/
    .page-id-24 .menu_bar ul ul a:hover {color:black !important;background-color:#ffafae !important;}

    /*Sub menu Current*/
    .page-id-24 .menu_bar ul li.current_page_item > a, .menu_bar ul li.current-menu-item > a {color:black !important;background-color:#ff3232 !important;}

    #21739
    scrambler
    Moderator

    The rules below should do it.

    If you need to target primary only or secondary only or extra only, you would have to change

    .wvrx-menu-container

    to the one below, using primary, secondary or extra

    .menu-primary .wvrx-menu-container

    /*Menu bar background color*/
    .page-id-24  .wvrx-menu-container {background-color:#ff3232 ! important;}

    /*General text and background color*/
    .page-id-24 .wvrx-menu > li > a {color:white !important;background-color:#ff3232 !important;}

    /*Hover text and background*/
    .page-id-24 .wvrx-menu > li > a:hover {color:black !important;background-color:#ffafae !important;}

    /*Current menu text and background*/
    .page-id-24 .weaverx-theme-menu .current_page_item > a, .page-id-24 .weaverx-theme-menu .current-menu-item > a, .page-id-24 .weaverx-theme-menu .current-cat > a, .page-id-24 .weaverx-theme-menu .current_page_ancestor > a, .page-id-24 .weaverx-theme-menu .current-category-ancestor > a, .page-id-24 .weaverx-theme-menu .current-menu-ancestor > a, .page-id-24 .weaverx-theme-menu .current-menu-parent > a, .page-id-24 .weaverx-theme-menu .current-category-parent > a {color:black !important;background-color:#ff3232 !important;}

    /*Submenu text and background color*/
    .page-id-24 .wvrx-menu ul li a, .page-id-24 .wvrx-menu ul.mega-menu li {color:white !important;background-color:#ff3232 !important;}

    /*Sub menu hover*/
    .page-id-24 .wvrx-menu ul li a:hover {color:black !important;background-color:#ffafae !important;}

    #21740
    GoScoutUK
    Participant

    Thank you so much. This all works perfectly

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.