2015-02-06 00:32:51 +01:00
|
|
|
/*
|
|
|
|
* Off Canvas
|
|
|
|
* --------------------------------------------------
|
|
|
|
*/
|
|
|
|
@media screen and (max-width: 991px) {
|
|
|
|
.row-offcanvas {
|
|
|
|
position: relative;
|
|
|
|
-webkit-transition: all .25s ease-out;
|
|
|
|
-o-transition: all .25s ease-out;
|
|
|
|
transition: all .25s ease-out;
|
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-right {
|
|
|
|
right: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-left {
|
|
|
|
left: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-right
|
|
|
|
.sidebar-offcanvas {
|
2015-10-23 19:47:08 +02:00
|
|
|
right: calc(-50% + 7px);
|
2015-02-06 00:32:51 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-left
|
|
|
|
.sidebar-offcanvas {
|
2015-10-23 19:47:08 +02:00
|
|
|
left: calc(-50% + 7.5px);
|
2015-02-06 00:32:51 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-right.active {
|
2015-10-23 19:47:08 +02:00
|
|
|
right: calc(50% + 7.5px);
|
2015-02-06 00:32:51 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-left.active {
|
2015-10-23 19:47:08 +02:00
|
|
|
left: calc(50% + 7.5px);
|
2015-02-06 00:32:51 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.sidebar-offcanvas {
|
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
2015-10-23 19:47:08 +02:00
|
|
|
width: 50%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@media screen and (max-width: 479px) {
|
|
|
|
.row-offcanvas-right
|
|
|
|
.sidebar-offcanvas {
|
|
|
|
right: calc(-100% + 15px);
|
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-left
|
|
|
|
.sidebar-offcanvas {
|
|
|
|
left: calc(-100% + 15px);
|
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-right.active {
|
|
|
|
right: calc(100% + 15px);
|
|
|
|
}
|
|
|
|
|
|
|
|
.row-offcanvas-left.active {
|
|
|
|
left: calc(100% + 15px);
|
|
|
|
}
|
|
|
|
|
|
|
|
.sidebar-offcanvas {
|
|
|
|
width: 100%;
|
2015-02-06 00:32:51 +01:00
|
|
|
}
|
|
|
|
}
|