Options

Possible to change menu dropdown color?

cameronfieldcameronfield Registered Users Posts: 2 Beginner grinner
edited April 12, 2014 in SmugMug Customization
Hello guys! Loving my smugmug site, getting it tweaked how I like it. It's great, but the background color of the dropdown menu is too dark. Is there a way to change it, or is it linked to the background color? Could I change the opacity? Check out my site, you can see how dark the main menu dropdown is - www.cameronfield.com

Comments

  • Options
    RobLoudRobLoud Registered Users Posts: 45 Big grins
    edited April 12, 2014
    Hello guys! Loving my smugmug site, getting it tweaked how I like it. It's great, but the background color of the dropdown menu is too dark. Is there a way to change it, or is it linked to the background color? Could I change the opacity? Check out my site, you can see how dark the main menu dropdown is - www.cameronfield.com

    You can try adding this to your themes CSS or a CSS block on Entire Site:
    /* Set the default navbar submenu background color */
    .yui3-menu .yui3-menu-children .yui3-menu-item .yui3-menu-label {
      background: #2d2d2d;
    }
    /* Set the navbar submenu hover background color */
    .yui3-menu .yui3-menu-children .yui3-menu-item .yui3-menu-label:hover {
      background: #212121 !important;
    }
    

    This should allow you to change the background color and the hover color.

    Robin
  • Options
    cameronfieldcameronfield Registered Users Posts: 2 Beginner grinner
    edited April 12, 2014
    RobLoud wrote: »
    You can try adding this to your themes CSS or a CSS block on Entire Site:
    /* Set the default navbar submenu background color */
    .yui3-menu .yui3-menu-children .yui3-menu-item .yui3-menu-label {
      background: #2d2d2d;
    }
    /* Set the navbar submenu hover background color */
    .yui3-menu .yui3-menu-children .yui3-menu-item .yui3-menu-label:hover {
      background: #212121 !important;
    }
    

    This should allow you to change the background color and the hover color.

    Robin

    That worked, thank you. It still looks rough without being able to change the opacity or transparency. Is this possible? Thanks for your help.
  • Options
    AllenAllen Registered Users Posts: 10,012 Major grins
    edited April 12, 2014
    That worked, thank you. It still looks rough without being able to change the opacity or transparency. Is this possible? Thanks for your help.
    Try this with the color you want. .50 is the transparency. .10 > .90 (darker)

    background: rgba(128, 128, 128, .50);

    Might need !important.
    ... .50) !important;
    Al - Just a volunteer here having fun
    My Website index | My Blog
Sign In or Register to comment.