forked from jacerider/fett
-
Notifications
You must be signed in to change notification settings - Fork 0
/
fett.offcanvas.css
2 lines (2 loc) · 2.41 KB
/
fett.offcanvas.css
1
2
.offcanvas-push,.offcanvas-scroll,.offcanvas-wrapper,body,html{height:100%}body{overflow:hidden}.offcanvas-wrapper{position:relative;overflow:hidden}.offcanvas-wrapper.animate .offcanvas-close::after,.offcanvas-wrapper.animate .offcanvas-close::before{width:80%}.offcanvas-scroll{overflow-y:scroll;-webkit-overflow-scrolling:touch}.offcanvas-close{position:absolute;top:0;right:0;color:transparent;height:3.5rem;width:3.5rem;display:block;text-indent:-9999px;border:0;text-align:center}.offcanvas-close::after,.offcanvas-close::before{width:0;height:6px;content:'';background-color:#f7f7f7;display:block;margin:50% auto 0;transform:rotate(45deg);border-radius:4px;transition:width .3s ease .5s,left .3s,background-color .3s}.offcanvas-close::after{bottom:0;transform:rotate(-45deg);margin:-54% auto 0}.offcanvas-close:hover{border:0;color:transparent}.offcanvas-close:hover::after,.offcanvas-close:hover::before{background-color:#2199e8}.offcanvas-push{position:relative;left:0;z-index:100;transform-style:preserve-3d;transition:all .5s}.offcanvas-push::after{content:'';position:absolute;top:0;right:0;width:0;height:0;background:rgba(34,34,34,.4);transition:opacity .5s,width 1ms 5ms,height 1ms 5ms;z-index:9999;opacity:0}.animate .offcanvas-push::after{width:100%;height:100%;opacity:1;transition:opacity .5s}.animate.left .offcanvas-push{transform:translate3d(20rem,0,0)}.animate.right .offcanvas-push{transform:translate3d(-20rem,0,0)}.animate.top .offcanvas-push{transform:translate3d(0,20rem,0)}.animate.bottom .offcanvas-push{transform:translate3d(0,-20rem,0)}.offcanvas-items{position:absolute;background:#222;display:none;z-index:99}.left .offcanvas-items,.right .offcanvas-items{top:0;bottom:0;width:20rem}.active .offcanvas-items{display:block;transition:all .5s}.left .offcanvas-items{left:0;transform:translate3d(-10rem,0,0)}.animate.left .offcanvas-items{transform:translate3d(0,0,0)}.right .offcanvas-items{right:0;transform:translate3d(10rem,0,0)}.animate.right .offcanvas-items{transform:translate3d(0,0,0)}.bottom .offcanvas-items,.top .offcanvas-items{left:0;right:0;height:20rem}.top .offcanvas-items{top:0;transform:translate3d(0,-20rem,0)}.animate.top .offcanvas-items{transform:translate3d(0,0,0)}.bottom .offcanvas-items{bottom:0;transform:translate3d(0,20rem,0)}.animate.bottom .offcanvas-items{transform:translate3d(0,0,0)}.offcanvas-item{display:none}.offcanvas-item.active{display:block}
/*# sourceMappingURL=fett.offcanvas.css.map */