This commit is contained in:
Max Lynch
2015-07-19 09:19:40 -05:00
parent f1da4c8973
commit b059c88fc7
2 changed files with 14 additions and 5 deletions

View File

@ -1,12 +1,12 @@
import {Component, Directive} from 'angular2/angular2'; import {Component, Directive} from 'angular2/angular2';
import {App, IonicView, Register} from 'ionic/ionic'; import {App, IonicApp, IonicView, Register} from 'ionic/ionic';
@IonicView({ @IonicView({
template: '<ion-navbar *navbar primary>' + template: '<ion-navbar *navbar primary>' +
'<ion-title>Heading</ion-title>' + '<ion-title>Heading</ion-title>' +
'<ion-nav-items primary>' + '<ion-nav-items primary>' +
'<button icon><i class="icon ion-navicon"></i></button>' + '<button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button>' +
'</ion-nav-items>' + '</ion-nav-items>' +
'<ion-nav-items secondary>' + '<ion-nav-items secondary>' +
'<button><ion-icon md="ion-android-search" ios="ion-ios-search-strong"></i></button>' + '<button><ion-icon md="ion-android-search" ios="ion-ios-search-strong"></i></button>' +
@ -30,13 +30,18 @@ import {App, IonicView, Register} from 'ionic/ionic';
'</ion-content>' '</ion-content>'
}) })
export class FirstPage { export class FirstPage {
constructor() { constructor(app: IonicApp) {
this.app = app;
}
toggleMenu() {
console.log('TOGGLE');
this.app.getComponent('myAside').toggle();
} }
} }
@App({ @App({
template: `<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,700,500' rel='stylesheet' type='text/css'> template: `<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,700,500' rel='stylesheet' type='text/css'>
<ion-aside id="menu" side="left" [content]="content"> <ion-aside id="menu" side="left" [content]="content" [register]="aside" register-id="myAside" #aside>
<ion-toolbar primary><ion-title>Menu</ion-title></ion-toolbar> <ion-toolbar primary><ion-title>Menu</ion-title></ion-toolbar>
<ion-list> <ion-list>
<ion-item>Your Profile</ion-item> <ion-item>Your Profile</ion-item>

View File

@ -6,10 +6,14 @@ $toolbar-material-button-font-size: 2rem !default;
$toolbar-material-button-text-color: #007aff !default; $toolbar-material-button-text-color: #007aff !default;
.toolbar[mode="md"] { .toolbar[mode="md"] {
padding: 0px 15px; padding: 0px 16px;
height: $toolbar-material-height; height: $toolbar-material-height;
background: $toolbar-material-background; background: $toolbar-material-background;
.toolbar-inner-title {
padding: 0;
}
ion-title { ion-title {
font-size: $toolbar-material-title-font-size; font-size: $toolbar-material-title-font-size;
font-weight: 500; font-weight: 500;