mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
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:
7
ionic/components/grid/test/alignment/index.ts
Normal file
7
ionic/components/grid/test/alignment/index.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import {App} from 'ionic/ionic';
|
||||
|
||||
|
||||
@App({
|
||||
templateUrl: 'main.html'
|
||||
})
|
||||
class E2EApp {}
|
||||
71
ionic/components/grid/test/alignment/main.html
Normal file
71
ionic/components/grid/test/alignment/main.html
Normal 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>
|
||||
Reference in New Issue
Block a user