mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 04:14:21 +08:00
6
demos/searchbar/index.ts
Normal file
6
demos/searchbar/index.ts
Normal file
@ -0,0 +1,6 @@
|
||||
import {App} from 'ionic/ionic';
|
||||
|
||||
@App({
|
||||
templateUrl: 'main.html'
|
||||
})
|
||||
class ApiDemoApp {}
|
41
demos/searchbar/main.html
Normal file
41
demos/searchbar/main.html
Normal 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>
|
@ -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({
|
||||
|
Reference in New Issue
Block a user