A special modal that slides out from the right or left side of the screen.
$ component install segmentio/sheet
var sheet = require('sheet');
sheet(el).show();
To use it, pass in the el
you want to "sheet-ize".
<div class="Modal" effect="sheet-left">
<div class="Sheet">
<a class="Sheet-close-button"></a>
{ Your element gets injected here. }
</div>
</div>
<div class="Overlay"></div>
A segmentio/overlay
element (with an .overlay
class) is used to create the mask above the screen, so if you've already themed it you've got no more work to do.
Create a new Sheet
instance with the given el
.
Show the sheet, emitting show
, optionally calling fn
.
Hide the sheet, emitting hide
, optionally calling fn
.
Add a class name
to the .sheet
and .sheet-overlay
.
Remove a class name
from the .sheet
and .sheet-overlay
.
MIT