Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #20768

    On the navigation bar menu items, could you please assist me in decreasing the opacity so that the items can be better seen? People who have sight challenges are having some difficulty in distinguishing whether they are active or not.

    #109010

    Hi deforestm,

    Kindly add this code in Quick CSS(located in Incarnation > Theme Options > Styling) or custom.css:

    .header_color .main_menu ul:first-child > li a:hover, .header_color .main_menu ul:first-child > li.current-menu-item > a, .header_color .main_menu ul:first-child > li.current_page_item > a, .header_color .main_menu ul:first-child > li.active-parent-item > a {
    color: black;
    }

    or, if that doesn’t work, try this instead:

    .header_color .main_menu ul:first-child > li a:hover, .header_color .main_menu ul:first-child > li.current-menu-item > a, .header_color .main_menu ul:first-child > li.current_page_item > a, .header_color .main_menu ul:first-child > li.active-parent-item > a {
    color: black;
    }

    Just replace the color if black doesn’t fit. The original color is gray. Hope this helps.

    Regards,

    Ismael

    #109011

    Ismael,

    Thank you kindly sir for your response. Your suggestion works just fine. And a nice exercise in how to use Quick CSS. Thank you. But I should have been more specific. I have 2nd tier drop-downs from the Nav Bar that I would like to change to a darker color, such as crimson. Would you happen to have a solution for this?

    Thanks again.

    DeForest

    #109012

    Ismael,

    Just to add… the 2nd tier drop down would only turn to a darker color once you hover over them.

    DM

    #109013

    Hi,

    I am not so good with telling what is crimson but I will give you the CSS you have now and you can substitute the color code for the one that you like

    #top .header_color .main_menu ul:first-child > li > a, #top .header_color .main_menu .menu ul .current_page_item > a, #top .header_color .main_menu .menu ul .current-menu-item > a {
    color: #960505; /*normal link color dark red*/
    }
    #top .header_color .main_menu ul:first-child > li a:hover, #top .header_color .main_menu ul:first-child > li.current-menu-item > a, #top .header_color .main_menu ul:first-child > li.current_page_item > a, #top .header_color .main_menu ul:first-child > li.active-parent-item > a {
    color: #A98080; /*hover..mouse over..current page - color faded dark red*/
    }

    Thanks,

    Nick

    #109014

    Incredible… thank you Nick :) It definitely works.

    #109015

    Hi deforestm,

    Glad that Nick helped you. :)

    Cheers,

    Ismael

Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘DECREASING OPACITY ON NAVIGATION BAR’ is closed to new replies.