mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
chore(build): rename ionic directory to src and update all references in the build process.
This commit is contained in:
98
src/components/menu/menu.scss
Normal file
98
src/components/menu/menu.scss
Normal file
@@ -0,0 +1,98 @@
|
||||
@import "../../globals.core";
|
||||
|
||||
// Menu
|
||||
// --------------------------------------------------
|
||||
|
||||
$menu-width: 304px !default;
|
||||
$menu-small-width: $menu-width - 40px !default;
|
||||
|
||||
|
||||
ion-menu {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: auto;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
|
||||
display: flex;
|
||||
|
||||
flex-direction: column;
|
||||
|
||||
width: $menu-width;
|
||||
|
||||
transform: translate3d(-9999px, 0, 0);
|
||||
}
|
||||
|
||||
ion-menu[side=right] {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
ion-menu .backdrop {
|
||||
z-index: -1;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-content {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.menu-content-open ion-pane,
|
||||
.menu-content-open ion-content,
|
||||
.menu-content-open .toolbar {
|
||||
// the containing element itself should be clickable but
|
||||
// everything inside of it should not clickable when menu is open
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 340px) {
|
||||
|
||||
ion-menu {
|
||||
width: $menu-small-width;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
// Menu Reveal
|
||||
// --------------------------------------------------
|
||||
// The content slides over to reveal the menu underneath.
|
||||
// The menu itself, which is under the content, does not move.
|
||||
|
||||
ion-menu[type=reveal].show-menu {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
|
||||
// Menu Overlay
|
||||
// --------------------------------------------------
|
||||
// The menu slides over the content. The content
|
||||
// itself, which is under the menu, does not move.
|
||||
|
||||
ion-menu[type=overlay] {
|
||||
left: -8px; // make up for the box-shadow hanging over on the left
|
||||
z-index: $z-index-menu-overlay;
|
||||
|
||||
.backdrop {
|
||||
left: -3000px;
|
||||
display: block;
|
||||
|
||||
width: 6000px;
|
||||
|
||||
opacity: .01;
|
||||
transform: translate3d(-9999px, 0, 0);
|
||||
|
||||
&.show-backdrop {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ion-menu[type=overlay][side=right] {
|
||||
left: 8px;
|
||||
}
|
||||
|
||||
ion-menu[type=push][side=right] {
|
||||
left: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user