mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 12:29:55 +08:00
05c7b8f0d7
- add spacing between imports - alphabetize imports - removed app.html files in favor of an inline ion-nav - cleaned up config demo so it uses proper syntax - use file name main.html for the first page for the demo - name the app ApiDemoApp and first page ApiDemoPage - replace the ion-toolbars with ion-navbars closes #7019 closes driftyco/ionic-site#647
133 lines
3.1 KiB
HTML
133 lines
3.1 KiB
HTML
<ion-header>
|
|
|
|
<ion-navbar>
|
|
<ion-title>{{demo}}</ion-title>
|
|
</ion-navbar>
|
|
|
|
</ion-header>
|
|
|
|
|
|
<ion-content>
|
|
|
|
<ion-toolbar no-border-top>
|
|
<ion-title>Long title that never ends. It just goes on and on my friend.</ion-title>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top>
|
|
<ion-buttons start>
|
|
<button>
|
|
<ion-icon name="contact"></ion-icon>
|
|
</button>
|
|
<button>
|
|
<ion-icon name="search"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-buttons end>
|
|
<button>
|
|
<ion-icon name="more"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-title>Default Buttons</ion-title>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top>
|
|
<ion-buttons start>
|
|
<button danger>
|
|
<ion-icon name="contact"></ion-icon>
|
|
</button>
|
|
<button secondary>
|
|
<ion-icon name="search"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-buttons end>
|
|
<button dark>
|
|
<ion-icon name="more"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-title>Colored Buttons</ion-title>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top>
|
|
<ion-buttons start>
|
|
<button solid>
|
|
<ion-icon name="contact"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-title>Solid</ion-title>
|
|
<ion-buttons end>
|
|
<button solid secondary>
|
|
Help
|
|
<ion-icon name="help-circle"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top>
|
|
<ion-buttons start>
|
|
<button outline>
|
|
<ion-icon name="contact"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-buttons end>
|
|
<button outline secondary>
|
|
Help
|
|
<ion-icon name="help-circle"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-title>Outline</ion-title>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top>
|
|
<button menuToggle>
|
|
<ion-icon name="menu"></ion-icon>
|
|
</button>
|
|
<ion-title>Left Menu</ion-title>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top>
|
|
<ion-title>Right Menu</ion-title>
|
|
<button menuToggle right>
|
|
<ion-icon name="menu"></ion-icon>
|
|
</button>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top *ngIf="demo != 'Title'">
|
|
<ion-buttons end>
|
|
<button #button2 (click)="buttonClick(button2)">
|
|
<ion-icon name="search"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
<ion-segment danger [(ngModel)]="favorites">
|
|
<ion-segment-button value="featured">
|
|
Featured
|
|
</ion-segment-button>
|
|
<ion-segment-button value="recent">
|
|
Recent
|
|
</ion-segment-button>
|
|
</ion-segment>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top *ngIf="demo != 'Title'">
|
|
<ion-segment [(ngModel)]="apps">
|
|
<ion-segment-button value="paid">
|
|
Paid
|
|
</ion-segment-button>
|
|
<ion-segment-button value="free">
|
|
Free
|
|
</ion-segment-button>
|
|
<ion-segment-button value="top">
|
|
Top
|
|
</ion-segment-button>
|
|
</ion-segment>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top *ngIf="demo != 'Title'">
|
|
<ion-searchbar></ion-searchbar>
|
|
</ion-toolbar>
|
|
|
|
<ion-toolbar no-border-top primary *ngIf="demo != 'Title'">
|
|
<ion-searchbar></ion-searchbar>
|
|
</ion-toolbar>
|
|
|
|
</ion-content>
|