Ondersteuning » Thema en CSS/opmaak » Mobiel menu kleur veranderen

  • Opgelost bartjeroenvandenberg

    (@bartjeroenvandenberg)


    Ik zou graag de kleur van het menu (enkel op mobiele weergave) veranderen van kleur (#FFAB50). Daarnaast zou ik graag de schaduw uitschakelen. Ik heb het idee dat ik een aangepaste CSS moet schrijven, maar weet niet precies welke. Zou iemand me hierbij kunnen helpen? Veel dank alvast!

    De pagina waar ik hulp bij nodig heb: [log in om de link te zien]

8 reacties aan het bekijken - 1 tot 8 (van in totaal 8)
  • Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    De huidige CSS hierop is:

    .main-navigation [class^="fa fa-"], .main-navigation .mobile-nav-icon {
      color: #d1d1d1;
    }

    Dus als je zelf die code gebruikt in Weergave > Customizer > Extra CSS – en je verandert de HEX waarde naar welk kleur je wilt, zou dat de huidige code moeten overschrijven.

    Ik heb verder gekeken maar daarop zit geen schaduw, wat bedoel je precies?

    Thread starter bartjeroenvandenberg

    (@bartjeroenvandenberg)

    Wat een snelle reactie, geweldig! Heb het aangepast, nu is inderdaad de kleur van het menu-icoontje veranderd. Dat is ook top eigenlijk. Wat ik bedoelde was de tekst van de verschillende menu items, dus als ik op mobiele weergave op menu heb geklikt. Ik zie dan de vijf verschillende submenu’s in het zwart, met een soort van schaduw erachter. Dat maakt het moeilijker leesbaar vind ik. Weet je toevallig ook die code?

    Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    Ah daar, ja hoor:

    .mobile-nav-frame ul li a.link {
      text-shadow: none;
    }
    Thread starter bartjeroenvandenberg

    (@bartjeroenvandenberg)

    Top!! Dit gaat lekker zo. Maar om het dan nog helemaal af te maken, weet je hoe ik ook deze kleur kan veranderen? Is dat dan color invoeren in bovenstaande code? En dan is er ook nog het woord ‘menu’ zelf, dus als ik al op menu heb geklikt. Die heeft nu nog wel schaduw. Excuses voor de vele vragen, maar je helpt enorm!

    Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    Ja in dezelfde CSS selector kan je ook color:#… invullen om de kleur van je menu items te veranderen, maar weet dat fel oranje op wit niet goed is qua contrast 😉

    Ik zou het gwn zwart houden als ik van jou was, hetzelfde met het woordje Menu.

    Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    Ah maar als je menu opent, net boven de lijst heb je nog eens menu staan met text-shadow, wellicht wil je dit ook weghalen:

    .mobile-nav-frame .title h3 {
      text-shadow: none;
    }
    Thread starter bartjeroenvandenberg

    (@bartjeroenvandenberg)

    Gelukt, geweldig!! Had er zelf al een paar uur op zitten studeren, dit is toch een stuk sneller

    Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    Kwestie van de browser console en inspector goed te gebruiken in je browser 🙂 Fijn dat ik je kon helpen.

    Ik markeer het topic als opgelost.

8 reacties aan het bekijken - 1 tot 8 (van in totaal 8)