<head>
	<link rel="stylesheet" href="https://unpkg.com/bulma/css/bulma.css" />
</head>
<body>
	<div id="app">
		<nav class="navbar">
			<div class="navbar-brand">
				<a @click="showNav = !showNav" 
				   :class="{ 'is-active' : showNav }" 
				   class="navbar-burger">
					<span></span>
					<span></span>
					<span></span>
				</a>
			</div>
		</nav>
	</div>
	<script src="https://unpkg.com/vue"></script>
</body>
#app {
	display: flex;
	flex-flow: row;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100vh;
}

#app .navbar-burger {
	display: block;
}
new Vue({
    el: '#app',
    data: {
		showNav: false,
	}
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.