Skip to content
This repository was archived by the owner on Jan 31, 2018. It is now read-only.

Commit 655bebf

Browse files
author
Scott Cranfill
committed
Fixes nested expandables, adds custom demo for that
1 parent 1414698 commit 655bebf

File tree

13 files changed

+140
-27
lines changed

13 files changed

+140
-27
lines changed

CHANGELOG.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,21 @@ All notable changes to this project will be documented in this file.
22
We follow the [Semantic Versioning 2.0.0](http://semver.org/) format.
33

44

5+
## 0.5.1 - 2014-10-03
6+
7+
### Added
8+
- Nothing.
9+
10+
### Deprecated
11+
- Nothing.
12+
13+
### Removed
14+
- Nothing.
15+
16+
### Fixed
17+
- Tweaked JS and CSS to correctly handle nested expandables.
18+
19+
520
## 0.5.0 - 2014-09-02
621

722
### Added

bower.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "cf-expandables",
3-
"version": "0.5.0",
3+
"version": "0.5.1",
44
"description": "Standard expandable (show/hide) component for Capital Framework.",
55
"keywords": ["capital-framework", "capital", "expandables", "jquery", "js", "less"],
66
"authors": [

demo/custom.html

Lines changed: 52 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,54 @@
11

2-
<!--
32
<hr><br>
4-
Add custom demo HTML here
5-
-->
3+
<div class="expandable expandable__padded">
4+
<button class="expandable_header expandable_target">
5+
<span class="expandable_header-left expandable_label">
6+
Nested expandable (outer)
7+
</span>
8+
<span class="expandable_header-right expandable_link">
9+
<span class="expandable_cue-open">
10+
Show
11+
<span class="cf-icon cf-icon-plus-round"></span>
12+
</span>
13+
<span class="expandable_cue-close">
14+
Hide
15+
<span class="cf-icon cf-icon-minus-round"></span>
16+
</span>
17+
</span>
18+
</button>
19+
<div class="expandable_content">
20+
<p>
21+
Lorem ipsum dolor sit amet, consectetur adipisicing
22+
elit. Neque ipsa voluptatibus soluta nobis unde quisquam
23+
temporibus magnam debitis quidem. Ducimus ratione
24+
corporis nesciunt earum vel est quaerat blanditiis
25+
dolore ipsa?
26+
</p>
27+
<div class="expandable expandable__padded">
28+
<button class="expandable_header expandable_target">
29+
<span class="expandable_header-left expandable_label">
30+
Nested expandable (inner)
31+
</span>
32+
<span class="expandable_header-right expandable_link">
33+
<span class="expandable_cue-open">
34+
Show
35+
<span class="cf-icon cf-icon-plus-round"></span>
36+
</span>
37+
<span class="expandable_cue-close">
38+
Hide
39+
<span class="cf-icon cf-icon-minus-round"></span>
40+
</span>
41+
</span>
42+
</button>
43+
<div class="expandable_content">
44+
<p>
45+
Lorem ipsum dolor sit amet, consectetur adipisicing
46+
elit. Neque ipsa voluptatibus soluta nobis unde quisquam
47+
temporibus magnam debitis quidem. Ducimus ratione
48+
corporis nesciunt earum vel est quaerat blanditiis
49+
dolore ipsa?
50+
</p>
51+
</div>
52+
</div>
53+
</div>
54+
</div>

demo/index.html

Lines changed: 52 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -281,10 +281,59 @@
281281
</div>
282282
</div>
283283
<div id="custom-demo">
284-
<!--
285284
<hr><br>
286-
Add custom demo HTML here
287-
-->
285+
<div class="expandable expandable__padded">
286+
<button class="expandable_header expandable_target">
287+
<span class="expandable_header-left expandable_label">
288+
Nested expandable (outer)
289+
</span>
290+
<span class="expandable_header-right expandable_link">
291+
<span class="expandable_cue-open">
292+
Show
293+
<span class="cf-icon cf-icon-plus-round"></span>
294+
</span>
295+
<span class="expandable_cue-close">
296+
Hide
297+
<span class="cf-icon cf-icon-minus-round"></span>
298+
</span>
299+
</span>
300+
</button>
301+
<div class="expandable_content">
302+
<p>
303+
Lorem ipsum dolor sit amet, consectetur adipisicing
304+
elit. Neque ipsa voluptatibus soluta nobis unde quisquam
305+
temporibus magnam debitis quidem. Ducimus ratione
306+
corporis nesciunt earum vel est quaerat blanditiis
307+
dolore ipsa?
308+
</p>
309+
<div class="expandable expandable__padded">
310+
<button class="expandable_header expandable_target">
311+
<span class="expandable_header-left expandable_label">
312+
Nested expandable (inner)
313+
</span>
314+
<span class="expandable_header-right expandable_link">
315+
<span class="expandable_cue-open">
316+
Show
317+
<span class="cf-icon cf-icon-plus-round"></span>
318+
</span>
319+
<span class="expandable_cue-close">
320+
Hide
321+
<span class="cf-icon cf-icon-minus-round"></span>
322+
</span>
323+
</span>
324+
</button>
325+
<div class="expandable_content">
326+
<p>
327+
Lorem ipsum dolor sit amet, consectetur adipisicing
328+
elit. Neque ipsa voluptatibus soluta nobis unde quisquam
329+
temporibus magnam debitis quidem. Ducimus ratione
330+
corporis nesciunt earum vel est quaerat blanditiis
331+
dolore ipsa?
332+
</p>
333+
</div>
334+
</div>
335+
</div>
336+
</div>
288337
</div>
289338
<script src="static/js/component.min.js"></script>
290339
</body>

demo/static/css/main.css

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

demo/static/js/component.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10526,8 +10526,8 @@ jQuery.extend( jQuery.easing,
1052610526
return $( this ).each(function() {
1052710527

1052810528
var $this = $( this ),
10529-
$target = $this.find('.expandable_target'),
10530-
$content = $this.find('.expandable_content'),
10529+
$target = $this.find('.expandable_target').not( $this.find('.expandable .expandable_target') ),
10530+
$content = $this.find('.expandable_content').not( $this.find('.expandable .expandable_content') ),
1053110531
$groupParent = $this.parents('.expandable-group'),
1053210532
accordion = $groupParent.length > 0 && $groupParent.data('accordion');
1053310533

demo/static/js/component.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/index.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -202,10 +202,10 @@ <h3 class="docs-pattern_header">.expandable__expanded (modifier)</h3>
202202
.expandable_cue-close {
203203
display: none;
204204
}
205-
.expandable__expanded .expandable_cue-open {
205+
.expandable__expanded &gt; .expandable_target .expandable_cue-open {
206206
display: none;
207207
}
208-
.expandable__expanded .expandable_cue-close {
208+
.expandable__expanded &gt; .expandable_target .expandable_cue-close {
209209
display: inline;
210210
}
211211
.expandable_content:after {

docs/static/css/main.css

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/static/js/component.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10526,8 +10526,8 @@ jQuery.extend( jQuery.easing,
1052610526
return $( this ).each(function() {
1052710527

1052810528
var $this = $( this ),
10529-
$target = $this.find('.expandable_target'),
10530-
$content = $this.find('.expandable_content'),
10529+
$target = $this.find('.expandable_target').not( $this.find('.expandable .expandable_target') ),
10530+
$content = $this.find('.expandable_content').not( $this.find('.expandable .expandable_content') ),
1053110531
$groupParent = $this.parents('.expandable-group'),
1053210532
accordion = $groupParent.length > 0 && $groupParent.data('accordion');
1053310533

0 commit comments

Comments
 (0)