mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-23 05:58:26 +08:00
test(e2e): update icon attributes to use rtl attributes (#11912)
This commit is contained in:

committed by
Brandy Carney

parent
6322134994
commit
f5bbdcd32e
@ -15,8 +15,8 @@
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<a ion-button block href="#" icon-left><ion-icon name="help-circle"></ion-icon> a[ion-button][block] icon</a>
|
||||
<button ion-button block icon-left><ion-icon name="help-circle"></ion-icon> button[ion-button][block] icon</button>
|
||||
<a ion-button block href="#" icon-start><ion-icon name="help-circle"></ion-icon> a[ion-button][block] icon</a>
|
||||
<button ion-button block icon-start><ion-icon name="help-circle"></ion-icon> button[ion-button][block] icon</button>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
|
@ -15,11 +15,11 @@
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<a ion-button full href="#" icon-left>
|
||||
<a ion-button full href="#" icon-start>
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
a[ion-button][full] + icon
|
||||
</a>
|
||||
<button ion-button full icon-left>
|
||||
<button ion-button full icon-start>
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
button[ion-button][full] + icon
|
||||
</button>
|
||||
|
@ -10,22 +10,22 @@
|
||||
<ion-content padding>
|
||||
|
||||
<div>
|
||||
<button ion-button icon-left>
|
||||
<button ion-button icon-start>
|
||||
<ion-icon name="home"></ion-icon>
|
||||
Left Icon
|
||||
</button>
|
||||
<a ion-button icon-left>
|
||||
<a ion-button icon-start>
|
||||
<ion-icon name="home"></ion-icon>
|
||||
Left Icon
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button ion-button icon-right>
|
||||
<button ion-button icon-end>
|
||||
Right Icon
|
||||
<ion-icon name="star"></ion-icon>
|
||||
</button>
|
||||
<a ion-button icon-right>
|
||||
<a ion-button icon-end>
|
||||
Right Icon
|
||||
<ion-icon name="star"></ion-icon>
|
||||
</a>
|
||||
@ -41,22 +41,22 @@
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button ion-button large icon-left>
|
||||
<button ion-button large icon-start>
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
Left, Large
|
||||
</button>
|
||||
<a ion-button large icon-left>
|
||||
<a ion-button large icon-start>
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
Left, Large
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button ion-button large icon-right>
|
||||
<button ion-button large icon-end>
|
||||
Right, Large
|
||||
<ion-icon name="settings"></ion-icon>
|
||||
</button>
|
||||
<a ion-button large icon-right>
|
||||
<a ion-button large icon-end>
|
||||
Right, Large
|
||||
<ion-icon name="settings"></ion-icon>
|
||||
</a>
|
||||
@ -72,22 +72,22 @@
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button ion-button small icon-left>
|
||||
<button ion-button small icon-start>
|
||||
<ion-icon name="checkmark"></ion-icon>
|
||||
Left, Small
|
||||
</button>
|
||||
<a ion-button small icon-left>
|
||||
<a ion-button small icon-start>
|
||||
<ion-icon name="checkmark"></ion-icon>
|
||||
Left, Small
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button ion-button small icon-right>
|
||||
<button ion-button small icon-end>
|
||||
Right, Small
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
<a ion-button small icon-right>
|
||||
<a ion-button small icon-end>
|
||||
Right, Small
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</a>
|
||||
|
@ -28,13 +28,13 @@
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col no-padding>
|
||||
<button ion-button icon-left clear small>
|
||||
<button ion-button icon-start clear small>
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Star
|
||||
</button>
|
||||
</ion-col>
|
||||
<ion-col no-padding text-right>
|
||||
<button ion-button icon-left clear small class="activated">
|
||||
<button ion-button icon-start clear small class="activated">
|
||||
<ion-icon name="share"></ion-icon>
|
||||
Activated
|
||||
</button>
|
||||
@ -66,13 +66,13 @@
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col no-padding>
|
||||
<button ion-button icon-left clear small>
|
||||
<button ion-button icon-start clear small>
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Favorite
|
||||
</button>
|
||||
</ion-col>
|
||||
<ion-col no-padding text-center>
|
||||
<button ion-button icon-left clear small>
|
||||
<button ion-button icon-start clear small>
|
||||
<ion-icon name="musical-notes"></ion-icon>
|
||||
Listen
|
||||
</button>
|
||||
@ -99,20 +99,20 @@
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col no-padding>
|
||||
<button ion-button icon-left clear small dark>
|
||||
<button ion-button icon-start clear small dark>
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Favorite
|
||||
</button>
|
||||
</ion-col>
|
||||
|
||||
<ion-col no-padding text-center>
|
||||
<button ion-button icon-left clear small dark>
|
||||
<button ion-button icon-start clear small dark>
|
||||
<ion-icon name="musical-notes"></ion-icon>
|
||||
Listen
|
||||
</button>
|
||||
</ion-col>
|
||||
<ion-col no-padding text-right>
|
||||
<button ion-button icon-left clear small dark>
|
||||
<button ion-button icon-start clear small dark>
|
||||
<ion-icon name="share-alt"></ion-icon>
|
||||
Share
|
||||
</button>
|
||||
|
@ -71,13 +71,13 @@
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col no-padding>
|
||||
<button ion-button icon-left clear small color="danger">
|
||||
<button ion-button icon-start clear small color="danger">
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Danger
|
||||
</button>
|
||||
</ion-col>
|
||||
<ion-col no-padding text-right>
|
||||
<button ion-button icon-left clear small color="dark">
|
||||
<button ion-button icon-start clear small color="dark">
|
||||
<ion-icon name="share"></ion-icon>
|
||||
Dark
|
||||
</button>
|
||||
|
@ -31,7 +31,7 @@
|
||||
<ion-item>
|
||||
<span item-start>18 min</span>
|
||||
<span item-start>(2.6 mi)</span>
|
||||
<button ion-button icon-left primary clear item-end>
|
||||
<button ion-button icon-start primary clear item-end>
|
||||
<ion-icon name="navigate"></ion-icon>
|
||||
Start
|
||||
</button>
|
||||
@ -61,7 +61,7 @@
|
||||
<ion-item>
|
||||
<span item-start>3 hr</span>
|
||||
<span item-start>(4.8 mi)</span>
|
||||
<button ion-button icon-left danger clear item-end>
|
||||
<button ion-button icon-start danger clear item-end>
|
||||
<ion-icon name="navigate"></ion-icon>
|
||||
Start
|
||||
</button>
|
||||
@ -91,7 +91,7 @@
|
||||
<ion-item>
|
||||
<span item-start secondary>26 min</span>
|
||||
<span item-start>(8.1 mi)</span>
|
||||
<button ion-button icon-left secondary clear item-end>
|
||||
<button ion-button icon-start secondary clear item-end>
|
||||
<ion-icon name="navigate"></ion-icon>
|
||||
Start
|
||||
</button>
|
||||
|
@ -26,11 +26,11 @@
|
||||
</ion-card-content>
|
||||
|
||||
<ion-item>
|
||||
<button ion-button icon-left primary clear item-start>
|
||||
<button ion-button icon-start primary clear item-start>
|
||||
<ion-icon name="thumbs-up"></ion-icon>
|
||||
<div>12 Likes</div>
|
||||
</button>
|
||||
<button ion-button icon-left primary clear item-start>
|
||||
<button ion-button icon-start primary clear item-start>
|
||||
<ion-icon name="text"></ion-icon>
|
||||
<div>4 Comments</div>
|
||||
</button>
|
||||
@ -59,11 +59,11 @@
|
||||
</ion-card-content>
|
||||
|
||||
<ion-item>
|
||||
<button ion-button icon-left primary clear item-start>
|
||||
<button ion-button icon-start primary clear item-start>
|
||||
<ion-icon name="thumbs-up"></ion-icon>
|
||||
<div>30 Likes</div>
|
||||
</button>
|
||||
<button ion-button icon-left primary clear item-start>
|
||||
<button ion-button icon-start primary clear item-start>
|
||||
<ion-icon name="text"></ion-icon>
|
||||
<div>64 Comments</div>
|
||||
</button>
|
||||
@ -91,11 +91,11 @@
|
||||
</ion-card-content>
|
||||
|
||||
<ion-item>
|
||||
<button ion-button icon-left primary clear item-start>
|
||||
<button ion-button icon-start primary clear item-start>
|
||||
<ion-icon name="thumbs-up"></ion-icon>
|
||||
<div>46 Likes</div>
|
||||
</button>
|
||||
<button ion-button icon-left primary clear item-start>
|
||||
<button ion-button icon-start primary clear item-start>
|
||||
<ion-icon name="text"></ion-icon>
|
||||
<div>66 Comments</div>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Page 4</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="tabsPage">
|
||||
<button ion-button icon-end [navPush]="tabsPage">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Page 3</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="page4">
|
||||
<button ion-button icon-end [navPush]="page4">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Main</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="page1">
|
||||
<button ion-button icon-end [navPush]="page1">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Page 2</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="page3">
|
||||
<button ion-button icon-end [navPush]="page3">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Page 4</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="tabsPage">
|
||||
<button ion-button icon-end [navPush]="tabsPage">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Page 3</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="page4">
|
||||
<button ion-button icon-end [navPush]="page4">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Main</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="page1">
|
||||
<button ion-button icon-end [navPush]="page1">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<ion-navbar style="opacity: 0.8">
|
||||
<ion-title>Page 2</ion-title>
|
||||
<ion-buttons right>
|
||||
<button ion-button icon-right [navPush]="page3">
|
||||
<button ion-button icon-end [navPush]="page3">
|
||||
Next
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -119,7 +119,7 @@
|
||||
</ion-list>
|
||||
|
||||
<p>
|
||||
<button ion-button icon-left (click)="updateIcon()">
|
||||
<button ion-button icon-start (click)="updateIcon()">
|
||||
<ion-icon [name]="btnIcon"></ion-icon>
|
||||
Update icon
|
||||
</button>
|
||||
|
@ -119,7 +119,7 @@
|
||||
</ion-list>
|
||||
|
||||
<p>
|
||||
<button ion-button icon-left (click)="updateIcon()">
|
||||
<button ion-button icon-start (click)="updateIcon()">
|
||||
<ion-icon [name]="btnIcon"></ion-icon>
|
||||
Update icon
|
||||
</button>
|
||||
|
@ -40,24 +40,24 @@
|
||||
</ion-item>
|
||||
|
||||
<button ion-item disabled>
|
||||
<button ion-button item-start icon-left (click)="testClick($event)">
|
||||
<button ion-button item-start icon-start (click)="testClick($event)">
|
||||
<ion-icon name="home"></ion-icon>
|
||||
Left Icon
|
||||
</button>
|
||||
disabled left icon buttons
|
||||
<button ion-button outline item-end icon-left (click)="testClick($event)">
|
||||
<button ion-button outline item-end icon-start (click)="testClick($event)">
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Left Icon
|
||||
</button>
|
||||
</button>
|
||||
|
||||
<ion-item>
|
||||
<button ion-button item-start icon-right (click)="testClick($event)">
|
||||
<button ion-button item-start icon-end (click)="testClick($event)">
|
||||
Right Icon
|
||||
<ion-icon name="home"></ion-icon>
|
||||
</button>
|
||||
right icon buttons
|
||||
<button ion-button outline item-end icon-right (click)="testClick($event)">
|
||||
<button ion-button outline item-end icon-end (click)="testClick($event)">
|
||||
Right Icon
|
||||
<ion-icon name="star"></ion-icon>
|
||||
</button>
|
||||
@ -75,14 +75,14 @@
|
||||
|
||||
<a ion-item disabled>
|
||||
a ion-item disabled right icon/text button large
|
||||
<button ion-button item-end large icon-left (click)="testClick($event)">
|
||||
<button ion-button item-end large icon-start (click)="testClick($event)">
|
||||
<ion-icon name="refresh"></ion-icon>
|
||||
Refresh
|
||||
</button>
|
||||
</a>
|
||||
|
||||
<ion-item>
|
||||
<button ion-button clear item-start small icon-left (click)="testClick($event)">
|
||||
<button ion-button clear item-start small icon-start (click)="testClick($event)">
|
||||
<ion-icon name="settings"></ion-icon>
|
||||
Settings
|
||||
</button>
|
||||
|
@ -44,7 +44,7 @@
|
||||
</ion-item>
|
||||
|
||||
<button ion-item color="dark">
|
||||
<button ion-button item-start icon-left>
|
||||
<button ion-button item-start icon-start>
|
||||
<ion-icon name="home"></ion-icon>
|
||||
Left Icon
|
||||
</button>
|
||||
@ -53,7 +53,7 @@
|
||||
</button>
|
||||
|
||||
<button ion-item disabled color="dark">
|
||||
<button ion-button item-start icon-left>
|
||||
<button ion-button item-start icon-start>
|
||||
<ion-icon name="home"></ion-icon>
|
||||
Left Icon
|
||||
</button>
|
||||
@ -62,12 +62,12 @@
|
||||
</button>
|
||||
|
||||
<ion-item color="light">
|
||||
<button ion-button item-start icon-right>
|
||||
<button ion-button item-start icon-end>
|
||||
Right Icon
|
||||
<ion-icon name="home"></ion-icon>
|
||||
</button>
|
||||
right icon buttons
|
||||
<button ion-button outline item-end icon-right>
|
||||
<button ion-button outline item-end icon-end>
|
||||
Right Icon
|
||||
<ion-icon name="star"></ion-icon>
|
||||
</button>
|
||||
|
@ -24,7 +24,7 @@
|
||||
<button ion-item (click)="clickedButton(item)">
|
||||
<h2>Sliding item {{item}}</h2>
|
||||
</button>
|
||||
<ion-item-options side="right" icon-left>
|
||||
<ion-item-options side="right" icon-start>
|
||||
<button ion-button color='danger'>
|
||||
<ion-icon name="trash"></ion-icon>
|
||||
Remove
|
||||
|
@ -139,13 +139,13 @@
|
||||
<h2>RIGHT/LEFT side - icons (item-start)</h2>
|
||||
<p>I think I figured out how to get more Mountain Dew</p>
|
||||
</ion-item>
|
||||
<ion-item-options side="left" icon-left (ionSwipe)="unread($event)" *ngIf="slidingEnabled">
|
||||
<ion-item-options side="left" icon-start (ionSwipe)="unread($event)" *ngIf="slidingEnabled">
|
||||
<button ion-button color="secondary" expandable (click)="unread(item3)">
|
||||
<ion-icon name="ios-checkmark"></ion-icon>Unread
|
||||
</button>
|
||||
</ion-item-options>
|
||||
|
||||
<ion-item-options icon-left (ionSwipe)="del(item3)">
|
||||
<ion-item-options icon-start (ionSwipe)="del(item3)">
|
||||
<button ion-button color="primary" (click)="archive(item3)">
|
||||
<ion-icon name="mail"></ion-icon>Archive
|
||||
</button>
|
||||
@ -161,7 +161,7 @@
|
||||
<ion-icon name="mail" item-start></ion-icon>
|
||||
One Line w/ Icon, div only text
|
||||
</ion-item>
|
||||
<ion-item-options icon-left (ionSwipe)="archive($event)">
|
||||
<ion-item-options icon-start (ionSwipe)="archive($event)">
|
||||
<button ion-button color="primary" (click)="archive(item4)" expandable *ngIf="slidingEnabled">
|
||||
<ion-icon name="archive"></ion-icon>Archive
|
||||
</button>
|
||||
@ -192,9 +192,9 @@
|
||||
|
||||
<ion-item-sliding #item7>
|
||||
<ion-item>
|
||||
One Line, dynamic icon-left option
|
||||
One Line, dynamic icon-start option
|
||||
</ion-item>
|
||||
<ion-item-options icon-left>
|
||||
<ion-item-options icon-start>
|
||||
<button ion-button color="primary">
|
||||
<ion-icon name="more"></ion-icon>
|
||||
{{ moreText }}
|
||||
|
@ -30,24 +30,24 @@
|
||||
</ion-list-header>
|
||||
|
||||
<ion-list-header disabled>
|
||||
<button ion-button icon-left item-start (click)="testClick($event)">
|
||||
<button ion-button icon-start item-start (click)="testClick($event)">
|
||||
<ion-icon name="home"></ion-icon>
|
||||
Left Icon
|
||||
</button>
|
||||
disabled left icon buttons
|
||||
<button ion-button icon-left outline item-end (click)="testClick($event)">
|
||||
<button ion-button icon-start outline item-end (click)="testClick($event)">
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Left Icon
|
||||
</button>
|
||||
</ion-list-header>
|
||||
|
||||
<ion-list-header color="dark">
|
||||
<button ion-button icon-right item-start (click)="testClick($event)">
|
||||
<button ion-button icon-end item-start (click)="testClick($event)">
|
||||
Right Icon
|
||||
<ion-icon name="home"></ion-icon>
|
||||
</button>
|
||||
Dark right icon buttons
|
||||
<button ion-button icon-right outline item-end (click)="testClick($event)">
|
||||
<button ion-button icon-end outline item-end (click)="testClick($event)">
|
||||
Right Icon
|
||||
<ion-icon name="star"></ion-icon>
|
||||
</button>
|
||||
@ -65,14 +65,14 @@
|
||||
|
||||
<ion-list-header>
|
||||
ion-list-header right icon/text button large
|
||||
<button ion-button item-end icon-left large (click)="testClick($event)">
|
||||
<button ion-button item-end icon-start large (click)="testClick($event)">
|
||||
<ion-icon name="refresh"></ion-icon>
|
||||
Refresh
|
||||
</button>
|
||||
</ion-list-header>
|
||||
|
||||
<ion-list-header>
|
||||
<button ion-button clear item-start icon-left small (click)="testClick($event)">
|
||||
<button ion-button clear item-start icon-start small (click)="testClick($event)">
|
||||
<ion-icon name="settings"></ion-icon>
|
||||
Settings
|
||||
</button>
|
||||
|
@ -31,7 +31,7 @@
|
||||
|
||||
<ion-toolbar>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right (click)="goToPage2()">
|
||||
<button ion-button icon-end (click)="goToPage2()">
|
||||
Navigate
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -7,7 +7,7 @@
|
||||
<ion-footer>
|
||||
<ion-toolbar>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right (click)="goToPage3()">
|
||||
<button ion-button icon-end (click)="goToPage3()">
|
||||
Navigate
|
||||
<ion-icon name="arrow-forward"></ion-icon>
|
||||
</button>
|
||||
|
@ -33,14 +33,14 @@
|
||||
|
||||
|
||||
<!-- Icons right of text -->
|
||||
<ion-tabs tabsLayout="icon-right" primary no-navbar>
|
||||
<ion-tabs tabsLayout="icon-end" primary no-navbar>
|
||||
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call"></ion-tab>
|
||||
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
||||
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings" tabBadge="1030" tabBadgeStyle="light"></ion-tab>
|
||||
</ion-tabs>
|
||||
|
||||
<!-- Icons left of text -->
|
||||
<ion-tabs tabsLayout="icon-left" no-navbar>
|
||||
<ion-tabs tabsLayout="icon-start" no-navbar>
|
||||
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call" tabBadge="32" tabBadgeStyle="danger"></ion-tab>
|
||||
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
||||
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings"></ion-tab>
|
||||
@ -62,7 +62,7 @@
|
||||
</ion-tabs>
|
||||
|
||||
<!-- Dynamic Badge -->
|
||||
<ion-tabs tabsLayout="icon-left" no-navbar>
|
||||
<ion-tabs tabsLayout="icon-start" no-navbar>
|
||||
<ion-tab [root]="root" tabTitle="Recents" tabIcon="call"></ion-tab>
|
||||
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
|
||||
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings" [tabBadge]="myBadge" tabBadgeStyle="primary"></ion-tab>
|
||||
|
@ -33,7 +33,7 @@
|
||||
|
||||
|
||||
<!-- Icons right of text -->
|
||||
<ion-tabs tabsLayout="icon-right" no-navbar selectedIndex="0" color="danger">
|
||||
<ion-tabs tabsLayout="icon-end" no-navbar selectedIndex="0" color="danger">
|
||||
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
|
||||
@ -41,7 +41,7 @@
|
||||
|
||||
|
||||
<!-- Icons left of text -->
|
||||
<ion-tabs tabsLayout="icon-left" no-navbar color="light">
|
||||
<ion-tabs tabsLayout="icon-start" no-navbar color="light">
|
||||
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
|
||||
|
@ -33,7 +33,7 @@
|
||||
|
||||
|
||||
<!-- Icons right of text -->
|
||||
<ion-tabs tabsLayout="icon-right" no-navbar selectedIndex="0">
|
||||
<ion-tabs tabsLayout="icon-end" no-navbar selectedIndex="0">
|
||||
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
|
||||
@ -41,7 +41,7 @@
|
||||
|
||||
|
||||
<!-- Icons left of text -->
|
||||
<ion-tabs tabsLayout="icon-left" no-navbar>
|
||||
<ion-tabs tabsLayout="icon-start" no-navbar>
|
||||
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
|
||||
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
|
||||
|
@ -63,14 +63,14 @@
|
||||
<button ion-button icon-only color="primary">
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</button>
|
||||
<button ion-button icon-left solid>
|
||||
<button ion-button icon-start solid>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
Solid
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-title>Secondary</ion-title>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right solid color="danger">
|
||||
<button ion-button icon-end solid color="danger">
|
||||
Help
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
</button>
|
||||
@ -82,14 +82,14 @@
|
||||
<button ion-button icon-only color="primary" class="activated">
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</button>
|
||||
<button ion-button icon-left solid class="activated">
|
||||
<button ion-button icon-start solid class="activated">
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
Solid
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-title>Secondary Activated</ion-title>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right solid color="danger" class="activated">
|
||||
<button ion-button icon-end solid color="danger" class="activated">
|
||||
Help
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
</button>
|
||||
@ -101,7 +101,7 @@
|
||||
<button ion-button icon-only outline>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</button>
|
||||
<button ion-button icon-left outline>
|
||||
<button ion-button icon-start outline>
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Star
|
||||
</button>
|
||||
@ -119,7 +119,7 @@
|
||||
<button ion-button outline icon-only class="activated">
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</button>
|
||||
<button ion-button outline icon-left class="activated">
|
||||
<button ion-button outline icon-start class="activated">
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Star
|
||||
</button>
|
||||
@ -134,13 +134,13 @@
|
||||
|
||||
<ion-toolbar color="danger">
|
||||
<ion-buttons start>
|
||||
<button ion-button icon-left>
|
||||
<button ion-button icon-start>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
Clear
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right>
|
||||
<button ion-button icon-end>
|
||||
Edit
|
||||
<ion-icon name="create"></ion-icon>
|
||||
</button>
|
||||
@ -162,13 +162,13 @@
|
||||
|
||||
<ion-toolbar color="light">
|
||||
<ion-buttons start>
|
||||
<button ion-button icon-left>
|
||||
<button ion-button icon-start>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
Clear
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right>
|
||||
<button ion-button icon-end>
|
||||
Edit
|
||||
<ion-icon name="create"></ion-icon>
|
||||
</button>
|
||||
|
@ -64,14 +64,14 @@
|
||||
<button ion-button icon-only solid>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</button>
|
||||
<button ion-button icon-left solid>
|
||||
<button ion-button icon-start solid>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
Solid
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-title>Solid</ion-title>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right solid color="secondary">
|
||||
<button ion-button icon-end solid color="secondary">
|
||||
Help
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
</button>
|
||||
@ -83,14 +83,14 @@
|
||||
<a ion-button icon-only solid class="activated">
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</a>
|
||||
<button ion-button icon-left solid class="activated">
|
||||
<button ion-button icon-start solid class="activated">
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
Solid
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-title>Solid Activated</ion-title>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-right solid color="secondary" class="activated">
|
||||
<button ion-button icon-end solid color="secondary" class="activated">
|
||||
Help
|
||||
<ion-icon name="help-circle"></ion-icon>
|
||||
</button>
|
||||
@ -102,7 +102,7 @@
|
||||
<button ion-button icon-only outline>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</button>
|
||||
<button ion-button icon-left outline>
|
||||
<button ion-button icon-start outline>
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Star
|
||||
</button>
|
||||
@ -120,7 +120,7 @@
|
||||
<button ion-button icon-only outline class="activated">
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
</button>
|
||||
<button ion-button icon-left outline class="activated">
|
||||
<button ion-button icon-start outline class="activated">
|
||||
<ion-icon name="star"></ion-icon>
|
||||
Star
|
||||
</button>
|
||||
@ -135,13 +135,13 @@
|
||||
|
||||
<ion-toolbar>
|
||||
<ion-buttons start>
|
||||
<button ion-button icon-left>
|
||||
<button ion-button icon-start>
|
||||
<ion-icon name="contact"></ion-icon>
|
||||
Clear
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-buttons end>
|
||||
<a ion-button icon-right href="#">
|
||||
<a ion-button icon-end href="#">
|
||||
Edit
|
||||
<ion-icon name="create"></ion-icon>
|
||||
</a>
|
||||
|
Reference in New Issue
Block a user