diff --git a/src/examples/dialog-elements/dialog-elements-example-dialog.html b/src/examples/dialog-elements/dialog-elements-example-dialog.html new file mode 100644 index 00000000000..5238b0eb6c1 --- /dev/null +++ b/src/examples/dialog-elements/dialog-elements-example-dialog.html @@ -0,0 +1,5 @@ +

Dialog with elements

+
This dialog showcases the title, close, content and actions elements.
+
+ +
diff --git a/src/examples/dialog-elements/dialog-elements-example.css b/src/examples/dialog-elements/dialog-elements-example.css new file mode 100644 index 00000000000..7432308753e --- /dev/null +++ b/src/examples/dialog-elements/dialog-elements-example.css @@ -0,0 +1 @@ +/** No CSS for this example */ diff --git a/src/examples/dialog-elements/dialog-elements-example.html b/src/examples/dialog-elements/dialog-elements-example.html new file mode 100644 index 00000000000..40637c4bd63 --- /dev/null +++ b/src/examples/dialog-elements/dialog-elements-example.html @@ -0,0 +1 @@ + diff --git a/src/examples/dialog-elements/dialog-elements-example.ts b/src/examples/dialog-elements/dialog-elements-example.ts new file mode 100644 index 00000000000..aba941a571b --- /dev/null +++ b/src/examples/dialog-elements/dialog-elements-example.ts @@ -0,0 +1,22 @@ +import {Component} from '@angular/core'; +import {MdDialog} from '@angular/material'; + + +@Component({ + selector: 'dialog-elements-example', + templateUrl: './dialog-elements-example.html', +}) +export class DialogElementsExample { + constructor(public dialog: MdDialog) { } + + openDialog() { + this.dialog.open(DialogElementsExampleDialog); + } +} + + +@Component({ + selector: 'dialog-elements-example-dialog', + templateUrl: './dialog-elements-example-dialog.html', +}) +export class DialogElementsExampleDialog { } diff --git a/src/examples/example-module.ts b/src/examples/example-module.ts index 548c8d00085..60293aeb56f 100644 --- a/src/examples/example-module.ts +++ b/src/examples/example-module.ts @@ -39,6 +39,10 @@ import { DialogResultExampleDialog, DialogResultExample } from './dialog-result/dialog-result-example'; +import { + DialogElementsExampleDialog, + DialogElementsExample +} from './dialog-elements/dialog-elements-example'; import {TooltipOverviewExample} from './tooltip-overview/tooltip-overview-example'; import {ButtonToggleOverviewExample} from './button-toggle-overview/button-toggle-overview-example'; import {GridListOverviewExample} from './grid-list-overview/grid-list-overview-example'; @@ -100,11 +104,17 @@ export const EXAMPLE_COMPONENTS = { selectorName: 'DialogOverviewExample, DialogOverviewExampleDialog', }, 'dialog-result': { - title: 'Dailog with a result', + title: 'Dialog with a result', component: DialogResultExample, additionalFiles: ['dialog-result-example-dialog.html'], selectorName: 'DialogResultExample, DialogResultExampleDialog', }, + 'dialog-elements': { + title: 'Dialog elements', + component: DialogElementsExample, + additionalFiles: ['dialog-elements-example-dialog.html'], + selectorName: 'DialogElementsExample, DialogElementsExampleDialog', + }, 'grid-list-dynamic': {title: 'Dynamic grid-list', component: GridListDynamicExample}, 'grid-list-overview': {title: 'Basic grid-list', component: GridListOverviewExample}, 'icon-overview': {title: 'Basic icons', component: IconOverviewExample}, @@ -173,6 +183,8 @@ export const EXAMPLE_LIST = [ DialogOverviewExampleDialog, DialogResultExample, DialogResultExampleDialog, + DialogElementsExample, + DialogElementsExampleDialog, GridListDynamicExample, GridListOverviewExample, IconOverviewExample,