Menu in Coherent theme

• 

  notdjp · Member · Feb 16, 2016 at 10:39 am

  • Copy link
  • Add topic to favorites

  Hi everyone,
  I’m using the Coherent them on this site: https://vicioustheatre.wordpress.com/

  I’ve been trying to work out how to remove the words “Show” and “Hide” at the top of the menu. It seems to be a CSS sub element, but I don’t know what the code is to remove the words. The closest I’ve gotten is using

  .action-text::before {
  display: none;
  }

  … which only turns off the display of the menu icon (which I want to keep).

  Does anyone have any ideas?

  Thanks,
  David

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

• 

  staff-jeanpierreac · Staff · Feb 16, 2016 at 12:29 pm

  • Copy link

  Hi David.

  If you apply display:none to .action-text you won’t be able to show those 3 lines (.action-text:before). So in fact you need to make invisible (visibility:hidden) the text (.action-text) but without doing the same with the 3 lines (.action-text:before).

  How?

  element.style {
  }
  span.action-text:before {
      visibility: visible;
  }
  span.action-text {
      visibility: hidden;
  }

  But this will cause to have a black background because even if the text is not visible there is a assigned to it. You can override this by making this text little, tiny… or even smaller :)

  span.action-text {
      visibility: hidden;
      font-size: 0;
  }

  I hope this helps.

• 

  notdjp · Member · Feb 17, 2016 at 4:31 am

  • Copy link

  Thanks for that. That fixed it!

• 

  staff-jeanpierreac · Staff · Feb 18, 2016 at 1:53 pm

  • Copy link

  You are very welcome! :)

• 

  notdjp · Member · Mar 14, 2016 at 12:53 am

  • Copy link

  Just another thought. Is there some way to change the word “Show” to “Menu”

• 

  staff-jeanpierreac · Staff · Mar 14, 2016 at 11:29 am

  • Copy link

  Hi there!

  You cannot change this text. But you can make it very, very, small and add “MENU” after it, with the regular size.

  span.action-text:after {
      content: "MENU";
      font-size: 1rem;
  }
  span.action-text {
      font-size: 0px;
  }

  Hope this helps!