JSFiddle - React, Tailwind, and code Playground

by Ray Mak

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular-animate.js"></script>
<div ng-app="Dashboard">
	<div id="dashboard" ng-controller="dashboardCtrl">
		<div class="app-nav">
			<button onclick="location.href = '/ServerMatrix';">ServerMatrix</button>
		</div><br>
		<div class="app-nav">
			<button onclick="location.href = 'Applications';">Healthchecks</button>
		</div><br>
		<div class="app-nav">
			<button>Contact US</button>
		</div><br>
	</div>	
</div>

CSS

#dashboard {
	margin-top: 50px;
}

.app-nav {
	max-width: 350px;
	min-height: 75px !important;
	margin: 0 auto;
}

.app-nav button:hover {
	background-color: #154995;
}

.app-nav button {
	min-width: 350px;
	min-height: 75px;
}

button.ng-enter {
	transition:3s linear all;
	opacity:0;
}

button.ng-enter.ng-enter-active {
	opacity:2;
}

JavaScript

angular.module('Dashboard', ['ngAnimate'])
.controller('dashboardCtrl', function($scope) {

});