mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
docs(demos): badge demo
This commit is contained in:
1
demos/component-docs/badge/badge.ts
Normal file
1
demos/component-docs/badge/badge.ts
Normal file
@ -0,0 +1 @@
|
||||
export * from './basic/pages';
|
13
demos/component-docs/badge/basic/pages.ts
Normal file
13
demos/component-docs/badge/basic/pages.ts
Normal file
@ -0,0 +1,13 @@
|
||||
import {Page} from 'ionic/ionic';
|
||||
import {forwardRef} from 'angular2/angular2';
|
||||
import {AndroidAttribute} from '../../helpers';
|
||||
|
||||
@Page({
|
||||
templateUrl: 'badge/basic/template.html',
|
||||
directives: [forwardRef(() => AndroidAttribute)]
|
||||
})
|
||||
export class BasicPage {
|
||||
constructor() {
|
||||
|
||||
}
|
||||
}
|
4
demos/component-docs/badge/basic/styles.scss
Normal file
4
demos/component-docs/badge/basic/styles.scss
Normal file
@ -0,0 +1,4 @@
|
||||
.preview-icons {
|
||||
font-size: 2em;
|
||||
text-align: center;
|
||||
}
|
35
demos/component-docs/badge/basic/template.html
Normal file
35
demos/component-docs/badge/basic/template.html
Normal file
@ -0,0 +1,35 @@
|
||||
|
||||
<ion-navbar *navbar hide-back-button class="show-navbar android-attr">
|
||||
<ion-title>Badge</ion-title>
|
||||
</ion-navbar>
|
||||
|
||||
<ion-content>
|
||||
|
||||
<ion-card>
|
||||
|
||||
<img src="img/bjork-live.png"/>
|
||||
|
||||
<ion-card-content>
|
||||
<h2 class="card-title">
|
||||
Björk
|
||||
</h2>
|
||||
<p>
|
||||
Björk first came to prominence as one of the lead vocalists of the avant pop Icelandic sextet the Sugarcubes, but when...
|
||||
</p>
|
||||
</ion-card-content>
|
||||
|
||||
<ion-item>
|
||||
<icon musical-notes item-left style="color: #d03e84"></icon>
|
||||
Albums
|
||||
<ion-badge item-right>9</ion-badge>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<icon ion-social-twitter item-left style="color: #55acee"></icon>
|
||||
Followers
|
||||
<ion-badge item-right>260k</ion-badge>
|
||||
</ion-item>
|
||||
|
||||
</ion-card>
|
||||
|
||||
</ion-content>
|
@ -2,6 +2,7 @@ import {Directive, ElementRef, Renderer} from 'angular2/angular2';
|
||||
import {Platform, Navbar} from 'ionic/ionic';
|
||||
|
||||
import * as actionSheets from './action-sheets/action-sheets';
|
||||
import * as badges from './badge/badge';
|
||||
import * as buttons from './buttons/buttons';
|
||||
import * as cards from './cards/cards';
|
||||
import * as grid from './grid/grid';
|
||||
@ -71,6 +72,7 @@ export function getPageFor(hash) {
|
||||
return {
|
||||
'overview': actionSheets.BasicPage,
|
||||
'action-sheets': actionSheets.BasicPage,
|
||||
'badges': badges.BasicPage,
|
||||
|
||||
'buttons': buttons.BasicPage,
|
||||
'block-buttons': buttons.BlockPage,
|
||||
|
BIN
demos/component-docs/img/bjork-live.png
Normal file
BIN
demos/component-docs/img/bjork-live.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 443 KiB |
Reference in New Issue
Block a user