test(grid): added test case for using text alignment attributes in a grid

this will be used for the actions in a card references #279
This commit is contained in:
Brandy Carney
2016-01-05 16:36:19 -05:00
parent f2bb7fe8d5
commit b8597f8036
2 changed files with 78 additions and 0 deletions

View File

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

View File

@@ -0,0 +1,71 @@
<ion-toolbar><ion-title>Grid Alignment</ion-title></ion-toolbar>
<ion-content class="alignment-demo">
<ion-row>
<ion-col>
ion-col
</ion-col>
<ion-col text-right>
ion-col[text-right]
</ion-col>
</ion-row>
<ion-row text-center>
<ion-col>
ion-row[text-center]
</ion-col>
<ion-col>
ion-row[text-center]
</ion-col>
<ion-col>
ion-row[text-center]
</ion-col>
</ion-row>
<ion-row>
<ion-col text-left>
ion-col[text-left]
</ion-col>
<ion-col text-left>
ion-col[text-left]
</ion-col>
<ion-col text-right>
ion-col[text-right]
</ion-col>
<ion-col text-right>
ion-col[text-right]
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<button small>Button 1</button>
</ion-col>
<ion-col width-50 text-center>
<button small>Button 2</button>
<button small>Button 3</button>
</ion-col>
<ion-col text-right>
<button small>Button 4</button>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<button small>Button 1</button>
<button small>Button 2</button>
</ion-col>
<ion-col text-right>
<button small>Button 3</button>
<button small>Button 4</button>
</ion-col>
</ion-row>
</ion-content>
<style>
.alignment-demo ion-row {
border: 1px solid #ddd;
margin: 10px 0;
}
</style>