menu text colour

  • Author
    Posts
  • #157608
    jensoffe
    Member

    hi, how can i change the colour of the menu text in mobile and tablet? in the desktop version it looks fine, the text is dark brown, but in the mobile and tablet formats it becomes white which on a yellow background is near-invisible. any help appreciated. thanks

    The blog I need help with is: (visible only to logged in users)

    #157656
    itsdavidmorgan
    Theme Author

    Hello,

    No problem. Within the Additional CSS section of the Customizer, add the following styles:

    .menu-toggle,
    #navigation .mobile-menu a {
      color: #666666 !important;
    }
    #navigation .mobile-menu a:hover {
      color: #000000 !important;
    }

    You will need to adjust the color hex codes to match the colors you desire, but that should do the trick.

    Thanks!

    #157719
    jensoffe
    Member
    Original poster

    Hi, thanks for the reply – but where exactly? It is the menus that I want to change the colour of on the mobile format, so in the edit homepage area there is a section for menus, then I can select Primary Menu, but there doesn’t seem to be an Additional CSS section in that page – if there is, how do I access it? Also, what is a “hex code” please?
    thanks

    #157743
    jensoffe
    Member
    Original poster

    Hi, i have now managed to paste the Additional CSS and that seems to work, thanks very much. Didn’t do anything about “hex code”, pls can you explain that bit?
    thanks again

    #157744
    itsdavidmorgan
    Theme Author

    Hello,

    Glad you found the Additional CSS section :)

    Hex codes are 6 digit codes that refer to a color in HTML code. You can use the following color picker to choose your desired hex code, https://htmlcolorcodes.com/color-picker/

    I hope this helps. Thanks!

    #157942
    jensoffe
    Member
    Original poster

    Hi, the additional CSS has changed the text colour but the horizontal bars next to the word MENU on the mobile format are still white, they have not changed colour and so are difficult to see, making the word look off-centre. How do I change the bars to the same grey colour as the text please? thanks

    #157948
    itsdavidmorgan
    Theme Author

    Hello,

    No problem, the hamburger menu icon color can be changed by adding the following style:

    .menu-toggle::before {
        color: #666666 !important;
    }

    I hope this helps. Thanks!

  • The topic ‘menu text colour’ is closed to new replies.