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

Main

Browse Source
This commit is contained in:
Max Lynch
2015-06-07 22:07:05 -05:00
parent aec085b9f2
commit d2169386fb
3 changed files with 95 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ionic/components/app/test/snapcat/index.js
View File

@ -2,12 +2,12 @@ import {bootstrap} from 'angular2/angular2'
import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations'; import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view'; import {View} from 'angular2/src/core/annotations_impl/view';
import {Nav, Slides, Slide, Content, Button} from 'ionic/ionic'; import {Nav, Slides, Slide, Content, Button, List, Item} from 'ionic/ionic';
@Component({ selector: 'ion-app' }) @Component({ selector: 'ion-app' })
@View({ @View({
templateUrl: 'main.html', templateUrl: 'main.html',
directives: [Nav, Slides, Slide, Content, Button] directives: [Nav, Slides, Slide, Content, Button, List, Item]
}) })
export class IonicApp { export class IonicApp {
constructor() { constructor() {

105
ionic/components/app/test/snapcat/main.html
View File

@ -1,31 +1,110 @@
<ion-slides> <ion-slides >
<ion-slide> <ion-slide>
<ion-view> <ion-view>
<ion-toolbar>
<ion-title>secret</ion-title> <ion-toolbar id="p1toolbar">
<div class="toolbar-inner">
<ion-title>secret</ion-title>
</div>
</ion-toolbar> </ion-toolbar>
<ion-content> <ion-content>
<h2>Page 1</h2> <ion-list>
<ion-item>
Activity
</ion-item>
<ion-item>
Chat
</ion-item>
</ion-list>
</ion-content> </ion-content>
</ion-view> </ion-view>
</ion-slide> </ion-slide>
<ion-slide> <ion-slide>
<ion-view> <ion-view>
<ion-toolbar>
<ion-title>feed</ion-title> <ion-toolbar id="p2toolbar">
<div class="toolbar-inner">
<ion-title>feed</ion-title>
</div>
</ion-toolbar> </ion-toolbar>
<ion-content> <ion-content>
<h2>Page 2</h2>
<div class="card">
<div class="item">
<div class="item-content">
<div class="item-label">
This is a nice test. What do you
think about space ships and pumpkins? Of
rainbows and blue shoes? Of rabbits
and mistletoe?
<img src="p.jpg">
</div>
</div>
</div>
</div>
</ion-content> </ion-content>
</ion-view> </ion-view>
</ion-slide> </ion-slide>
</ion-slides> </ion-slides>
<link href='http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<style> <style>
.navbar-container { ion-view {
background-color: #ff6600 !important; background-color: #F5F5F5;
} }
.nav-ios ion-title { ion-content {
color: #fff !important; background-color: #F5F5F5 !important;
} }
.card {
box-shadow: none !important;
}
.card .item {
border: none !important;
}
.platform-ios .card .item-content {
padding: 25px;
}
.item {
font-family: 'lato';
font-size: 16px;
}
.item-content {
min-height: 70px !important;
}
ion-toolbar {
text-align: center;
align-items: center;
}
ion-toolbar:after {
background: none !important;
}
ion-toolbar {
letter-spacing: 1px;
}
.platform-ios .item:first-of-type:before,
.platform-ios .item:last-of-type:after,
.platform-ios .item-content:after {
background-color: #F5F5F5 !important;
}
#p1toolbar {
background-color: #FFB400;
}
#p1toolbar ion-title {
color: white;
font-family: 'lato';
}
#p2toolbar {
background-color: #FF0000;
}
#p2toolbar ion-title {
color: white;
font-family: 'lato';
}
</style> </style>

2
ionic/components/slides/test/basic/index.js
View File

@ -8,7 +8,7 @@ import {Slides, Slide, SlidePager, List, Item, Content, Button} from 'ionic/ioni
selector: 'ion-app' selector: 'ion-app'
}) })
@View({ @View({
directives: [Slides, Slide, SlidePager, Content, Button], directives: [Slides, Slide, SlidePager, Content, Button, List, Item],
templateUrl: 'main.html' templateUrl: 'main.html'
}) })
class IonicApp { class IonicApp {