You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 lines
1.8 KiB
55 lines
1.8 KiB
//======================================
|
|
// Off canvas plugin
|
|
// See: core/_off-canvas.scss
|
|
//======================================
|
|
@import '../init.scss';
|
|
|
|
// General
|
|
// -------------------------------------------
|
|
.c-offcanvas-content-wrap {
|
|
overflow: auto;
|
|
backface-visibility: unset !important;
|
|
transform: none !important;
|
|
}
|
|
|
|
// Widths
|
|
@mixin off-canvas-width($width: 20em) {
|
|
.c-offcanvas--left {
|
|
width: $width !important;
|
|
transform: translate3d(-$width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas--right {
|
|
width: $width !important;
|
|
transform: translate3d($width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-content-wrap--reveal.c-offcanvas-content-wrap--left.is-open {
|
|
transform: translate3d($width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-content-wrap--reveal.c-offcanvas-content-wrap--right.is-open {
|
|
transform: translate3d(-$width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-bg.c-offcanvas-bg--reveal.c-offcanvas-bg--left.is-open {
|
|
transform: translate3d($width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-bg.c-offcanvas-bg--reveal.c-offcanvas-bg--right.is-open {
|
|
transform: translate3d(-$width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-content-wrap--push.c-offcanvas-content-wrap--left.is-open {
|
|
transform: translate3d($width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-content-wrap--push.c-offcanvas-content-wrap--right.is-open {
|
|
transform: translate3d(-$width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-bg.c-offcanvas-bg--push.c-offcanvas-bg--left.is-open {
|
|
transform: translate3d($width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas-bg.c-offcanvas-bg--push.c-offcanvas-bg--right.is-open {
|
|
transform: translate3d(-$width, 0, 0) !important;
|
|
}
|
|
.c-offcanvas.is-open,
|
|
.c-offcanvas--reveal {
|
|
transform: translate3d(0, 0, 0) !important;
|
|
}
|
|
}
|
|
|
|
@include off-canvas-width(); |