javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 19:57:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

Basic open close modal

Browse Source
This commit is contained in:
Max Lynch
2015-05-29 14:01:16 -05:00
parent 2b2e4261ff
commit 96b91d724e
3 changed files with 11 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ionic/components/modal/modal.js
View File

@ -146,7 +146,7 @@ export class Modal {
selector: 'ion-modal' selector: 'ion-modal'
}) })
@View({ @View({
template: '<div class="modal"><ion-modal-content></ion-modal-content></div>', template: '<ion-modal-content></ion-modal-content>',
directives: [ModalContent] directives: [ModalContent]
}) })
class ModalContainer { class ModalContainer {

6
ionic/components/modal/modal.scss
View File

@ -45,15 +45,15 @@ ion-modal {
width: 100%; width: 100%;
background-color: $modal-bg-color; background-color: $modal-bg-color;
transform: translate3d(0, 100%, 0); //transform: translate3d(0, 100%, 0);
transition: all cubic-bezier(.1, .7, .1, 1) 400ms; //transition: all cubic-bezier(.1, .7, .1, 1) 400ms;
} }
// Slide up from the bottom, used for modals // Slide up from the bottom, used for modals
// ------------------------------- // -------------------------------
ion-modal.active { ion-modal.active {
transform: translate3d(0, 0, 0); //transform: translate3d(0, 0, 0);
} }
/* /*

9
ionic/components/modal/test/basic/index.js
View File

@ -36,8 +36,13 @@ class IonicApp {
selector: 'contact-modal' selector: 'contact-modal'
}) })
@View({ @View({
template: '<ion-nav [initial]="initial"></ion-nav>', //template: '<ion-content padding><button primary (click)="close()">Close</button></ion-content>',//<ion-nav [initial]="initial"></ion-nav>',
directives: [Nav] template: `
<p>First Page: {{ val }}</p>
<p>
<button primary (click)="close()">Close</button>
</p>`,
directives: [Nav, Button, Content]
}) })
export class ContactModal { export class ContactModal {
constructor(modalRef: ModalRef) { constructor(modalRef: ModalRef) {