Language

Component that shows the different languages available within the platform. It behaves like a flyout. When hovering on desktop or when clicking on mobile, it will show the different languages available.

Default

px 

			
				<div class="m-language js-language ">
	<button class="m-language__active">NL</button>
	<ul class="m-language__list">
		<li class="m-language__item">
			<a class="m-language__link" href="#">NL</a>
		</li>
		<li class="m-language__item">
			<a class="m-language__link" href="#">EN</a>
		</li>
		<li class="m-language__item">
			<a class="m-language__link" href="#">FR</a>
		</li>
	</ul>
</div>

Documentation

States

  • is-open

    Indicates that the language is shown to the user. On desktop this is automatically done by hovering, but on mobile the user has to click to view the options.