Skip to content
This repository was archived by the owner on May 29, 2019. It is now read-only.

Bootstrap3 bis2 Accordion & Collapse #1208

Closed
wants to merge 22 commits into from
Closed

Bootstrap3 bis2 Accordion & Collapse #1208

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
e80217a
demo(tabs): update demo to Bootstrap3
Aug 1, 2013
3f33a16
demo(all): upgrade project to bs3.0.0-rc2 and get docs looking spiffy
Jul 29, 2013
68e19ef
demo(all): style demo for bootstrap3
Aug 15, 2013
568ea56
feat(pagination): bootstrap3 support
Aug 17, 2013
45bd373
demo(all): fix typo in css file
Aug 17, 2013
a81135f
demo(popover): fixed button styling for bootstrap 3
Aug 17, 2013
ae7d531
demo(tooltip): change demo to support bootstrap3
Aug 17, 2013
01e4e47
feat(typeahead): update to Bootstrap 3
pkozlowski-opensource Aug 18, 2013
517dab1
feat(carousel): some changes for Bootstrap3
pkozlowski-opensource Aug 18, 2013
8e3340a
demo(alert): add btn-default class to button
Aug 18, 2013
67b2684
demo(carousel): center images and increase size to full frame
Aug 18, 2013
d660b6e
feat(timepicker): restyled for bootstrap 3
Aug 1, 2013
3456b3d
feat(datepicker): redesigned for bootstrap 3
Aug 16, 2013
9dccc90
feat(pagination): bootstrap3 support
bekos Aug 25, 2013
88c452f
chore(demo): update demo from bootstrap rc1 to release
Aug 26, 2013
426c67c
fix(timepicker): remove form so deep validation works
Aug 26, 2013
fe8e9cc
fix(datepicker): change width properties to min-width
Aug 26, 2013
2c31c70
fix(typeahead): update template to Bootstrap 3
pkozlowski-opensource Aug 29, 2013
d72d24a
feat(modal): added bootstrap3 support
Aug 24, 2013
c6197ed
feat(tabs) add nav-justified
WilliamRandol Sep 7, 2013
8cbeff0
feat(accordion): convert to bootstrap3 panel styling
Aug 26, 2013
41e6713
fix(datepicker): remove unecessery </th> from a template
pkozlowski-opensource Oct 4, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 8 additions & 4 deletions Gruntfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ module.exports = function(grunt) {

grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-html2js');
Expand All @@ -17,7 +17,7 @@ module.exports = function(grunt) {

grunt.initConfig({
ngversion: '1.0.5',
bsversion: '2.3.1',
bsversion: '3.0.0',
modules: [],//to be filled in by build task
pkg: grunt.file.readJSON('package.json'),
dist: 'dist',
Expand All @@ -29,6 +29,10 @@ module.exports = function(grunt) {
all: 'angular.module("ui.bootstrap", ["ui.bootstrap.tpls", <%= srcModules %>]);'
},
delta: {
docs: {
files: ['misc/demo/index.html'],
tasks: ['after-test']
},
html: {
files: ['template/**/*.html'],
tasks: ['html2js', 'karma:watch:run']
Expand Down Expand Up @@ -165,7 +169,7 @@ module.exports = function(grunt) {
options: {
dest: 'dist/docs',
scripts: [
'angular.js',
'angular.js',
'<%= concat.dist_tpls.dest %>'
],
styles: [
Expand All @@ -182,7 +186,7 @@ module.exports = function(grunt) {
}
});

//register before and after test tasks so we've don't have to change cli
//register before and after test tasks so we've don't have to change cli
//options on the goole's CI server
grunt.registerTask('before-test', ['enforce', 'jshint', 'html2js']);
grunt.registerTask('after-test', ['build', 'copy']);
Expand Down
41 changes: 32 additions & 9 deletions misc/demo/assets/demo.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ section {
background-color: #f5f5f5;
}

.hero-unit {
.jumbotron {
position: relative;
padding: 40px 0;
color: #fff;
Expand All @@ -54,11 +54,11 @@ section {
-webkit-border-radius: 0;
-o-border-radius: 0;
}
.hero-unit .btn, .pagination-centered .btn {
.jumobotron .btn, .pagination-centered .btn {
float: none;
font-weight: normal;
}
.hero-unit p {
.jumobotron p {
margin: 1em 0;
}
.bs-docs-social {
Expand Down Expand Up @@ -86,16 +86,39 @@ section {
line-height: 1;
}

.icon-github {
background: no-repeat url('github-16px.png');
width: 16px;
height: 16px;
}

/* Not enough room on mobile for markup tab, js tab, and plunk btn.
/* Not enough room on mobile for markup tab, js tab, and plunk btn.
And no one cares about plunk button on a phone anyway */
@media only screen and (max-device-width: 480px) {
#plunk-btn {
display: none;
}
}

.navbar-nav .dropdown .navbar-brand {
max-width: 100%;
margin-right: inherit;
margin-left: inherit;
}

.header-placeholder {
height: 175px;
}

@media screen and (min-width: 768px) {

.dropdown.open > .navbar-brand + .dropdown-menu {
left: 10px;
}

.header-placeholder {
height: 50px;
}

.navbar-nav .dropdown .navbar-brand {
max-width: 200px;
margin-right: 5px;
margin-left: 10px;
}

}
167 changes: 82 additions & 85 deletions misc/demo/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,52 +10,50 @@
<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/twitter-bootstrap/<%= bsversion %>/css/bootstrap.min.css" rel="stylesheet"/>

<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 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">
</head>
<body class="ng-cloak" ng-controller="MainCtrl">
<header class="navbar navbar-fixed-top">
<header class="navbar navbar-default navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<div class="dropdown pull-left">
<a class="brand dropdown-toggle" role="button" data-toggle="dropdown" href="#">
UI Bootstrap
<b class="caret"></b>
</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li><a href="https://github.com/angular-ui/"><strong>Related Projects:</strong></a></li>
<li class="divider"></li>
<li><a href="http://angular-ui.github.io/">AngularUI</a></li>
<li><a href="http://angular-ui.github.io/ng-grid/">Grid</a></li>
<li><a href="https://github.com/angular-ui/AngularJs.tmbundle">AngularJS.tmbundle</a></li>
<li><a href="https://github.com/angular-ui/ui-router">Router <span class="label label-success">New!</span></a></li>
</ul>
</div>
<div class="nav-collapse">
<ul class="nav">
<li>
<a href="#" role="button" class="dropdown-toggle">
Directives <b class="caret"></b>
</a>
<ul class="dropdown-menu">
<% demoModules.forEach(function(module) { %>
<li><a href="#<%= module.name %>"><%= module.displayName %></a></li>
<% }); %>
</ul>
</li>
<li><a href="#getting_started">Getting started</a></li>
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="navbar-brand dropdown-toggle">
UI Bootstrap <b class="caret"></b>
</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li><a href="https://github.com/angular-ui/"><strong>Related Projects:</strong></a></li>
<li class="divider"></li>
<li><a href="http://angular-ui.github.io/">AngularUI</a></li>
<li><a href="http://angular-ui.github.io/ng-grid/">Grid</a></li>
<li><a href="https://github.com/angular-ui/AngularJs.tmbundle">AngularJS.tmbundle</a></li>
<li><a href="https://github.com/angular-ui/ui-router">Router <span class="label label-success">New!</span></a></li>
</ul>
</li>

<li class="dropdown">
<a href="#" role="button" class="dropdown-toggle">
Directives <b class="caret"></b>
</a>
<ul class="dropdown-menu">
<% demoModules.forEach(function(module) { %>
<li><a href="#<%= module.name %>"><%= module.displayName %></a></li>
<% }); %>
</ul>
</li>
<li><a href="#getting_started">Getting started</a></li>
</ul>
</div>
</div>
</div>
</header>
<div style="margin: 32px;"></div>
<div class="header-placeholder"></div>
<div role="main">

<header class="hero-unit" id="overview">
<header class="jumbotron text-center" id="overview">
<div class="container">
<h1>
UI Bootstrap
Expand All @@ -65,11 +63,11 @@ <h1>
href="http://angular-ui.github.io">AngularUI Team</a></strong></p>

<p class="btn-group">
<a class="btn" href="https://github.com/angular-ui/bootstrap"><i class="icon-github"></i> Code on Github</a>
<a class="btn btn-default" href="https://github.com/angular-ui/bootstrap">Code on Github</a>
<a class="btn btn-primary" href="https://github.com/angular-ui/bootstrap/tree/gh-pages">
<i class="icon-download-alt icon-white"></i> Download <small>(<%= pkg.version%>)</small>
<i class="glyphicon glyphicon-download-alt"></i> Download <small>(<%= pkg.version%>)</small>
</a>
<a class="btn" ng-click="showBuildModal()"><i class="icon-wrench"></i> Create a Build</a>
<a class="btn btn-default" ng-click="showBuildModal()"><i class="glyphicon glyphicon-wrench"></i> Create a Build</a>
</p>
</div>
<div class="bs-docs-social">
Expand Down Expand Up @@ -116,15 +114,13 @@ <h1>
</div>
</div>
</header>

<div class="container">

<section id="getting_started">
<div class="page-header">
<h1>Getting started</h1>
</div>
<div class="row">
<div class="span12">
<section id="getting_started" class="row">
<div class="col-md-12">
<div class="page-header">
<h1>Getting started</h1>
</div>
<div>
<h3>Dependencies</h3>
<p>
This repository contains a set of <strong>native AngularJS directives</strong> based on
Expand Down Expand Up @@ -166,47 +162,48 @@ <h3>CSS</h3>
</div>
</div>
</section>

<% demoModules.forEach(function(module) { %>
<section id="<%= module.name %>">
<div class="page-header">
<h1><%= module.displayName %><small>
(<a target="_blank" href="https://github.com/angular-ui/bootstrap/tree/master/src/<%= module.name %>">ui.bootstrap.<%= module.name %></a>)
</small></h1>
</div>
<div class="row">
<div class="span6">
<%= module.docs.html %>
</div>
<div class="span6">
<%= module.docs.md %>
</div>
</div>
<hr>
<div class="row">
<div class="span12" ng-controller="PlunkerCtrl">
<div class="pull-right">
<button class="btn btn-info" id="plunk-btn" ng-click="edit('<%= ngversion%>', '<%= bsversion %>', '<%= pkg.version%>', '<%= module.name %>')"><i class="icon-edit icon-white"></i> Edit in plunker</button>
</div>
<tabset>
<tab heading="Markup">
<div plunker-content="markup">
<pre ng-non-bindable><code data-language="html"><%- module.docs.html %></code></pre>
<% demoModules.forEach(function(module) { %>
<section id="<%= module.name %>" class="row">
<div class="col-md-12">
<div class="page-header">
<h1><%= module.displayName %><small>
(<a target="_blank" href="https://github.com/angular-ui/bootstrap/tree/master/src/<%= module.name %>">ui.bootstrap.<%= module.name %></a>)
</small></h1>
</div>
<div class="row">
<div class="col-md-6">
<%= module.docs.html %>
</div>
</tab>
<tab heading="JavaScript">
<div plunker-content="javascript">
<pre ng-non-bindable><code data-language="javascript"><%- module.docs.js %></code></pre>
<div class="col-md-6">
<%= module.docs.md %>
</div>
</tab>
</tabset>
</div>
</div>
</section>
<script><%= module.docs.js %></script>
<% }); %>
</div>
</div>
</div>
<hr>
<div class="row">
<div class="col-md-12" ng-controller="PlunkerCtrl">
<div class="pull-right">
<button class="btn btn-info" id="plunk-btn" ng-click="edit('<%= ngversion%>', '<%= bsversion %>', '<%= pkg.version%>', '<%= module.name %>')"><i class="glyphicon glyphicon-edit"></i> Edit in plunker</button>
</div>
<tabset>
<tab heading="Markup">
<div plunker-content="markup">
<pre ng-non-bindable><code data-language="html"><%- module.docs.html %></code></pre>
</div>
</tab>
<tab heading="JavaScript">
<div plunker-content="javascript">
<pre ng-non-bindable><code data-language="javascript"><%- module.docs.js %></code></pre>
</div>
</tab>
</tabset>
</div>
</div>
</div>
</section>
<script><%= module.docs.js %></script>
<% }); %>
</div><!-- /.container -->
</div><!-- /.main -->
<footer class="footer">
<div class="container">
<p>Designed and built by <a href="https://github.com/angular-ui?tab=members" target="_blank">Angular-UI team</a> and <a href="https://github.com/angular-ui/bootstrap/graphs/contributors" target="_blank">contributors</a>.</p>
Expand All @@ -232,7 +229,7 @@ <h3 style="text-align: center;">{{buildErrorText}}</h3>
</div>
</div>
<div class="modal-footer">
<a class="btn btn-primary" ng-disabled="!selectedModules.length" ng-click="selectedModules.length && downloadBuild()"><i class="icon-download-alt icon-white"></i> Download {{selectedModules.length}} Modules</a>
<a class="btn btn-primary" ng-disabled="!selectedModules.length" ng-click="selectedModules.length && downloadBuild()"><i class="glyphicon glyphicon-download-alt"></i> Download {{selectedModules.length}} Modules</a>
<a class="btn" ng-click="cancel()">Cancel</a>
</div>
</script>
Expand Down
4 changes: 2 additions & 2 deletions src/accordion/docs/demo.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,12 +13,12 @@
</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-small" ng-click="addItem()">Add Item</button>
<button class="btn btn-default btn-small" ng-click="addItem()">Add Item</button>
<div ng-repeat="item in items">{{item}}</div>
</accordion-group>
<accordion-group>
<accordion-heading>
I can have markup, too! <i class="icon-check"></i>
I can have markup, too! <i class="glyphicon glyphicon-check"></i>
</accordion-heading>
This is just some content to illustrate fancy headings.
</accordion-group>
Expand Down
Loading