@vcl/vcl
Version:
The whole VCL in one package
40 lines (35 loc) • 1.58 kB
HTML
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font/css/materialdesignicons.min.css">
<div class="toolbar scale110p row justify-between" role="menubar" aria-level="1">
<a class="row center" href="#">
<img class="responsive-image logo" role="presentation" src="https://cdn.jsdelivr.net/gh/vcl/vcl/gfx/vcl_logo_square-bw.svg" style="max-width: 3em;">
<h1 class="toolbar-title">App Name</h1>
</a>
<nav class="navigation">
<ul class="row">
<li class="navigation-item" role="presentation" tabindex="0">
<a class="navigation-item-label icogram" href="#" tabindex="-1">
<span class="icon mdi mdi-home" aria-hidden="true" aria-label="home" role="img"></span>
<span class="text">Link 1</span>
</a>
</li>
<li class="navigation-item selected" tabindex="0">
<a class="navigation-item-label icogram" href="#" tabindex="-1">
<span class="icon mdi mdi-email" aria-hidden="true" aria-label="envelope" role="img"></span>
<span class="text">Link 2</span>
</a>
</li>
</ul>
</nav>
<div class="row">
<button type="button" class="button half-transparent square">
<div class="icogram">
<div class="icon mdi mdi-email" aria-hidden="false" aria-label="contact" role="img"></div>
</div>
</button>
<button type="button" class="button half-transparent square">
<div class="icogram">
<div class="icon mdi mdi-account" aria-hidden="false" aria-label="account" role="img"></div>
</div>
</button>
</div>
</div>