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

docs(demos): prettify list demo and remove unnecessary/unused files

Browse Source 
references #5311
This commit is contained in:
Brandy Carney
2016-02-03 12:48:13 -05:00
parent 234ab90fd0
commit d38e3fd5f3
8 changed files with 76 additions and 436 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
demos/list/app.html
View File

@ -1,24 +0,0 @@
<ion-menu [content]="content" id="leftMenu" side="left">
<ion-toolbar primary>
<ion-title>Menu</ion-title>
</ion-toolbar>
<ion-content>
<ion-list>
<button ion-item *ngFor="#p of pages" (click)="openPage(p)">
{{p.title}}
</button>
<button ion-item menuClose="leftMenu" detail-none>
Close Menu
</button>
</ion-list>
</ion-content>
</ion-menu>
<ion-nav id="nav" [root]="rootPage" #content></ion-nav>

85
demos/list/basic-list.html
View File

@ -1,85 +0,0 @@
<ion-navbar *navbar class="show-navbar">
<button menuToggle="leftMenu">
<ion-icon menu></ion-icon>
</button>
<ion-title>
Basic List
</ion-title>
</ion-navbar>
<ion-content class="outer-content">
<ion-list>
<ion-list-header>
List Header
</ion-list-header>
<ion-item>
<ion-icon name="wifi" item-left></ion-icon>
<ion-label>Wifi</ion-label>
<ion-toggle></ion-toggle>
</ion-item>
<ion-item>
<ion-icon name="heart" item-left></ion-icon>
Affection
<ion-note item-right>
Very Little
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="home" item-left></ion-icon>
Home
<ion-note item-right>
Where the heart is
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="color-wand" item-left></ion-icon>
<ion-label>Magic</ion-label>
<ion-toggle secondary checked="true"></ion-toggle>
</ion-item>
<ion-item>
<ion-icon name="star" item-left></ion-icon>
Star status
<ion-note item-right>
Super
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="pizza" item-left></ion-icon>
Pizza
<ion-note item-right>
Always
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="beer" item-left></ion-icon>
Beer
<ion-note item-right>
Yes Plz
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="wine" item-left></ion-icon>
Wine
<ion-note item-right>
All the time
</ion-note>
</ion-item>
</ion-list>
</ion-content>

68
demos/list/index.ts
View File

@ -1,71 +1,9 @@
import {App, IonicApp, Page, Platform} from 'ionic/ionic';
import {App} from 'ionic/ionic';
@App({
templateUrl: 'app.html'
templateUrl: 'main.html'
})
class ApiDemoApp {
constructor(app: IonicApp, platform: Platform) {
this.app = app;
this.platform = platform;
this.rootPage = PageOne;
this.pages = [
{ title: 'Basic List', component: PageOne },
{ title: 'Inset List', component: PageTwo },
{ title: 'No-lines List', component: PageThree },
{ title: 'List Headers', component: PageFour },
{ title: 'Sliding Items', component: PageFive },
];
}
openPage(page) {
this.app.getComponent('leftMenu').close();
let nav = this.app.getComponent('nav');
nav.setRoot(page.component);
}
}
@Page({
templateUrl: 'basic-list.html',
})
export class PageOne{
constructor() {
}
}
@Page({
templateUrl: 'inset-list.html',
})
export class PageTwo {
constructor() {
}
}
@Page({
templateUrl: 'no-lines-list.html',
})
export class PageThree {
constructor() {
}
}
@Page({
templateUrl: 'list-headers.html',
})
export class PageFour {
constructor() {
}
}
@Page({
templateUrl: 'sliding-items.html',
})
export class PageFive {
constructor() {
}
constructor() { }
}

83
demos/list/inset-list.html
View File

@ -1,83 +0,0 @@
<ion-navbar *navbar class="show-navbar">
<button menuToggle="leftMenu">
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>
Inset List
</ion-title>
</ion-navbar>
<ion-content class="outer-content">
<ion-list inset>
<ion-list-header>
List Header
</ion-list-header>
<ion-toggle>
<ion-icon name="wifi" item-left></ion-icon>
Wifi
</ion-toggle>
<ion-item>
<ion-icon name="heart" item-left></ion-icon>
Affection
<ion-note item-right>
Very Little
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="home" item-left></ion-icon>
Home
<ion-note item-right>
Where the heart is
</ion-note>
</ion-item>
<ion-toggle checked="true">
<ion-icon name="color-wand" item-left></ion-icon>
Magic
</ion-toggle>
<ion-item>
<ion-icon name="star" item-left></ion-icon>
Star status
<ion-note item-right>
Super
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="pizza" item-left></ion-icon>
Pizza
<ion-note item-right>
Always
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="beer" item-left></ion-icon>
Beer
<ion-note item-right>
Yes Plz
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="wine" item-left></ion-icon>
Wine
<ion-note item-right>
All the time
</ion-note>
</ion-item>
</ion-list>
</ion-content>

37
demos/list/list-headers.html
View File

@ -1,37 +0,0 @@
<ion-navbar *navbar class="show-navbar">
<button menuToggle="leftMenu">
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>
List Headers
</ion-title>
</ion-navbar>
<ion-content class="outer-content">
<ion-list>
<ion-list-header>Comedy</ion-list-header>
<ion-item>Airplane!</ion-item>
<ion-item>Caddyshack</ion-item>
<ion-item>Coming To America</ion-item>
</ion-list>
<ion-list>
<ion-list-header>Action</ion-list-header>
<ion-item>Terminator II</ion-item>
<ion-item>The Empire Strikes Back</ion-item>
<ion-item>Blade Runner</ion-item>
</ion-list>
<ion-list>
<ion-list-header>Horror</ion-list-header>
<ion-item>The Evil Dead</ion-item>
<ion-item>Poldergeist</ion-item>
<ion-item>Aliens</ion-item>
</ion-list>
</ion-content>

73
demos/list/main.html Normal file
View File

@ -0,0 +1,73 @@
<ion-toolbar>
<ion-title>List</ion-title>
</ion-toolbar>
<ion-content class="outer-content">
<ion-list>
<ion-list-header>
Settings
</ion-list-header>
<ion-item>
<ion-icon name="plane" item-left danger></ion-icon>
<ion-label>Airplane Mode</ion-label>
<ion-toggle secondary></ion-toggle>
</ion-item>
<button ion-item>
<ion-icon name="wifi" item-left primary></ion-icon>
<ion-label>Wi-Fi</ion-label>
<ion-note item-right>The Interwebz</ion-note>
</button>
<button ion-item>
<ion-icon name="bluetooth" item-left primary></ion-icon>
<ion-label>Bluetooth</ion-label>
<ion-note item-right>Off</ion-note>
</button>
<button ion-item>
<ion-icon name="call" item-left secondary></ion-icon>
<ion-label>Cellular</ion-label>
</button>
<button ion-item>
<ion-icon name="link" item-left secondary></ion-icon>
<ion-label>Personal Hotspot</ion-label>
<ion-note item-right>Off</ion-note>
</button>
</ion-list>
<ion-list radio-group>
<ion-list-header>
Silence Phone
</ion-list-header>
<ion-item>
<ion-label dark>Always</ion-label>
<ion-radio value="always" checked></ion-radio>
</ion-item>
<ion-item>
<ion-label dark>Only while phone is locked</ion-label>
<ion-radio value="locked"></ion-radio>
</ion-item>
</ion-list>
<ion-list>
<ion-list-header>
Apps Installed
</ion-list-header>
<ion-item>
<ion-icon name="ionic" item-left primary></ion-icon>
<ion-label>Ionic View</ion-label>
<button outline item-right>Uninstall</button>
</ion-item>
<ion-item>
<ion-icon name="brush" item-left primary></ion-icon>
<ion-label>Ionic Creator</ion-label>
<button outline item-right>Uninstall</button>
</ion-item>
</ion-list>
</ion-content>

83
demos/list/no-lines-list.html
View File

@ -1,83 +0,0 @@
<ion-navbar *navbar class="show-navbar">
<button menuToggle="leftMenu">
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>
No-lines List
</ion-title>
</ion-navbar>
<ion-content class="outer-content">
<ion-list no-lines>
<ion-list-header>
List Header
</ion-list-header>
<ion-toggle>
<ion-icon name="wifi" item-left></ion-icon>
Wifi
</ion-toggle>
<ion-item>
<ion-icon name="heart" item-left></ion-icon>
Affection
<ion-note item-right>
Very Little
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="home" item-left></ion-icon>
Home
<ion-note item-right>
Where the heart is
</ion-note>
</ion-item>
<ion-toggle checked="true">
<ion-icon name="color-wand" item-left></ion-icon>
Magic
</ion-toggle>
<ion-item>
<ion-icon name="star" item-left></ion-icon>
Star status
<ion-note item-right>
Super
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="pizza" item-left></ion-icon>
Pizza
<ion-note item-right>
Always
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="beer" item-left></ion-icon>
Beer
<ion-note item-right>
Yes Plz
</ion-note>
</ion-item>
<ion-item>
<ion-icon name="wine" item-left></ion-icon>
Wine
<ion-note item-right>
All the time
</ion-note>
</ion-item>
</ion-list>
</ion-content>

59
demos/list/sliding-items.html
View File

@ -1,59 +0,0 @@
<ion-navbar *navbar class="show-navbar">
<button menuToggle="leftMenu">
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>
Sliding Items
</ion-title>
</ion-navbar>
<ion-content class="outer-content">
<ion-list>
<ion-item-sliding #item>
<button ion-item text-wrap>
<h3>Max Lynch</h3>
<p>
Hey do you want to go to the game tonight?
</p>
</button>
<ion-item-options>
<button primary>Archive</button>
<button danger>Delete</button>
</ion-item-options>
</ion-item-sliding>
<ion-item-sliding #item>
<button ion-item text-wrap>
<h3>Adam Bradley</h3>
<p>
I think I figured out how to get more Mountain Dew
</p>
</button>
<ion-item-options>
<button primary>Archive</button>
<button danger>Delete</button>
</ion-item-options>
</ion-item-sliding>
<ion-item-sliding #item>
<button ion-item text-wrap>
<h3>Ben Sperry</h3>
<p>
I like paper
</p>
</button>
<ion-item-options>
<button primary>Archive</button>
<button danger>Delete</button>
</ion-item-options>
</ion-item-sliding>
</ion-list>
</ion-content>