<!DOCTYPE html>
<html ng-app="mgcrea.ngStrapDocs">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="//mgcrea.github.io/angular-strap/styles/angular-motion.min.css">
  <link rel="stylesheet" href="//mgcrea.github.io/angular-strap/styles/bootstrap-additions.min.css">
  <link rel="stylesheet" href="//mgcrea.github.io/angular-strap/styles/libraries.min.css">
  <link rel="stylesheet" href="//mgcrea.github.io/angular-strap/styles/main.min.css">
  <script src="//code.angularjs.org/1.2.23/angular.min.js" data-semver="1.2.23"></script>
  <script src="//code.angularjs.org/1.2.23/angular-animate.min.js" data-semver="1.2.23"></script>
  <script src="//code.angularjs.org/1.2.23/angular-sanitize.min.js" data-semver="1.2.23"></script>
  <script src="//mgcrea.github.io/angular-strap/dist/angular-strap.js" data-semver="v2.1.2"></script>
  <script src="//mgcrea.github.io/angular-strap/dist/angular-strap.tpl.js" data-semver="v2.1.2"></script>
  <script src="app.js"></script>
  <script src="//mgcrea.github.io/angular-strap/scripts/docs.tpl.js" data-semver="v2.1.2"></script>
  <script src="//mgcrea.github.io/angular-strap/scripts/demo.tpl.js" data-semver="v2.1.2"></script>
</head>

<body>

  <div class="col-lg-8 col-md-8 col-sm-8 col-lg-offset-2" ng-controller="TabsAndTablesCtrl">
    <div ng-model="tabs.activeTab" data-nav-class='nav-justified nav-pills' bs-tabs>
      <div ng-repeat="tab in tabs" title="{{ tab.title }}" ng-bind="tab.content" bs-pane></div>
    </div>
  </div>
</body>

</html>
/* Put your css in here */

body {
  padding: 40px !important;
}

var app = angular.module('mgcrea.ngStrapDocs', ['ngAnimate', 'ngSanitize', 'mgcrea.ngStrap']);

app.controller('MainCtrl', function($scope) {
});

'use strict';

angular.module('mgcrea.ngStrapDocs').controller('TabsAndTablesCtrl', function($scope) {

        $scope.tabs = [
            {title:'Projects', content: 'Raw denim you probably haven\'t heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica.'},
            {title:'Tasks', content: 'Food truck fixie locavore, accusamus mcsweeney\'s marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee.'},
            {title:'Documents', content: 'Etsy mixtape wayfarers, ethical wes anderson tofu before they sold out mcsweeney\'s organic lomo retro fanny pack lo-fi farm-to-table readymade.'},
            {title:'Users', content: 'Etsy mixtape wayfarers, ethical wes anderson tofu before they sold out mcsweeney\'s organic lomo retro fanny pack lo-fi farm-to-table readymade.'}
        ];

        $scope.tabs.activeTab = 1;
});