Add styling to active tab

client/admin/admin.jsx

@@ -27,7 +27,6 @@ const Admin = createClass({
 
 	render : function(){
 		return <div className='admin'>
-
 			<header>
 				<div className='container'>
 					<i className='fas fa-rocket' />
@@ -36,7 +35,7 @@ const Admin = createClass({
 			</header>
 			<div className='container'>
 				<div className='tabs'>
-					{tabGroups.map((tab, idx)=>{ return <button key={idx} onClick={()=>{ return this.handleClick(tab); }}>{tab.toUpperCase()}</button>; })}
+					{tabGroups.map((tab, idx)=>{ return <button className={tab===this.state.currentTab ? 'active' : ''} key={idx} onClick={()=>{ return this.handleClick(tab); }}>{tab.toUpperCase()}</button>; })}
 				</div>
 				{this.state.currentTab==='brew' && <BrewUtils />}
 				{this.state.currentTab==='notifications' && <NotificationUtils />}

client/admin/admin.less

@@ -40,5 +40,25 @@ body{
 		margin : 30px 0px;
 	}
 
-
+	.container{
+		.tabs button{
+			background-color: #eee;
+			margin-left: 3px;
+			margin-right: 3px;
+			border: 1px solid #444;
+			border-radius: 5px;
+			color: black;
+			&:hover{
+				background-color: #444;
+				color: #eee;
+			}
+			&.active{
+				border: 2px solid #444;
+				text-decoration: underline;
+				margin-left: 2px;
+				margin-right: 2px;
+				background-color: #ccc;
+			}
+		}
+	}
 }