JSFiddle - React, Tailwind, and code Playground
Button bar for Ubigreen
by Zonedark
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<div ng-controller="MyCtrl">
<div style="width:1800px;height:800px;background:rgb(238, 238, 238);overflow: auto">
<div class="container">
<div class="row">
<div class="col-md-1">
<button class="bottombutton">
Back
</button>
</div>
<div class="col-md-1 col-md-offset-9">
<button class="bottombutton">
Cancel
</button>
</div>
<div class="col-md-1">
<button class="bottombutton" style="color:rgb(0, 156, 255)">
Continue
</button>
</div>
</div>
</div>
</div>
</div>
CSS
.container {
//border: solid 2px black;
-moz-box-shadow: 0px 2px 3px 1px #c0c0c0;
-webkit-box-shadow: 0px 2px 3px 1px #c0c0c0;
-o-box-shadow: 0px 2px 3px 1px #c0c0c0;
box-shadow: 0px 2px 3px 1px #c0c0c0;
filter: progid: DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=180, Strength=3);
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
margin-left: 10px;
margin-top: 10px;
vertical-align: middle;
padding-left: 20px;
background-color: white;
padding: 0;
}
.bottombutton{
background-color:white;
border:none;
font-weight:bold;
font-size:150%;
}
JavaScript
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', ['$scope', function($scope) {
$scope.name = "Angular";
}]);