# Navigation

# Top bar

design front-end roxen cms

# Notes voor DEV

  • <1023px naar mobile variant
  • De taalswitcher van HAN.nl navigeert tussen HAN.nl, HANuniversity.com/en en HANuniversity.com/de

# Top bar Mobiel

design front-end roxen cms design front-end roxen cms

# Notes voor DEV

  • Op mobiel zit er een divider van 16px tussen de content en de taalswitcher + account uitklap (de kleur is #1a1a1a)
  • Op mobiel zit er altijd minimaal 32px ruimte tussen de onderkant van het menu en het laatste item (de kleur is #1a1a1a)

# Top bar op Insite

design front-end roxen cms

# Notes voor DEV

  • <1023px naar mobile variant
  • Elke Insite krijgt in het Main Menu links van het HAN logo een plek om aan te geven dat je op Insite zit (en op welke)
  • met het account iccoon kun je switchen tussen student of medewerker content
  • met de language switcher kun je switchen tussen de Insite met Nederlandse en Internationale studentencontent
design front-end roxen cms

# Notes voor DEV

  • Op mobiel zit er een divider van 16px tussen de content en de taalswitcher + account uitklap (de kleur is #1a1a1a)
  • Op mobiel zit er altijd minimaal 32px ruimte tussen de onderkant van het menu en het laatste item (de kleur is #1a1a1a)

# Opleidingsbalk

design front-end roxen cms

# Opleidingsbalk Mobiel

# Opleidingsmenu Mobiel

design front-end roxen cms

On scroll down:

  • verdwijnt de topbalk.
  • verandert de opleidingsbalk kleur naar zwart.
  • verandert de opleidingsnaam in de pagina-naam

Menu active:

  • huidige pagina is active en sub items zichtbaar

opleiding-menu-mobile



design front-end roxen cms
design front-end roxen cms

# Niet ingeklapt

# Meer dan 7 items, wel ingeklapt


# Panel Navigation

design front-end roxen cms