6.33 Navigation Tiles View in a new window
A row of click-able tiled boxes. The row wraps when required to form multiple rows.
Twig: components/navigation-tiles/navigation-tiles.twig
Example
Markup
<div class="navigation-tiles">
<a href="#" class="navigation-tiles__tile">
<div class="navigation-tiles__inner">
<div class="navigation-tiles__icon navigation-tiles__icon--uts-online"></div>
<div class="navigation-tiles__text">UTS Online</div>
</div>
</a>
<a href="#" class="navigation-tiles__tile">
<div class="navigation-tiles__inner">
<div class="navigation-tiles__icon navigation-tiles__icon--web-mail"></div>
<div class="navigation-tiles__text">Web mail</div>
</div>
</a>
<a href="#" class="navigation-tiles__tile">
<div class="navigation-tiles__inner">
<div class="navigation-tiles__icon navigation-tiles__icon--library"></div>
<div class="navigation-tiles__text">Library</div>
</div>
</a>
<a href="#" class="navigation-tiles__tile">
<div class="navigation-tiles__inner">
<div class="navigation-tiles__icon navigation-tiles__icon--handbook"></div>
<div class="navigation-tiles__text">Handbook</div>
</div>
</a>
<a href="#" class="navigation-tiles__tile">
<div class="navigation-tiles__inner">
<div class="navigation-tiles__icon navigation-tiles__icon--student"></div>
<div class="navigation-tiles__text">My Student Admin</div>
</div>
</a>
</div>