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

chore(): begin adding ionic components to mono-repo.

Browse Source
This commit is contained in:
Josh Thomas
2017-06-21 09:33:06 -05:00
parent 1181fe98fc
commit bd5b67304d
2159 changed files with 15687 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/ionic-angular/demos/src/tabs/app/app.component.ts Normal file
View File

@ -0,0 +1,9 @@
import { Component } from '@angular/core';
import { PageOne } from '../pages/page-one/page-one';
@Component({
template: '<ion-nav [root]="root"></ion-nav>'
})
export class AppComponent {
root = PageOne;
}

21
packages/ionic-angular/demos/src/tabs/app/app.module.ts Normal file
View File

@ -0,0 +1,21 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule } from '../../../../src';
import { AppComponent } from './app.component';
import { PageOneModule } from '../pages/page-one/page-one.module';
import { PageTwoModule } from '../pages/page-two/page-two.module';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
IonicModule.forRoot(AppComponent),
PageOneModule,
PageTwoModule
],
bootstrap: [IonicApp]
})
export class AppModule {}

5
packages/ionic-angular/demos/src/tabs/app/main.ts Normal file
View File

@ -0,0 +1,5 @@
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
platformBrowserDynamic().bootstrapModule(AppModule);

74
packages/ionic-angular/demos/src/tabs/pages/page-one/page-one.html Normal file
View File

@ -0,0 +1,74 @@
<ion-header>
<ion-navbar>
<ion-title>Tabs</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<!-- Text -->
<ion-tabs tabs-only>
<ion-tab tabTitle="Recents" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" [root]="root" tabBadge="23"></ion-tab>
<ion-tab tabTitle="Settings" [root]="root"></ion-tab>
</ion-tabs>
<!-- Icons -->
<ion-tabs tabs-only selectedIndex="1" color="primary">
<ion-tab tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabIcon="settings" [root]="root" tabBadge="2" tabBadgeStyle="danger"></ion-tab>
</ion-tabs>
<!-- Icons on top of text -->
<ion-tabs tabs-only selectedIndex="2" color="secondary">
<ion-tab tabTitle="Location" tabIcon="navigate" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="star" [root]="root" tabBadge="12" tabBadgeStyle="dark"></ion-tab>
<ion-tab tabTitle="Radio" tabIcon="musical-notes" [root]="root"></ion-tab>
</ion-tabs>
<!-- Icons below text -->
<ion-tabs tabs-only tabsLayout="icon-bottom" selectedIndex="1" color="danger">
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root" tabBadge="47" tabBadgeStyle="light"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
</ion-tabs>
<!-- Icons right of text -->
<ion-tabs tabs-only tabsLayout="icon-end" selectedIndex="0" color="light">
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root" tabBadge="4" tabBadgeStyle="secondary"></ion-tab>
</ion-tabs>
<!-- Icons left of text -->
<ion-tabs tabs-only tabsLayout="icon-start" color="dark">
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root" tabBadge="1" tabBadgeStyle="danger"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
</ion-tabs>
<!-- No icons -->
<ion-tabs tabs-only tabsLayout="icon-hide">
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root" tabBadge="61" tabBadgeStyle="dark"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
</ion-tabs>
<!-- No overflow text -->
<ion-tabs tabs-only color="primary">
<ion-tab tabTitle="Indiana Jones and the Raiders of the Lost Ark" [root]="root"></ion-tab>
<ion-tab tabTitle="Indiana Jones and the Temple of Doom" [root]="root"></ion-tab>
<ion-tab tabTitle="Indiana Jones and the Last Crusade" [root]="root"></ion-tab>
</ion-tabs>
</ion-content>

17
packages/ionic-angular/demos/src/tabs/pages/page-one/page-one.module.ts Normal file
View File

@ -0,0 +1,17 @@
import { NgModule } from '@angular/core';
import { IonicPageModule } from '../../../../../src';
import { PageOne } from './page-one';
@NgModule({
declarations: [
PageOne,
],
imports: [
IonicPageModule.forChild(PageOne),
],
entryComponents: [
PageOne,
]
})
export class PageOneModule {}

28
packages/ionic-angular/demos/src/tabs/pages/page-one/page-one.ts Normal file
View File

@ -0,0 +1,28 @@
import { Component, ViewEncapsulation } from '@angular/core';
import { PageTwo } from '../page-two/page-two';
@Component({
templateUrl: 'page-one.html',
selector: 'api-demo-page',
encapsulation: ViewEncapsulation.None,
styles: [
`
ion-tabs {
margin-bottom: 20px;
}
`,
`
ion-tabs,
ion-tabs .tabbar {
position: relative;
top: auto;
height: auto;
visibility: visible;
opacity: 1;
}
`
]
})
export class PageOne {
root = PageTwo;
}

17
packages/ionic-angular/demos/src/tabs/pages/page-two/page-two.module.ts Normal file
View File

@ -0,0 +1,17 @@
import { NgModule } from '@angular/core';
import { IonicPageModule } from '../../../../../src';
import { PageTwo } from './page-two';
@NgModule({
declarations: [
PageTwo,
],
imports: [
IonicPageModule.forChild(PageTwo),
],
entryComponents: [
PageTwo,
]
})
export class PageTwoModule {}

7
packages/ionic-angular/demos/src/tabs/pages/page-two/page-two.ts Normal file
View File

@ -0,0 +1,7 @@
import { Component } from '@angular/core';
@Component({
template: '<div>johnny utah</div>',
selector: 'tab-page'
})
export class PageTwo {}