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

Commit e39bf0d

Browse files
committed
docs(collapse): fix height on horizontal
- Fix height on horizontal collapse usage
1 parent 6352f13 commit e39bf0d

File tree

2 files changed

+10
-2
lines changed

2 files changed

+10
-2
lines changed

Diff for: src/collapse/docs/demo.html

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
<style>
2+
.horizontal-collapse {
3+
height: 70px;
4+
}
5+
</style>
16
<div ng-controller="CollapseDemoCtrl">
27
<button type="button" class="btn btn-default" ng-click="isCollapsed = !isCollapsed">Toggle collapse Vertically</button>
38
<hr>
@@ -7,7 +12,7 @@
712

813
<button type="button" class="btn btn-default" ng-click="isCollapsedHorizontal = !isCollapsedHorizontal">Toggle collapse Horizontally</button>
914
<hr>
10-
<div uib-collapse="isCollapsedHorizontal" horizontal>
15+
<div class="horizontal-collapse" uib-collapse="isCollapsedHorizontal" horizontal>
1116
<div class="well well-lg">Some content</div>
1217
</div>
1318
</div>

Diff for: src/collapse/docs/readme.md

+4-1
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,11 @@
2727
<i class="glyphicon glyphicon-eye-open"></i>
2828
_(Default: `false`)_ -
2929
Whether the element should be collapsed or not.
30-
30+
3131
* `horizontal`
3232
<small class="badge">$</small> -
3333
An optional attribute that permit to collapse horizontally.
3434

35+
### Known Issues
36+
37+
When using the `horizontal` attribute with this directive, keep in mind that due to how CSS can reflow as the collapse element goes from 0px to its desired end width, this cause result in issues with a changing height. This can cause animations to not appear to run. The best way around this is to set a fixed height via CSS on the horizontal collapse element so that this situation does not occur, and so the animation can run as expected.

0 commit comments

Comments
 (0)