Added Bulma via npm so we could override default colors cleaner.

frontend/App.vue

@@ -113,4 +113,4 @@
 			}
 		}
 	}
-</script>
+</script>

frontend/build/index.html

@@ -8,7 +8,6 @@
 	<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" type="text/css">
 	<link href="https://fonts.googleapis.com/css?family=Roboto:100,400" rel="stylesheet">
 	<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-	<link rel="stylesheet" href="./vendor/bulma.min.css">
 	<link rel="stylesheet" href="./index.css">
 	<script src="https://www.youtube.com/iframe_api"></script>
 	<script src="./vendor/jquery.min.js"></script>

frontend/components/MainHeader.vue

@@ -13,16 +13,16 @@
 		</span>-->
 
 		<div class="nav-right">
-			<a class="nav-item" href="#" v-link="{ path: '/admin' }">
+			<a class="nav-item is-tab" href="#" v-link="{ path: '/admin' }">
 				Admin
 			</a>
-			<a class="nav-item" href="#">
+			<a class="nav-item is-tab" href="#">
 				About
 			</a>
-			<a class="nav-item" href="#">
+			<a class="nav-item is-tab" href="#">
 				Donate
 			</a>
-			<a class="nav-item" href="#" v-if="$parent.$parent.loggedIn" @click="$parent.$parent.logout()">
+			<a class="nav-item is-tab" href="#" v-if="$parent.$parent.loggedIn" @click="$parent.$parent.logout()">
 				Sign Out
 			</a>
 			<span class="grouped" v-else>
@@ -38,9 +38,21 @@
 </template>
 
 <style lang="sass" scoped>
+	@import 'theme.scss';
+
+	.nav {
+		background-color: $primary-color;
+		.is-brand {
+			font-size: 26px !important;
+		}
+		.nav-item {
+			font-size: 15px;
+			color: $secondary-color;
+		}
+	}
 	.grouped {
 		margin: 0;
 		display: flex;
 		text-decoration: none;
 	}
-</style>
+</style>

frontend/components/pages/Home.vue

@@ -113,6 +113,9 @@
 </script>
 
 <style lang="sass">
+
+	@import 'theme.scss';
+	
 	* { box-sizing: border-box; font-family: Roboto, sans-serif; }
 
 	html {

frontend/package.json

@@ -27,7 +27,8 @@
     "vue-loader": "^8.5.2",
     "vue-style-loader": "^1.0.0",
     "webpack": "^1.13.2",
-    "webpack-dev-server": "^1.15.1"
+    "webpack-dev-server": "^1.15.1",
+    "bulma": "^0.2.3"
   },
   "dependencies": {
     "vue": "^1.0.26",

frontend/theme.scss

@@ -0,0 +1,4 @@
+$primary-color: #424242;
+$secondary-color: #ffffff;
+
+@import '~bulma';