cargdev/angular
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(material): add early version of md-grid-list.

Browse Source 
Closes #1683
This commit is contained in:
Jeremy Elbourn
2015-05-04 15:57:46 -07:00
committed by Misko Hevery
parent 2cb066215a
commit 8ef183b593
4 changed files with 282 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
modules/examples/src/material/grid_list/demo_app.html
View File

@ -1,28 +1,40 @@
<style>@import "angular2_material/src/components/grid_list/grid-list.css";</style>
<style>
md-grid-tile {
background-color: lightblue;
}
md-grid-list {
min-height: 400px;
}
</style>
<div>
<h2>grid-list demo</h2>
<md-grid-list cols="5" gutter-size="2em">
<md-grid-list cols="4" row-height="50px" gutter-size="2em">
<md-grid-tile cols="5">
Tile #1
</md-grid-tile>
<md-grid-tile rowspan="1" colspan="2"> Tile #1 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="1"> Tile #2 </md-grid-tile>
<md-grid-tile rowspan="3" colspan="1"> Tile #3 </md-grid-tile>
<md-grid-tile rowspan="2" colspan="2"> Tile #4 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="3"> Tile #5 </md-grid-tile>
<md-grid-tile rowspan="2" colspan="2">
Tile #2
</md-grid-tile>
</md-grid-list>
<md-grid-tile [rowspan]="tile3RowSpan" [colspan]="tile3RowSpan">
Tile #3
</md-grid-tile>
<hr>
<md-grid-list cols="4" row-height="50px" gutter-size="2em">
<md-grid-tile rowspan="1" colspan="1"> Tile #1 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="1"> Tile #2 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="1"> Tile #3 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="1"> Tile #4 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="1"> Tile #5 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="1"> Tile #6 </md-grid-tile>
<md-grid-tile rowspan="1" colspan="1"> Tile #7 </md-grid-tile>
</md-grid-list>