JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<title>FLIR ITS Datasheets</title>
<link rel="stylesheet" href="webjars/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="webjars/bootstrap/3.1.1/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/jquery.fileupload.css">
<link rel="stylesheet" href="css/offline-theme-slide.css">
<link rel="stylesheet" href="css/offline-language-english.css">
<link rel="stylesheet" href="css/xeditable.css">
<link rel="stylesheet" href="css/datasheets.css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="">
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<ul class="nav navbar-nav">
<li><a href="#">Home</a></li>
<li><a href="#/search">Search</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Administration</a></li>
</ul>
</div>
</nav>
<!-- ngView: --><div ng-view="" class="ng-scope"><div class="container ng-scope">
<h1 class="ng-binding">My Datasheet name</h1>
<div class="row">
<div class="form-group">
<span class="control-label col-xs-2"><b>Name</b></span>
<div class="col-xs-10 editable-with-icon">
<span class="form-control-static"><a href="#" editable-text="datasheet.name" e-required="" onbeforesave="updateName($data)" class="ng-scope ng-binding editable editable-click">My Datasheet name<span class="glyphicon glyphicon-pencil editable-with-icon-icon"></span></a></span>
</div>
...