Skip to content

Commit

Permalink
feat: expose version object in releases (angular#4962)
Browse files Browse the repository at this point in the history
* In releases there will be a constant called `VERSION` that holds the current version of the installed package (material or cdk)
* This is similar as for every @angular package like core, forms, compiler.

Add accessibility demo page for grid list

.
  • Loading branch information
devversion authored and tinayuangao committed Jul 31, 2017
1 parent d29fb66 commit 2c4ee15
Show file tree
Hide file tree
Showing 6 changed files with 82 additions and 0 deletions.
2 changes: 2 additions & 0 deletions src/demo-app/a11y/a11y-module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import {ButtonAccessibilityDemo} from './button/button-a11y';
import {ButtonToggleAccessibilityDemo} from './button-toggle/button-toggle-a11y';
import {CheckboxAccessibilityDemo} from './checkbox/checkbox-a11y';
import {ChipsAccessibilityDemo} from './chips/chips-a11y';
import {GridListAccessibilityDemo} from './grid-list/grid-list-a11y';
import {RadioAccessibilityDemo} from './radio/radio-a11y';

@NgModule({
Expand Down Expand Up @@ -40,6 +41,7 @@ export class AccessibilityRoutingModule {}
ButtonToggleAccessibilityDemo,
CheckboxAccessibilityDemo,
ChipsAccessibilityDemo,
GridListAccessibilityDemo,
RadioAccessibilityDemo,
]
})
Expand Down
1 change: 1 addition & 0 deletions src/demo-app/a11y/a11y.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ export class AccessibilityDemo {
{name: 'Button toggle', route: 'button-toggle'},
{name: 'Checkbox', route: 'checkbox'},
{name: 'Chips', route: 'chips'},
{name: 'Grid list', route: 'grid-list'},
{name: 'Radio buttons', route: 'radio'},
];
}
42 changes: 42 additions & 0 deletions src/demo-app/a11y/grid-list/grid-list-a11y.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
<section>
<h2>Fixed-height grid list</h2>
<md-grid-list [cols]="fixedCols" [rowHeight]="fixedRowHeight">
<md-grid-tile *ngFor="let tile of tiles" [colspan]="tile.cols" [rowspan]="tile.rows"
[style.background]="tile.color">
{{tile.text}}
</md-grid-tile>
</md-grid-list>
</section>

<section>
<h2>Ratio-height grid list</h2>
<md-grid-list cols="2" [rowHeight]="ratio" gutterSize="4px">
<md-grid-tile *ngFor="let tile of tiles" [style.background]="'lightblue'">
{{tile.text}}
</md-grid-tile>
</md-grid-list>
</section>

<section>
<h2>Fit-height grid list</h2>
<md-grid-list cols="2" rowHeight="fit" [gutterSize]="ratioGutter"
[style.height]="fitListHeight">
<md-grid-tile *ngFor="let tile of tiles" [style.background]="'#F1EBBA'">
{{tile.text}}
</md-grid-tile>
</md-grid-list>
</section>

<section>
<h2>Grid list with header and footer</h2>
<md-grid-list cols="3" rowHeight="200px">
<md-grid-tile *ngFor="let dog of dogs">
<md-grid-tile-header>{{dog.name}}</md-grid-tile-header>
<img [alt]="dog.name" src="https://material.angularjs.org/material2_assets/ngconf/{{dog.name}}.png">
<md-grid-tile-footer>
<span md-line>Human: {{dog.human}}</span>
<md-icon>star_border</md-icon>
</md-grid-tile-footer>
</md-grid-tile>
</md-grid-list>
</section>
Empty file.
35 changes: 35 additions & 0 deletions src/demo-app/a11y/grid-list/grid-list-a11y.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import {Component} from '@angular/core';

interface Dog {
name: string;
human: string;
}
@Component({
moduleId: module.id,
selector: 'grid-list-a11y',
templateUrl: 'grid-list-a11y.html',
styleUrls: ['grid-list-a11y.css'],
})
export class GridListAccessibilityDemo {
dogs: Dog[] = [
{ name: 'Porter', human: 'Kara' },
{ name: 'Mal', human: 'Jeremy' },
{ name: 'Koby', human: 'Igor' },
{ name: 'Razzle', human: 'Ward' },
{ name: 'Molly', human: 'Rob' },
{ name: 'Husi', human: 'Matias' },
];

tiles = [
{text: 'One', cols: 3, rows: 1, color: 'lightblue'},
{text: 'Two', cols: 1, rows: 2, color: 'lightgreen'},
{text: 'Three', cols: 1, rows: 1, color: 'lightpink'},
{text: 'Four', cols: 2, rows: 1, color: '#DDBDF1'},
];

fixedCols = 4;
fixedRowHeight = 100;
ratioGutter = 1;
fitListHeight = '400px';
ratio = '4:1';
}
2 changes: 2 additions & 0 deletions src/demo-app/a11y/routes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import {ButtonAccessibilityDemo} from './button/button-a11y';
import {ButtonToggleAccessibilityDemo} from './button-toggle/button-toggle-a11y';
import {CheckboxAccessibilityDemo} from './checkbox/checkbox-a11y';
import {ChipsAccessibilityDemo} from './chips/chips-a11y';
import {GridListAccessibilityDemo} from './grid-list/grid-list-a11y';
import {RadioAccessibilityDemo} from './radio/radio-a11y';
import {AccessibilityHome} from './a11y';

Expand All @@ -12,5 +13,6 @@ export const ACCESSIBILITY_DEMO_ROUTES: Routes = [
{path: 'button-toggle', component: ButtonToggleAccessibilityDemo},
{path: 'checkbox', component: CheckboxAccessibilityDemo},
{path: 'chips', component: ChipsAccessibilityDemo},
{path: 'grid-list', component: GridListAccessibilityDemo},
{path: 'radio', component: RadioAccessibilityDemo},
];

0 comments on commit 2c4ee15

Please sign in to comment.