Got vuestrap-base-components working. Started implementing the header / navbar.

frontend/components/App.vue

@@ -21,6 +21,8 @@
 </script>
 
 <style lang="sass">
+	@import 'node_modules/vuestrap/bootstrap/bootstrap';
+
 	* { box-sizing: border-box; }
 	html {
 		width: 100%;

frontend/components/ComponentHeader.vue

@@ -1,15 +1,36 @@
 <template>
 	<div class="header">
-		{{ title }}	
+		<vs-navbar fixed="top" type="light" variant="default" full>
+			<a class="navbar-brand" href="#">Musare</a>
+			<vs-nav type="navbar" class="pull-xs-right">
+				<vs-nav-item link="#">The Project</vs-nav-item>
+				<vs-nav-item link="#">Donate</vs-nav-item>
+				<vs-nav-item link="#">
+					<vs-dropdown text="Account" size="md" variant="primary" :arrow="arrow" :caret="false">
+						<ul class="dropdown-menu dropdown-menu-left">
+							<li><a class="dropdown-item" href="#">Login</a></li>
+							<li><a class="dropdown-item" href="#">Register</a></li>
+						</ul>
+					</vs-dropdown>
+				</vs-nav-item>
+			</vs-nav>
+		</vs-navbar>
 	</div>
 </template>
 
 <script>
+	import vuestrapBase from 'vuestrap-base-components'
 	export default {
 		data() {
 			return {
 				title: "Musare ;)"
 			}
+		},
+		components: {
+			'vs-navbar': vuestrapBase.navbar,
+			'vs-nav':  vuestrapBase.nav,
+			'vs-nav-item': vuestrapBase.navItem,
+			'vs-dropdown': vuestrapBase.dropdown
 		}
 	}
 </script>

frontend/package.json

@@ -25,6 +25,8 @@
     "vue-html-loader": "^1.2.3",
     "vue-loader": "^8.5.2",
     "vue-style-loader": "^1.0.0",
+    "vuestrap": "^1.0.3",
+    "vuestrap-base-components": "^0.8.10",
     "webpack": "^1.13.2",
     "webpack-dev-server": "^1.15.1"
   },