Add JS behaviors
This commit is contained in:
parent
a58385247d
commit
a048c955fd
4 changed files with 29 additions and 0 deletions
|
@ -0,0 +1,5 @@
|
||||||
|
$ ->
|
||||||
|
$("body").on "click", ".js-details-target", ->
|
||||||
|
container = $(@).closest ".js-details-container"
|
||||||
|
|
||||||
|
container.toggleClass "open"
|
|
@ -0,0 +1,5 @@
|
||||||
|
$ ->
|
||||||
|
$("body").on "click", ".js-toggler-target", ->
|
||||||
|
container = $(@).closest ".js-toggler-container"
|
||||||
|
|
||||||
|
container.toggleClass "on"
|
14
app/assets/stylesheets/behaviors.scss
Normal file
14
app/assets/stylesheets/behaviors.scss
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
// Details
|
||||||
|
//--------
|
||||||
|
.js-details-container .content { display: none; }
|
||||||
|
.js-details-container .content.hide { display: block; }
|
||||||
|
.js-details-container.open .content { display: block; }
|
||||||
|
.js-details-container.open .content.hide { display: none; }
|
||||||
|
|
||||||
|
|
||||||
|
// Toggler
|
||||||
|
//--------
|
||||||
|
.js-toggler-container .turn-on { display: inline-block; }
|
||||||
|
.js-toggler-container .turn-off { display: none; }
|
||||||
|
.js-toggler-container.on .turn-on { display: none; }
|
||||||
|
.js-toggler-container.on .turn-off { display: inline-block; }
|
|
@ -83,6 +83,11 @@ $baseLineHeight: 18px !default;
|
||||||
*/
|
*/
|
||||||
@import "common.scss";
|
@import "common.scss";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Styles necessary to support JS behaviours.
|
||||||
|
*/
|
||||||
|
@import "behaviors.scss";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Styles related to specific part of app
|
* Styles related to specific part of app
|
||||||
*/
|
*/
|
||||||
|
|
Loading…
Reference in a new issue