pebble/third_party/jquery-mmenu/sass/mmenu/extensions/jquery.mmenu.positioning.scss
2025-02-24 18:58:29 -08:00

98 lines
No EOL
1.4 KiB
SCSS
Executable file

/*
jQuery.mmenu position extension CSS
*/
@import "../inc/variables";
// top
// bottom
.mm-menu.mm-top,
.mm-menu.mm-bottom
{
width: 100%;
min-width: 100%;
max-width: 100%;
}
// right
.mm-menu.mm-right
{
left: auto;
right: 0;
}
// bottom
.mm-menu.mm-bottom
{
top: auto;
bottom: 0;
}
@include mm_sizing_right;
/*
jQuery.mmenu z-position extension CSS
*/
// reset defaults
html.mm-front
{
.mm-page,
#mm-blocker
{
@include mm-webkit-prefix( 'transform', translate( 0, 0 ) !important );
z-index: 0;
}
}
// styling
.mm-menu.mm-front
{
z-index: 1;
box-shadow: 0 0 15px rgba( 0, 0, 0, 0.5 );
}
html.mm-opened.mm-next .mm-page
{
box-shadow: none;
}
// animations
.mm-menu
{
&.mm-front,
&.mm-next
{
-webkit-transition: -webkit-transform $mm_transitionDuration $mm_transitionFunction;
transition: transform $mm_transitionDuration $mm_transitionFunction;
@include mm-webkit-prefix( 'transform', translate( -100%, 0 ) );
&.mm-right
{
@include mm-webkit-prefix( 'transform', translate( 100%, 0 ) );
}
}
&.mm-front
{
&.mm-top
{
@include mm-webkit-prefix( 'transform', translate( 0, -100% ) );
}
&.mm-bottom
{
@include mm-webkit-prefix( 'transform', translate( 0, 100% ) );
}
}
}
html.mm-opening .mm-menu
{
&.mm-front,
&.mm-next
{
@include mm-webkit-prefix( 'transform', translate( 0, 0 ) );
}
}
@include mm_sizing_zposition;