demo(all): various fixes

angular-ui · Dec 28, 2013 · 428f147 · 428f147
1 parent 9613b61
commit 428f147
Show file tree

Hide file tree

Showing 11 changed files with 60 additions and 84 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -17,8 +17,7 @@ module.exports = function(grunt) {
 
   grunt.initConfig({
     ngversion: '1.0.8',
-    bsversion: '3.0.2',
-    faversion: '3.2.1',
+    bsversion: '3.0.3',
     modules: [],//to be filled in by build task
     pkg: grunt.file.readJSON('package.json'),
     dist: 'dist',

diff --git a/misc/demo/assets/demo.css b/misc/demo/assets/demo.css
@@ -63,7 +63,7 @@ section {
     border-bottom: 1px solid rgba(221,221,221,0.3);
 }
 
-.nav, .pagination, .carousel a {
+.nav, .pagination, .carousel, .panel-title a {
     cursor: pointer;
 }
 

diff --git a/misc/demo/index.html b/misc/demo/index.html
@@ -6,13 +6,12 @@
     <meta name="description" content="AngularJS (Angular) native directives for Twitter Bootstrap. Small footprint (5kB gzipped!), no 3rd party JS dependencies (jQuery, bootstrap JS) required! Widgets: <% demoModules.forEach(function(module) { %><%= module.displayName %>, <% }); %>">
     <meta name="google-site-verification" content="7lc5HyceLDqpV_6oNHteYFfxDJH7-S3DwnJKtNUKcRg" />
 
-    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/<%= ngversion %>/angular.min.js"></script>
+    <script src="//ajax.googleapis.com/ajax/libs/angularjs/<%= ngversion %>/angular.min.js"></script>
     <script src="ui-bootstrap-tpls-<%= pkg.version%>.js"></script>
     <script src="assets/plunker.js"></script>
     <script src="assets/app.js"></script>
 
-    <link href="http://netdna.bootstrapcdn.com/bootstrap/<%= bsversion %>/css/bootstrap.min.css" rel="stylesheet"/>
-    <link href="http://netdna.bootstrapcdn.com/bootstrap/<%= bsversion %>/css/bootstrap-glyphicons.css" rel="stylesheet">
+    <link href="//netdna.bootstrapcdn.com/bootstrap/<%= bsversion %>/css/bootstrap.min.css" rel="stylesheet"/>
     <link rel="stylesheet" href="assets/rainbow.css"/>
     <link rel="stylesheet" href="assets/demo.css"/>
     <link rel="author" href="https://github.com/angular-ui/bootstrap/graphs/contributors">
@@ -129,7 +128,7 @@ <h3>Dependencies</h3>
                     </p>
                     <ul>
                         <li><a href="http://angularjs.org" target="_blank">AngularJS</a> (minimal version 1.0.8 or 1.1.5)</li>
-                        <li><a href="http://getbootstrap.com/2.3.2/" target="_blank">Bootstrap CSS</a> (version 2.3)</li>
+                        <li><a href="http://getbootstrap.com" target="_blank">Bootstrap CSS</a> (version 3.0)</li>
                     </ul>
                     <h3>Files to download</h3>
                     <p>
@@ -154,7 +153,7 @@ <h3>CSS</h3>
                        This is why we need to remove empty <code>href</code> attributes from directive templates and as a result
                        styling is not applied correctly. The remedy is simple, just add the following styling to your application:
                        <code>
-                           .nav, .pagination, .carousel a {
+                           .nav, .pagination, .carousel, .panel-title a {
                                 cursor: pointer;
                            }
                        </code>

diff --git a/src/accordion/docs/demo.html b/src/accordion/docs/demo.html
@@ -13,7 +13,7 @@
     </accordion-group>
     <accordion-group heading="Dynamic Body Content">
       <p>The body of the accordion group grows to fit the contents</p>
-        <button class="btn btn-default btn-small" ng-click="addItem()">Add Item</button>
+        <button class="btn btn-default btn-sm" ng-click="addItem()">Add Item</button>
         <div ng-repeat="item in items">{{item}}</div>
     </accordion-group>
     <accordion-group is-open="isopen">

diff --git a/src/collapse/docs/demo.html b/src/collapse/docs/demo.html
@@ -1,7 +1,7 @@
 <div ng-controller="CollapseDemoCtrl">
-	<button class="btn" ng-click="isCollapsed = !isCollapsed">Toggle collapse</button>
+	<button class="btn btn-default" ng-click="isCollapsed = !isCollapsed">Toggle collapse</button>
 	<hr>
 	<div collapse="isCollapsed">
-		<div class="well well-large">Some content</div> 
+		<div class="well well-lg">Some content</div> 
 	</div>
 </div>
diff --git a/src/datepicker/docs/demo.html b/src/datepicker/docs/demo.html
@@ -3,7 +3,7 @@
 
     <h4>Inline</h4>
     <div style="display:inline-block; min-height:290px;">
-      <div class="well well-small" ng-model="dt">
+      <div class="well well-sm" ng-model="dt">
           <datepicker min="minDate" show-weeks="showWeeks"></datepicker>
       </div>
     </div>

diff --git a/src/pagination/docs/demo.html b/src/pagination/docs/demo.html
@@ -1,15 +1,11 @@
-<div ng-controller="PaginationDemoCtrl" class="well well-small">
+<div ng-controller="PaginationDemoCtrl">
     <h4>Default</h4>
-
     <pagination total-items="totalItems" page="currentPage"></pagination>
     <pagination boundary-links="true" total-items="totalItems" page="currentPage" class="pagination-sm" previous-text="&lsaquo;" next-text="&rsaquo;" first-text="&laquo;" last-text="&raquo;"></pagination>
     <pagination direction-links="false" boundary-links="true" total-items="totalItems" page="currentPage"></pagination>
     <pagination direction-links="false" total-items="totalItems" page="currentPage" num-pages="smallnumPages"></pagination>
-
-    <div>
-      <button class="btn btn-info" ng-click="setPage(3)">Set current page to: 3</button>
-      The selected page no: {{currentPage}}
-    </div>
+    <pre>The selected page no: {{currentPage}}</pre>
+    <button class="btn btn-info" ng-click="setPage(3)">Set current page to: 3</button>
 
     <hr />
     <h4>Pager</h4>
@@ -19,6 +15,5 @@ <h4>Pager</h4>
     <h4>Limit the maximum visible buttons</h4>
     <pagination total-items="bigTotalItems" page="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true"></pagination>
     <pagination total-items="bigTotalItems" page="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false" num-pages="numPages"></pagination>
-
     <pre>Page: {{bigCurrentPage}} / {{numPages}}</pre>
 </div>
diff --git a/src/popover/docs/demo.html b/src/popover/docs/demo.html
@@ -1,42 +1,35 @@
 <div ng-controller="PopoverDemoCtrl">
-  <div class="well">
-    <div>
-      <h4>Dynamic</h4>
-      <form role="form">
-        <div class="form-group">
-          <label>Dynamic Popover </label>
-          <input type="text" ng-model="dynamicPopoverText" class="form-control">
-        </div>
-        <div class="form-group">
-          <label>Dynamic Popover Popup Text</label>
-          <input type="text" ng-model="dynamicPopover" class="form-control">
-        </div>
-        <div class="form-group">
-          <label>Dynamic Popover Popup Title:</label>
-          <input type="text" ng-model="dynamicPopoverTitle" class="form-control">
-        </div>
-        <button popover="{{dynamicPopover}}" popover-title="{{dynamicPopoverTitle}}" class="btn btn-info">{{dynamicPopoverText}}</button>
-      </form>
+    <h4>Dynamic</h4>
+    <div class="form-group">
+      <label>Popup Title:</label>
+      <input type="text" ng-model="dynamicPopoverText" class="form-control">
     </div>
-    <div>
-      <h4>Positional</h4>
-      <button popover-placement="top" popover="On the Top!" class="btn btn-info">Top</button>
-      <button popover-placement="left" popover="On the Left!" class="btn btn-info">Left</button>
-      <button popover-placement="right" popover="On the Right!" class="btn btn-info">Right</button>
-      <button popover-placement="bottom" popover="On the Bottom!" class="btn btn-info">Bottom</button>
+    <div class="form-group">
+      <label>Popup Text:</label>
+      <input type="text" ng-model="dynamicPopover" class="form-control">
     </div>
-    <div>
-      <h4>Triggers</h4>
-      <button popover="I appeared on mouse enter!" popover-trigger="mouseenter" class="btn btn-info">Mouseenter</button>
-      <hr>
-      <input type="text" value="Click me!" 
-        popover="I appeared on focus! Click away and I'll vanish..." 
-        popover-trigger="focus" class="form-control">
+    <div class="form-group">
+      <label>Popup Title:</label>
+      <input type="text" ng-model="dynamicPopoverTitle" class="form-control">
     </div>
-    <div>
-      <h4>Other</h4>
-      <button Popover-animation="true" popover="I fade in and out!" class="btn btn-info">fading</button>
-      <button popover="I have a title!" popover-title="The title." class="btn btn-info">title</button>
-    </div>
-  </div>
+    <button popover="{{dynamicPopover}}" popover-title="{{dynamicPopoverTitle}}" class="btn btn-default">{{dynamicPopoverText}}</button>
+
+    <hr />
+    <h4>Positional</h4>
+    <button popover-placement="top" popover="On the Top!" class="btn btn-default">Top</button>
+    <button popover-placement="left" popover="On the Left!" class="btn btn-default">Left</button>
+    <button popover-placement="right" popover="On the Right!" class="btn btn-default">Right</button>
+    <button popover-placement="bottom" popover="On the Bottom!" class="btn btn-default">Bottom</button>
+
+    <hr />
+    <h4>Triggers</h4>
+    <p>
+      <button popover="I appeared on mouse enter!" popover-trigger="mouseenter" class="btn btn-default">Mouseenter</button>
+    </p>
+    <input type="text" value="Click me!" popover="I appeared on focus! Click away and I'll vanish..."  popover-trigger="focus" class="form-control">
+
+    <hr />
+    <h4>Other</h4>
+    <button Popover-animation="true" popover="I fade in and out!" class="btn btn-default">fading</button>
+    <button popover="I have a title!" popover-title="The title." class="btn btn-default">title</button>
 </div>
diff --git a/src/progressbar/docs/demo.html b/src/progressbar/docs/demo.html
@@ -1,12 +1,13 @@
-<div ng-controller="ProgressDemoCtrl" class="well">
+<div ng-controller="ProgressDemoCtrl">
 
     <h3>Static</h3>
-    <div class="row-fluid">
-        <div class="span4"><progressbar value="55"></progressbar></div>
-        <div class="span4"><progressbar class="progress-striped" value="22" type="warning">22%</progressbar></div>
-        <div class="span4"><progressbar class="progress-striped active" max="200" value="166" type="danger"><i>166 / 200</i></progressbar></div>
+    <div class="row">
+        <div class="col-sm-4"><progressbar value="55"></progressbar></div>
+        <div class="col-sm-4"><progressbar class="progress-striped" value="22" type="warning">22%</progressbar></div>
+        <div class="col-sm-4"><progressbar class="progress-striped active" max="200" value="166" type="danger"><i>166 / 200</i></progressbar></div>
     </div>
 
+    <hr />
     <h3>Dynamic <button class="btn btn-sm btn-primary" type="button" ng-click="random()">Randomize</button></h3>
     <progressbar max="max" value="dynamic"><span style="color:black; white-space:nowrap;">{{dynamic}} / {{max}}</span></progressbar>
 
@@ -16,7 +17,7 @@ <h3>Dynamic <button class="btn btn-sm btn-primary" type="button" ng-click="rando
     <small><em>Object (changes type based on value)</em></small>
     <progressbar class="progress-striped active" value="dynamic" type="{{type}}">{{type}} <i ng-show="showWarning">!!! Watch out !!!</i></progressbar>
 
-
+    <hr />
     <h3>Stacked <button class="btn btn-sm btn-primary" type="button" ng-click="randomStacked()">Randomize</button></h3>
     <progress><bar ng-repeat="bar in stacked" value="bar.value" type="{{bar.type}}"><span ng-hide="bar.value < 5">{{bar.value}}%</span></bar></progress>
 

diff --git a/src/rating/docs/demo.html b/src/rating/docs/demo.html
@@ -1,4 +1,4 @@
-<div ng-controller="RatingDemoCtrl" class="well well-small">
+<div ng-controller="RatingDemoCtrl">
     <h4>Default</h4>
     <rating value="rate" max="max" readonly="isReadonly" on-hover="hoveringOver(value)" on-leave="overStar = null"></rating>
     <span class="label" ng-class="{'label-warning': percent<30, 'label-info': percent>=30 && percent<70, 'label-success': percent>=70}" ng-show="overStar && !isReadonly">{{percent}}%</span>

diff --git a/src/tooltip/docs/demo.html b/src/tooltip/docs/demo.html
@@ -1,15 +1,12 @@
 <div ng-controller="TooltipDemoCtrl">
-  <div class="well">
-    <form role="form">
-      <div class="form-group">
-        <label>Dynamic Tooltip Text</label>
-        <input type="text" ng-model="dynamicTooltipText" class="form-control">
-      </div>
-      <div class="form-group">
-        <label>Dynamic Tooltip Popup Text</label>
-        <input type="text" ng-model="dynamicTooltip" class="form-control">
-      </div>
-    </form>
+    <div class="form-group">
+      <label>Dynamic Tooltip Text</label>
+      <input type="text" ng-model="dynamicTooltipText" class="form-control">
+    </div>
+    <div class="form-group">
+      <label>Dynamic Tooltip Popup Text</label>
+      <input type="text" ng-model="dynamicTooltip" class="form-control">
+    </div>
     <p>
       Pellentesque <a><span tooltip="{{dynamicTooltip}}">{{dynamicTooltipText}}</span></a>,
       sit amet venenatis urna cursus eget nunc scelerisque viverra mauris, in
@@ -32,15 +29,7 @@
     <form role="form">
       <div class="form-group">
         <label>Or use custom triggers, like focus: </label>
-        <input type="text" value="Click me!"
-          tooltip="See? Now click away..." 
-          tooltip-trigger="focus"
-          tooltip-placement="right" class="form-control">
+        <input type="text" value="Click me!" tooltip="See? Now click away..."  tooltip-trigger="focus" tooltip-placement="right" class="form-control" />
       </div>
     </form>
-
-
-
-
-  </div>
 </div>