69 lines
2.1 KiB
HTML
69 lines
2.1 KiB
HTML
<ion-view class="forms-view">
|
|
<ion-nav-buttons side="left">
|
|
<button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
|
|
</ion-nav-buttons>
|
|
<ion-nav-title>
|
|
<span>Forms</span>
|
|
</ion-nav-title>
|
|
<ion-content>
|
|
<ul class="list">
|
|
|
|
<div class="item item-divider">Inline Labels</div>
|
|
|
|
<label class="item item-input">
|
|
<span class="input-label">First Name</span>
|
|
<input type="text">
|
|
</label>
|
|
<label class="item item-input">
|
|
<span class="input-label">Last Name</span>
|
|
<input type="text">
|
|
</label>
|
|
<label class="item item-input">
|
|
<span class="input-label">Email</span>
|
|
<input type="email">
|
|
</label>
|
|
|
|
<div class="item item-divider">Floating Labels</div>
|
|
|
|
<label class="item item-input item-floating-label">
|
|
<span class="input-label">Telephone</span>
|
|
<input type="tel" placeholder="Your phone">
|
|
</label>
|
|
<label class="item item-input item-floating-label">
|
|
<span class="input-label">Number</span>
|
|
<input type="number" placeholder="Some number">
|
|
</label>
|
|
|
|
<div class="item item-divider">Stacked Labels</div>
|
|
|
|
<label class="item item-input item-stacked-label">
|
|
<span class="input-label">Birth date</span>
|
|
<input type="date">
|
|
</label>
|
|
<label class="item item-input item-stacked-label">
|
|
<span class="input-label">Month</span>
|
|
<input type="month">
|
|
</label>
|
|
|
|
<div class="item item-divider">Placeholder Labels</div>
|
|
|
|
<label class="item item-input">
|
|
<textarea placeholder="Description"></textarea>
|
|
</label>
|
|
<label class="item item-input">
|
|
<input type="password" placeholder="Your password">
|
|
</label>
|
|
|
|
<div class="item item-divider">Inset Inputs</div>
|
|
|
|
<div class="item item-input-inset">
|
|
<label class="item-input-wrapper">
|
|
<input type="text" placeholder="Search...">
|
|
</label>
|
|
<button class="button button-small">
|
|
Submit
|
|
</button>
|
|
</div>
|
|
</ul>
|
|
</ion-content>
|
|
</ion-view>
|