Updated station card and footer design

Removed user count from station cards and replaced with Official badge 
and "Hosted by" tags. 

@jonathan-grah can you make the footer sticky please?

frontend/components/MainFooter.vue

@@ -2,9 +2,6 @@
 	<footer class="footer">
 		<div class="container">
 			<div class="content has-text-centered">
-				<p>
-					© Copyright Musare 2015 - 2019
-				</p>
 				<p>
 					<a
 						class="icon"
@@ -39,6 +36,10 @@
 						<img src="/assets/social/discord.svg" />
 					</a>
 				</p>
+				<a href="https://musare.com" target="_blank"><img class="musareFooterLogo" src="/assets/wordmark.png" alt="Musare"></a>
+				<p>
+					© Copyright Musare 2015 - 2019
+				</p>
 			</div>
 		</div>
 	</footer>
@@ -55,6 +56,23 @@
 	flex-direction: column;
 }
 
+.footer {
+		border-radius: 33% 33% 0% 0% / 7% 7% 0% 0%;
+		box-shadow: 0 4px 8px 0 rgba(3, 169, 244, 0.65), 0 6px 20px 0 rgba(3, 169, 244, 0.4);
+		background-color: #ffffff;
+		margin-top: 50px;
+		padding-bottom: 25px;
+		width: 100%;
+
+		.musareFooterLogo {
+			display: block;
+		  margin-left: auto;
+		  margin-right: auto;
+			margin-bottom: 15px;
+		  width: 200px;
+		}
+	}
+
 .icon:hover {
 	color: #90298c !important;
 }

frontend/components/pages/Home.vue

@@ -33,17 +33,7 @@
 						</div>
 
 						<div class="under-content">
-							<i
-								class="material-icons"
-								title="How many users there are in the station."
-								>people</i
-							>
-							<span
-								class="users-count"
-								title="How many users there are in the station."
-								>&nbsp;{{ station.userCount }}</span
-							>
-
+							<span class="official"><i class="badge material-icons">verified_user</i>Official</span>
 							<i
 								v-if="station.privacy !== 'public'"
 								class="material-icons right-icon"
@@ -106,17 +96,7 @@
 							{{ station.description }}
 						</div>
 						<div class="under-content">
-							<i
-								class="material-icons"
-								title="How many users there are in the station."
-								>people</i
-							>
-							<span
-								class="users-count"
-								title="How many users there are in the station."
-								>&nbsp;{{ station.userCount }}</span
-							>
-
+							<span class="hostedby">Hosted by <span class="host">{{$parent.getUsernameFromId(station.owner)}} {{userIdMap['Z' + station.owner]}}</span></span>
 							<i
 								v-if="station.privacy !== 'public'"
 								class="material-icons right-icon"
@@ -166,6 +146,7 @@ export default {
 				official: [],
 				community: []
 			},
+      userIdMap: this.$parent.userIdMap,
 			nightMode: false
 		};
 	},
@@ -343,6 +324,29 @@ html {
 		position: relative;
 	}
 
+  .official {
+    font-size: 18px;
+    color: #03a9f4;
+    position: relative;
+    top: -5px;
+
+    .badge {
+      position: relative;
+      padding-right: 2px;
+      color: #38d227;
+      top: +5px;
+    }
+  }
+
+  .hostedby {
+    font-size: 15px;
+
+    .host {
+      font-size: 18px;
+      color: #03a9f4;
+    }
+  }
+
 	.right-icon {
 		float: right;
 	}