Menu Expose

Menu Expose

Ionic v2/v3 ion-menu with desktop/tablet layout

$10.00

CodExplorerLegacy

CodExplorerLegacy

Member since 2015

Details

Version:
1.0
Ionic:
3.x  
Platforms:
iOS, Android  
Released:
4 years ago
Updated:
2 years ago
Category:
Plugins
Tags:
,

Menu Expose for Ionic v2/v3 is the directive for enabling tablet/desktop menu on ion-menu component (demo).

Installation:

  • Download the zip file and unzip it;
  • Copy files from mama-menu-expose/src and paste them into src folder within your project;
  • Import directive in app.module.ts:

```javascript import { MamaMenuExpose } from './../mama-menu-expose.component'; ...

@NgModule({ declarations: [ ..., MamaMenuExpose ], ... }) export class AppModule {} ```

Usage:

The initial setup for exposing menu is when window width is equal or larger than 1024px. To change initial value, add following line into src/theme/variables.scss:

$mama-menu-expose-when: 900px;

if menu should expose when window width is equal or larger than 900px. This value can also be changed on the beginning of mama-menu-expose.component.scss file.

Note: If type of ion-menu is not overlay (link), attribute mamaMenuExposeWhen should be set on ion-nav component:

html <ion-nav ... mamaMenuExposeWhen="900"> </ion-nav>

where value of attribute mamaMenuExposeWhen should be the same as value of variable $mama-menu-expose-when in scss, but without px. If the initial value of $mama-menu-expose-when variable is not changed, attribute mamaMenuExposeWhen can be set without value:

html <ion-nav ... mamaMenuExposeWhen> </ion-nav>

Options:
  • [mamaMenuExposeWhen] (optional number) - use only if type of ion-menu is not overlay. Usage is explained above;