docs(demos): add searchbar API demo

references driftyco/ionic-site#397
This commit is contained in:
Brandy Carney
2016-02-04 12:49:43 -05:00
parent 6ae164da59
commit f64bf4a81c
3 changed files with 48 additions and 0 deletions

6
demos/searchbar/index.ts Normal file
View File

@ -0,0 +1,6 @@
import {App} from 'ionic/ionic';
@App({
templateUrl: 'main.html'
})
class ApiDemoApp {}

41
demos/searchbar/main.html Normal file
View File

@ -0,0 +1,41 @@
<ion-toolbar>
<ion-title>Searchbar</ion-title>
</ion-toolbar>
<ion-toolbar>
<ion-searchbar placeholder="Default Toolbar"></ion-searchbar>
</ion-toolbar>
<ion-toolbar primary>
<ion-searchbar placeholder="Primary Toolbar"></ion-searchbar>
</ion-toolbar>
<ion-toolbar secondary>
<ion-searchbar placeholder="Secondary Toolbar"></ion-searchbar>
</ion-toolbar>
<ion-content class="searchbar-demo">
<p padding-left padding-right>Searchbars can be placed in a toolbar or anywhere in the content.</p>
<ion-searchbar placeholder="Default Searchbar"></ion-searchbar>
<hr>
<ion-searchbar placeholder="Primary Searchbar" primary></ion-searchbar>
<hr>
<ion-searchbar placeholder="Secondary Searchbar" secondary></ion-searchbar>
<hr>
<ion-searchbar placeholder="Danger Searchbar" danger></ion-searchbar>
</ion-content>
<ion-toolbar danger position="bottom">
<ion-searchbar placeholder="Danger Toolbar"></ion-searchbar>
</ion-toolbar>
<style>
.searchbar-demo hr {
background-color: transparent;
}
</style>

View File

@ -55,6 +55,7 @@ export class SearchbarInput {
* @property {Any} [cancel] - Expression to evaluate when the cancel button is clicked
* @property {Any} [clear] - Expression to evaluate when the clear input button is clicked
*
* @demo /docs/v2/demos/searchbar/
* @see {@link /docs/v2/components#searchbar Searchbar Component Docs}
*/
@Component({