javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-23 14:01:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

test(e2e): update icon attributes to use rtl attributes (#11912)

Browse Source
This commit is contained in:
Amit Moryossef
2017-06-05 19:06:08 +03:00
committed by Brandy Carney
parent 6322134994
commit f5bbdcd32e
29 changed files with 93 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/button/test/block/pages/page-one/page-one.html
View File

@ -15,8 +15,8 @@
</p> </p>
<p> <p>
<a ion-button block href="#" icon-left><ion-icon name="help-circle"></ion-icon> a[ion-button][block] icon</a> <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-left><ion-icon name="help-circle"></ion-icon> button[ion-button][block] icon</button> <button ion-button block icon-start><ion-icon name="help-circle"></ion-icon> button[ion-button][block] icon</button>
</p> </p>
<p> <p>

4
src/components/button/test/full/pages/page-one/page-one.html
View File

@ -15,11 +15,11 @@
</p> </p>
<p> <p>
<a ion-button full href="#" icon-left> <a ion-button full href="#" icon-start>
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
a[ion-button][full] + icon a[ion-button][full] + icon
</a> </a>
<button ion-button full icon-left> <button ion-button full icon-start>
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
button[ion-button][full] + icon button[ion-button][full] + icon
</button> </button>

24
src/components/button/test/icons/pages/page-one/page-one.html
View File

@ -10,22 +10,22 @@
<ion-content padding> <ion-content padding>
<div> <div>
<button ion-button icon-left> <button ion-button icon-start>
<ion-icon name="home"></ion-icon> <ion-icon name="home"></ion-icon>
Left Icon Left Icon
</button> </button>
<a ion-button icon-left> <a ion-button icon-start>
<ion-icon name="home"></ion-icon> <ion-icon name="home"></ion-icon>
Left Icon Left Icon
</a> </a>
</div> </div>
<div> <div>
<button ion-button icon-right> <button ion-button icon-end>
Right Icon Right Icon
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
</button> </button>
<a ion-button icon-right> <a ion-button icon-end>
Right Icon Right Icon
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
</a> </a>
@ -41,22 +41,22 @@
</div> </div>
<div> <div>
<button ion-button large icon-left> <button ion-button large icon-start>
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
Left, Large Left, Large
</button> </button>
<a ion-button large icon-left> <a ion-button large icon-start>
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
Left, Large Left, Large
</a> </a>
</div> </div>
<div> <div>
<button ion-button large icon-right> <button ion-button large icon-end>
Right, Large Right, Large
<ion-icon name="settings"></ion-icon> <ion-icon name="settings"></ion-icon>
</button> </button>
<a ion-button large icon-right> <a ion-button large icon-end>
Right, Large Right, Large
<ion-icon name="settings"></ion-icon> <ion-icon name="settings"></ion-icon>
</a> </a>
@ -72,22 +72,22 @@
</div> </div>
<div> <div>
<button ion-button small icon-left> <button ion-button small icon-start>
<ion-icon name="checkmark"></ion-icon> <ion-icon name="checkmark"></ion-icon>
Left, Small Left, Small
</button> </button>
<a ion-button small icon-left> <a ion-button small icon-start>
<ion-icon name="checkmark"></ion-icon> <ion-icon name="checkmark"></ion-icon>
Left, Small Left, Small
</a> </a>
</div> </div>
<div> <div>
<button ion-button small icon-right> <button ion-button small icon-end>
Right, Small Right, Small
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>
<a ion-button small icon-right> <a ion-button small icon-end>
Right, Small Right, Small
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</a> </a>

14
src/components/card/test/advanced/pages/root-page/root-page.html
View File

@ -28,13 +28,13 @@
<ion-grid> <ion-grid>
<ion-row> <ion-row>
<ion-col no-padding> <ion-col no-padding>
<button ion-button icon-left clear small> <button ion-button icon-start clear small>
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
Star Star
</button> </button>
</ion-col> </ion-col>
<ion-col no-padding text-right> <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> <ion-icon name="share"></ion-icon>
Activated Activated
</button> </button>
@ -66,13 +66,13 @@
<ion-grid> <ion-grid>
<ion-row> <ion-row>
<ion-col no-padding> <ion-col no-padding>
<button ion-button icon-left clear small> <button ion-button icon-start clear small>
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
Favorite Favorite
</button> </button>
</ion-col> </ion-col>
<ion-col no-padding text-center> <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> <ion-icon name="musical-notes"></ion-icon>
Listen Listen
</button> </button>
@ -99,20 +99,20 @@
<ion-grid> <ion-grid>
<ion-row> <ion-row>
<ion-col no-padding> <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> <ion-icon name="star"></ion-icon>
Favorite Favorite
</button> </button>
</ion-col> </ion-col>
<ion-col no-padding text-center> <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> <ion-icon name="musical-notes"></ion-icon>
Listen Listen
</button> </button>
</ion-col> </ion-col>
<ion-col no-padding text-right> <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> <ion-icon name="share-alt"></ion-icon>
Share Share
</button> </button>

4
src/components/card/test/colors/pages/root-page/root-page.html
View File

@ -71,13 +71,13 @@
<ion-grid> <ion-grid>
<ion-row> <ion-row>
<ion-col no-padding> <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> <ion-icon name="star"></ion-icon>
Danger Danger
</button> </button>
</ion-col> </ion-col>
<ion-col no-padding text-right> <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> <ion-icon name="share"></ion-icon>
Dark Dark
</button> </button>

6
src/components/card/test/map/main.html
View File

@ -31,7 +31,7 @@
<ion-item> <ion-item>
<span item-start>18 min</span> <span item-start>18 min</span>
<span item-start>(2.6 mi)</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> <ion-icon name="navigate"></ion-icon>
Start Start
</button> </button>
@ -61,7 +61,7 @@
<ion-item> <ion-item>
<span item-start>3 hr</span> <span item-start>3 hr</span>
<span item-start>(4.8 mi)</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> <ion-icon name="navigate"></ion-icon>
Start Start
</button> </button>
@ -91,7 +91,7 @@
<ion-item> <ion-item>
<span item-start secondary>26 min</span> <span item-start secondary>26 min</span>
<span item-start>(8.1 mi)</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> <ion-icon name="navigate"></ion-icon>
Start Start
</button> </button>

12
src/components/card/test/social/main.html
View File

@ -26,11 +26,11 @@
</ion-card-content> </ion-card-content>
<ion-item> <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> <ion-icon name="thumbs-up"></ion-icon>
<div>12 Likes</div> <div>12 Likes</div>
</button> </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> <ion-icon name="text"></ion-icon>
<div>4 Comments</div> <div>4 Comments</div>
</button> </button>
@ -59,11 +59,11 @@
</ion-card-content> </ion-card-content>
<ion-item> <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> <ion-icon name="thumbs-up"></ion-icon>
<div>30 Likes</div> <div>30 Likes</div>
</button> </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> <ion-icon name="text"></ion-icon>
<div>64 Comments</div> <div>64 Comments</div>
</button> </button>
@ -91,11 +91,11 @@
</ion-card-content> </ion-card-content>
<ion-item> <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> <ion-icon name="thumbs-up"></ion-icon>
<div>46 Likes</div> <div>46 Likes</div>
</button> </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> <ion-icon name="text"></ion-icon>
<div>66 Comments</div> <div>66 Comments</div>
</button> </button>

2
src/components/content/test/basic/pages/page-five/page-five.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Page 4</ion-title> <ion-title>Page 4</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="tabsPage"> <button ion-button icon-end [navPush]="tabsPage">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/content/test/basic/pages/page-four/page-four.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Page 3</ion-title> <ion-title>Page 3</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="page4"> <button ion-button icon-end [navPush]="page4">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/content/test/basic/pages/page-one/page-one.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Main</ion-title> <ion-title>Main</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="page1"> <button ion-button icon-end [navPush]="page1">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/content/test/basic/pages/page-three/page-three.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Page 2</ion-title> <ion-title>Page 2</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="page3"> <button ion-button icon-end [navPush]="page3">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/content/test/fullscreen/pages/page-five/page-five.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Page 4</ion-title> <ion-title>Page 4</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="tabsPage"> <button ion-button icon-end [navPush]="tabsPage">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/content/test/fullscreen/pages/page-four/page-four.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Page 3</ion-title> <ion-title>Page 3</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="page4"> <button ion-button icon-end [navPush]="page4">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/content/test/fullscreen/pages/page-one/page-one.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Main</ion-title> <ion-title>Main</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="page1"> <button ion-button icon-end [navPush]="page1">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/content/test/fullscreen/pages/page-three/page-three.html
View File

@ -2,7 +2,7 @@
<ion-navbar style="opacity: 0.8"> <ion-navbar style="opacity: 0.8">
<ion-title>Page 2</ion-title> <ion-title>Page 2</ion-title>
<ion-buttons right> <ion-buttons right>
<button ion-button icon-right [navPush]="page3"> <button ion-button icon-end [navPush]="page3">
Next Next
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/icon/test/basic/main.html
View File

@ -119,7 +119,7 @@
</ion-list> </ion-list>
<p> <p>
<button ion-button icon-left (click)="updateIcon()"> <button ion-button icon-start (click)="updateIcon()">
<ion-icon [name]="btnIcon"></ion-icon> <ion-icon [name]="btnIcon"></ion-icon>
Update icon Update icon
</button> </button>

2
src/components/icon/test/basic/pages/root-page/root-page.html
View File

@ -119,7 +119,7 @@
</ion-list> </ion-list>
<p> <p>
<button ion-button icon-left (click)="updateIcon()"> <button ion-button icon-start (click)="updateIcon()">
<ion-icon [name]="btnIcon"></ion-icon> <ion-icon [name]="btnIcon"></ion-icon>
Update icon Update icon
</button> </button>

12
src/components/item/test/buttons/pages/root-page/root-page.html
View File

@ -40,24 +40,24 @@
</ion-item> </ion-item>
<button ion-item disabled> <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> <ion-icon name="home"></ion-icon>
Left Icon Left Icon
</button> </button>
disabled left icon buttons 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> <ion-icon name="star"></ion-icon>
Left Icon Left Icon
</button> </button>
</button> </button>
<ion-item> <ion-item>
<button ion-button item-start icon-right (click)="testClick($event)"> <button ion-button item-start icon-end (click)="testClick($event)">
Right Icon Right Icon
<ion-icon name="home"></ion-icon> <ion-icon name="home"></ion-icon>
</button> </button>
right icon buttons 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 Right Icon
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
</button> </button>
@ -75,14 +75,14 @@
<a ion-item disabled> <a ion-item disabled>
a ion-item disabled right icon/text button large 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> <ion-icon name="refresh"></ion-icon>
Refresh Refresh
</button> </button>
</a> </a>
<ion-item> <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> <ion-icon name="settings"></ion-icon>
Settings Settings
</button> </button>

8
src/components/item/test/colors/pages/root-page/root-page.html
View File

@ -44,7 +44,7 @@
</ion-item> </ion-item>
<button ion-item color="dark"> <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> <ion-icon name="home"></ion-icon>
Left Icon Left Icon
</button> </button>
@ -53,7 +53,7 @@
</button> </button>
<button ion-item disabled color="dark"> <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> <ion-icon name="home"></ion-icon>
Left Icon Left Icon
</button> </button>
@ -62,12 +62,12 @@
</button> </button>
<ion-item color="light"> <ion-item color="light">
<button ion-button item-start icon-right> <button ion-button item-start icon-end>
Right Icon Right Icon
<ion-icon name="home"></ion-icon> <ion-icon name="home"></ion-icon>
</button> </button>
right icon buttons right icon buttons
<button ion-button outline item-end icon-right> <button ion-button outline item-end icon-end>
Right Icon Right Icon
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
</button> </button>

2
src/components/item/test/reorder/pages/root-page/root-page.html
View File

@ -24,7 +24,7 @@
<button ion-item (click)="clickedButton(item)"> <button ion-item (click)="clickedButton(item)">
<h2>Sliding item {{item}}</h2> <h2>Sliding item {{item}}</h2>
</button> </button>
<ion-item-options side="right" icon-left> <ion-item-options side="right" icon-start>
<button ion-button color='danger'> <button ion-button color='danger'>
<ion-icon name="trash"></ion-icon> <ion-icon name="trash"></ion-icon>
Remove Remove

10
src/components/item/test/sliding/pages/root-page/root-page.html
View File

@ -139,13 +139,13 @@
<h2>RIGHT/LEFT side - icons (item-start)</h2> <h2>RIGHT/LEFT side - icons (item-start)</h2>
<p>I think I figured out how to get more Mountain Dew</p> <p>I think I figured out how to get more Mountain Dew</p>
</ion-item> </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)"> <button ion-button color="secondary" expandable (click)="unread(item3)">
<ion-icon name="ios-checkmark"></ion-icon>Unread <ion-icon name="ios-checkmark"></ion-icon>Unread
</button> </button>
</ion-item-options> </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)"> <button ion-button color="primary" (click)="archive(item3)">
<ion-icon name="mail"></ion-icon>Archive <ion-icon name="mail"></ion-icon>Archive
</button> </button>
@ -161,7 +161,7 @@
<ion-icon name="mail" item-start></ion-icon> <ion-icon name="mail" item-start></ion-icon>
One Line w/ Icon, div only text One Line w/ Icon, div only text
</ion-item> </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"> <button ion-button color="primary" (click)="archive(item4)" expandable *ngIf="slidingEnabled">
<ion-icon name="archive"></ion-icon>Archive <ion-icon name="archive"></ion-icon>Archive
</button> </button>
@ -192,9 +192,9 @@
<ion-item-sliding #item7> <ion-item-sliding #item7>
<ion-item> <ion-item>
One Line, dynamic icon-left option One Line, dynamic icon-start option
</ion-item> </ion-item>
<ion-item-options icon-left> <ion-item-options icon-start>
<button ion-button color="primary"> <button ion-button color="primary">
<ion-icon name="more"></ion-icon> <ion-icon name="more"></ion-icon>
{{ moreText }} {{ moreText }}

12
src/components/list/test/header-scenarios/pages/main/main.html
View File

@ -30,24 +30,24 @@
</ion-list-header> </ion-list-header>
<ion-list-header disabled> <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> <ion-icon name="home"></ion-icon>
Left Icon Left Icon
</button> </button>
disabled left icon buttons 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> <ion-icon name="star"></ion-icon>
Left Icon Left Icon
</button> </button>
</ion-list-header> </ion-list-header>
<ion-list-header color="dark"> <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 Right Icon
<ion-icon name="home"></ion-icon> <ion-icon name="home"></ion-icon>
</button> </button>
Dark right icon buttons 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 Right Icon
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
</button> </button>
@ -65,14 +65,14 @@
<ion-list-header> <ion-list-header>
ion-list-header right icon/text button large 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> <ion-icon name="refresh"></ion-icon>
Refresh Refresh
</button> </button>
</ion-list-header> </ion-list-header>
<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> <ion-icon name="settings"></ion-icon>
Settings Settings
</button> </button>

2
src/components/loading/test/basic/pages/page-one/page-one.html
View File

@ -31,7 +31,7 @@
<ion-toolbar> <ion-toolbar>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right (click)="goToPage2()"> <button ion-button icon-end (click)="goToPage2()">
Navigate Navigate
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

2
src/components/loading/test/basic/pages/page-two/page-two.html
View File

@ -7,7 +7,7 @@
<ion-footer> <ion-footer>
<ion-toolbar> <ion-toolbar>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right (click)="goToPage3()"> <button ion-button icon-end (click)="goToPage3()">
Navigate Navigate
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</button> </button>

6
src/components/tabs/test/badges/app/app.component.html
View File

@ -33,14 +33,14 @@
<!-- Icons right of text --> <!-- 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="Recents" tabIcon="call"></ion-tab>
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></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-tab [root]="root" tabTitle="Settings" tabIcon="settings" tabBadge="1030" tabBadgeStyle="light"></ion-tab>
</ion-tabs> </ion-tabs>
<!-- Icons left of text --> <!-- 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="Recents" tabIcon="call" tabBadge="32" tabBadgeStyle="danger"></ion-tab>
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab> <ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></ion-tab>
<ion-tab [root]="root" tabTitle="Settings" tabIcon="settings"></ion-tab> <ion-tab [root]="root" tabTitle="Settings" tabIcon="settings"></ion-tab>
@ -62,7 +62,7 @@
</ion-tabs> </ion-tabs>
<!-- Dynamic Badge --> <!-- 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="Recents" tabIcon="call"></ion-tab>
<ion-tab [root]="root" tabTitle="Favorites" tabIcon="heart"></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> <ion-tab [root]="root" tabTitle="Settings" tabIcon="settings" [tabBadge]="myBadge" tabBadgeStyle="primary"></ion-tab>

4
src/components/tabs/test/colors/app/app.component.html
View File

@ -33,7 +33,7 @@
<!-- Icons right of text --> <!-- 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="Recents" tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab> <ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab> <ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
@ -41,7 +41,7 @@
<!-- Icons left of text --> <!-- 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="Recents" tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab> <ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab> <ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>

4
src/components/tabs/test/tab-bar-scenarios/app/app.component.html
View File

@ -33,7 +33,7 @@
<!-- Icons right of text --> <!-- 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="Recents" tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab> <ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab> <ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
@ -41,7 +41,7 @@
<!-- Icons left of text --> <!-- 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="Recents" tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab> <ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab> <ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>

20
src/components/toolbar/test/colors/pages/root-page/root-page.html
View File

@ -63,14 +63,14 @@
<button ion-button icon-only color="primary"> <button ion-button icon-only color="primary">
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</button> </button>
<button ion-button icon-left solid> <button ion-button icon-start solid>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
Solid Solid
</button> </button>
</ion-buttons> </ion-buttons>
<ion-title>Secondary</ion-title> <ion-title>Secondary</ion-title>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right solid color="danger"> <button ion-button icon-end solid color="danger">
Help Help
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
</button> </button>
@ -82,14 +82,14 @@
<button ion-button icon-only color="primary" class="activated"> <button ion-button icon-only color="primary" class="activated">
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</button> </button>
<button ion-button icon-left solid class="activated"> <button ion-button icon-start solid class="activated">
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
Solid Solid
</button> </button>
</ion-buttons> </ion-buttons>
<ion-title>Secondary Activated</ion-title> <ion-title>Secondary Activated</ion-title>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right solid color="danger" class="activated"> <button ion-button icon-end solid color="danger" class="activated">
Help Help
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
</button> </button>
@ -101,7 +101,7 @@
<button ion-button icon-only outline> <button ion-button icon-only outline>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</button> </button>
<button ion-button icon-left outline> <button ion-button icon-start outline>
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
Star Star
</button> </button>
@ -119,7 +119,7 @@
<button ion-button outline icon-only class="activated"> <button ion-button outline icon-only class="activated">
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</button> </button>
<button ion-button outline icon-left class="activated"> <button ion-button outline icon-start class="activated">
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
Star Star
</button> </button>
@ -134,13 +134,13 @@
<ion-toolbar color="danger"> <ion-toolbar color="danger">
<ion-buttons start> <ion-buttons start>
<button ion-button icon-left> <button ion-button icon-start>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
Clear Clear
</button> </button>
</ion-buttons> </ion-buttons>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right> <button ion-button icon-end>
Edit Edit
<ion-icon name="create"></ion-icon> <ion-icon name="create"></ion-icon>
</button> </button>
@ -162,13 +162,13 @@
<ion-toolbar color="light"> <ion-toolbar color="light">
<ion-buttons start> <ion-buttons start>
<button ion-button icon-left> <button ion-button icon-start>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
Clear Clear
</button> </button>
</ion-buttons> </ion-buttons>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right> <button ion-button icon-end>
Edit Edit
<ion-icon name="create"></ion-icon> <ion-icon name="create"></ion-icon>
</button> </button>

16
src/components/toolbar/test/scenarios/pages/root-page/root-page.html
View File

@ -64,14 +64,14 @@
<button ion-button icon-only solid> <button ion-button icon-only solid>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</button> </button>
<button ion-button icon-left solid> <button ion-button icon-start solid>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
Solid Solid
</button> </button>
</ion-buttons> </ion-buttons>
<ion-title>Solid</ion-title> <ion-title>Solid</ion-title>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right solid color="secondary"> <button ion-button icon-end solid color="secondary">
Help Help
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
</button> </button>
@ -83,14 +83,14 @@
<a ion-button icon-only solid class="activated"> <a ion-button icon-only solid class="activated">
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</a> </a>
<button ion-button icon-left solid class="activated"> <button ion-button icon-start solid class="activated">
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
Solid Solid
</button> </button>
</ion-buttons> </ion-buttons>
<ion-title>Solid Activated</ion-title> <ion-title>Solid Activated</ion-title>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-right solid color="secondary" class="activated"> <button ion-button icon-end solid color="secondary" class="activated">
Help Help
<ion-icon name="help-circle"></ion-icon> <ion-icon name="help-circle"></ion-icon>
</button> </button>
@ -102,7 +102,7 @@
<button ion-button icon-only outline> <button ion-button icon-only outline>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</button> </button>
<button ion-button icon-left outline> <button ion-button icon-start outline>
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
Star Star
</button> </button>
@ -120,7 +120,7 @@
<button ion-button icon-only outline class="activated"> <button ion-button icon-only outline class="activated">
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
</button> </button>
<button ion-button icon-left outline class="activated"> <button ion-button icon-start outline class="activated">
<ion-icon name="star"></ion-icon> <ion-icon name="star"></ion-icon>
Star Star
</button> </button>
@ -135,13 +135,13 @@
<ion-toolbar> <ion-toolbar>
<ion-buttons start> <ion-buttons start>
<button ion-button icon-left> <button ion-button icon-start>
<ion-icon name="contact"></ion-icon> <ion-icon name="contact"></ion-icon>
Clear Clear
</button> </button>
</ion-buttons> </ion-buttons>
<ion-buttons end> <ion-buttons end>
<a ion-button icon-right href="#"> <a ion-button icon-end href="#">
Edit Edit
<ion-icon name="create"></ion-icon> <ion-icon name="create"></ion-icon>
</a> </a>