Skip to content

Commit f1745d1

Browse files
andrewseguinandrewseguin
authored
Merge branch 'master' into overlay-scroll
2 parents 95652a6 + 792c7c2 commit f1745d1

File tree

13 files changed

+175
-12
lines changed

13 files changed

+175
-12
lines changed

‎package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,6 @@
3131
"@angular/forms": "^2.2.0",
3232
"@angular/http": "^2.2.0",
3333
"@angular/platform-browser": "^2.2.0",
34-
"@angular/platform-browser-dynamic": "^2.2.0",
35-
"@angular/router": "^3.2.0",
3634
"core-js": "^2.4.1",
3735
"hammerjs": "^2.0.8",
3836
"rxjs": "5.0.0-beta.12",
@@ -41,7 +39,9 @@
4139
},
4240
"devDependencies": {
4341
"@angular/compiler-cli": "^2.2.0",
42+
"@angular/platform-browser-dynamic": "^2.2.0",
4443
"@angular/platform-server": "^2.2.0",
44+
"@angular/router": "^3.2.0",
4545
"@types/glob": "^5.0.29",
4646
"@types/gulp": "^3.8.29",
4747
"@types/hammerjs": "^2.0.30",
@@ -52,10 +52,9 @@
5252
"@types/protractor": "^4.0.0",
5353
"@types/run-sequence": "0.0.27",
5454
"@types/rx": "^2.5.33",
55-
"@types/selenium-webdriver": "^2.53.36",
55+
"@types/selenium-webdriver": "2.53.36",
5656
"axe-core": "^2.0.7",
5757
"axe-webdriverjs": "^0.4.0",
58-
"@types/selenium-webdriver": "^2.53.36",
5958
"conventional-changelog": "^1.1.0",
6059
"dgeni": "^0.4.2",
6160
"dgeni-packages": "^0.16.2",
@@ -93,6 +92,7 @@
9392
"rollup": "^0.34.13",
9493
"run-sequence": "^1.2.2",
9594
"sass": "^0.5.0",
95+
"selenium-webdriver": "2.53.3",
9696
"strip-ansi": "^3.0.0",
9797
"stylelint": "^7.7.0",
9898
"symlink-or-copy": "^1.0.1",

‎src/lib/button-toggle/OVERVIEW.md

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
Button-toggles are on/off toggles with the appearance of a button. These toggles can be configured
2+
to behave as either radio-buttons or checkboxes. While they can be standalone, they are typically
3+
part of a `md-button-toggle-group`.
4+
5+
6+
<!-- example(button-toggle-overview) -->
7+
8+
### Exclusive selection vs. multiple selection
9+
By default, `md-button-toggle-group` acts like a radio-button group- only one item can be selected.
10+
In this mode, the `value` of the `md-button-toggle-group` will reflect the value of the selected
11+
button and `ngModel` is supported.
12+
13+
Adding the `multiple` attribute allows multiple items to be selected (checkbox behavior). In this
14+
mode the values of the the toggles are not used, the `md-button-toggle-group` does not have a value,
15+
and `ngModel` is not supported.
16+
17+
### Accessibility
18+
The button-toggles will present themselves as either checkboxes or radio-buttons based on the
19+
presence of the `multiple` attribute.
20+
21+
### Orientation
22+
The button-toggles can be rendered in a vertical orientation by adding the `vertical` attribute.

‎src/lib/button/OVERVIEW.md

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
Angular Material buttons are native `<button>` or `<a>` elements enhanced with Material Design
2+
styling and ink ripples.
3+
4+
<!-- example(button-overview) -->
5+
6+
Native `<button>` and `<a>` elements are always used in order to provide the most straightforward
7+
and accessible experience for users. A `<button>` element should be used whenever some _action_
8+
is performed. An `<a>` element should be used whenever the user will _navigate_ to another view.
9+
10+
11+
There are five button variants, each applied as an attribute:
12+
13+
| Attribute | Description |
14+
|--------------------|-----------------------------------------------------------------------------|
15+
| `md-button` | Rectangular button w/ no elevation. |
16+
| `md-raised-button` | Rectangular button w/ elevation |
17+
| `md-icon-button` | Circular button with a transparent background, meant to contain an icon |
18+
| `md-fab` | Circular button w/ elevation, defaults to theme's accent color |
19+
| `md-mini-fab` | Same as `md-fab` but smaller |
20+
21+
22+
### Theming
23+
Buttons can be colored in terms of the current theme using the `color` property to set the
24+
background color to `primary`, `accent`, or `warn`. By default, only FABs are colored; the default
25+
background color for `md-button` and `md-raised-button` matches the theme's background color.

‎src/lib/card/OVERVIEW.md

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
Cards are content containers for text, photos, and actions. Cards are intended to provide
2+
information on a single subject.
3+
4+
<!-- example(card-overview) -->
5+
6+
7+
### Basic card sections
8+
The most basic card needs only an `<md-card>` element with some content. However, Angular Material
9+
provides a number of preset sections that you can use inside of an `<md-card>`:
10+
11+
12+
| Element | Description |
13+
|-----------------------|--------------------------------------------------------------------------|
14+
| `<md-card-title>` | Card title |
15+
| `<md-card-subtitle>` | Card subtitle |
16+
| `<md-card-content>` | Primary card content. Intended for blocks of text |
17+
| `<img md-card-image>` | Card image. Stretches the image to the container width |
18+
| `<md-card-actions>` | Container for buttons at the bottom of the card |
19+
| `<md-card-footer>` | Section anchored to the bottom of the card |
20+
21+
These elements primary serve as pre-styled content containers without any additional APIs.
22+
However, the `align` property on `<md-card-actions>` can be used to position the actions at the
23+
`'start'` or `'end` of the container.
24+
25+
26+
### Card headers
27+
In addition to the aforementioned sections, `<md-card-header>` gives the ability to add a rich
28+
header to a card. This header can contain:
29+
30+
| Element | Description |
31+
|------------------------|-------------------------------------------------------------------------|
32+
| `<md-card-title>` | A title within the header |
33+
| `<md-card-subtitle>` | A subtitle within the header |
34+
| `<img md-card-avatar>` | An image used as an avatar within the header |
35+
36+
37+
### Title groups
38+
An `<md-title-group>` can be used to combine a title, subtitle, and image into a single section.
39+
This element can contain:
40+
* `<md-card-title>`
41+
* `<md-card-subtite>`
42+
* One of:
43+
* `<img md-card-sm-image>`
44+
* `<img md-card-md-image>`
45+
* `<img md-card-lg-image>`

‎src/lib/checkbox/OVERVIEW.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
`<md-checkbox>` provides the same functionality as a native `<input type="checkbox">`
2+
enhanced Material Design styling and animations.
3+
4+
<!-- example(checkbox-overview) -->
5+
6+
### Checkbox label
7+
The checkbox label is provided as the content to the `<md-checkbox>` element. The label can be
8+
positioned before or after the checkbox by setting the `labelPosition` property to `'before'` or
9+
`'after'`.
10+
11+
If you don't want the label to appear next to the checkbox, you can use
12+
[`aria-label`](https://www.w3.org/TR/wai-aria/states_and_properties#aria-label) or
13+
[`aria-labelledby`](https://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby) to
14+
specify an appropriate label.
15+
16+
### Use with `@angular/forms`
17+
`<md-checkobx>` is compatible with `@angular/forms` and supports both `FormsModule`
18+
and `ReactiveFormsModule`.
19+
20+
### Indeterminate state
21+
`<md-checkbox>` supports an `indeterminate` state, similar to the native `<input type="checkbox">`.
22+
While the `indeterminate` property of the checkbox is true, it will render as indeterminate
23+
regardless of the `checked` value. Any interaction with the checkbox by a user (i.e., clicking) will
24+
remove the indeterminate state.
25+
26+
### Theming
27+
The color of a `<md-checkbox>` can be changed by using the `color` property. By default, checkboxes
28+
use the theme's accent color. This can be changed to `'primary'` or `'warn'`.

‎src/lib/dialog/OVERVIEW.md

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
The `MdDialog` service can be used to open modal dialogs with Material Design styling and
2+
animations.
3+
4+
<!-- example(dialog-overview) -->
5+
6+
A dialog is opened by calling the `open` method with a component to be loaded and an optional
7+
config object. The `open` method will return an instance of `MdDialogRef`:
8+
9+
```ts
10+
let dialogRef = dialog.open(UserProfileComponent, {
11+
height: '400px',
12+
width: '600px',
13+
});
14+
```
15+
16+
The `MdDialogRef` provides a handle on the opened dialog. It can be used to close the dialog and to
17+
recieve notification when the dialog has been closed.
18+
```ts
19+
dialogRef.afterClosed.then(result => {
20+
console.log(`Dialog result: ${result}`); // Pizza!
21+
});
22+
23+
dialogRef.close('Pizza!');
24+
25+
```
26+
27+
Components created via `MdDialog` can _inject_ `MdDialogRef` and use it to close the dialog
28+
in which they are contained. When closing, an optional result value can be provided. This result
29+
value is forwarded as the result of the `afterClosed` promise.
30+
31+
### Dialog content
32+
Several directives are available to make it easier to structure your dialog content:
33+
34+
| Name | Description |
35+
|-----------------------|--------------------------------------------------------------------------|
36+
| `md-dialog-title` | \[Attr] Dialog title, applied to a heading element (e.g., `<h1>`, `<h2>`)|
37+
| `<md-dialog-content>` | Primary scrollable content of the dialog |
38+
| `<md-dialog-actions>` | Container for action buttons at the bottom of the dialog |
39+
| `md-dialog-close` | \[Attr] Added to a `<button>`, makes the button close the dialog on click|

‎src/lib/dialog/README.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ MdDialog is a service, which opens dialogs components in the view.
88
| ---- | ----------- |
99
| `open(component: ComponentType<T>, config: MdDialogConfig): MdDialogRef<T>` | Creates and opens a dialog matching material spec. |
1010
| `closeAll(): void` | Closes all of the dialogs that are currently open. |
11-
| `closeTop(): void` | Closes the topmost of the open dialogs. |
1211

1312
### Config
1413

‎src/lib/snack-bar/snack-bar-ref.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {MdSnackBarContainer} from './snack-bar-container';
55

66
// TODO(josephperrott): Implement onAction observable.
77

8-
8+
Observable.of([]);
99
/**
1010
* Reference to a snack bar dispatched from the snack bar service.
1111
*/

‎src/lib/system-config-spec.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,6 @@ System.config({
1818
'@angular/http/testing': 'vendor/@angular/http/bundles/http-testing.umd.js',
1919
'@angular/forms': 'vendor/@angular/forms/bundles/forms.umd.js',
2020
'@angular/forms/testing': 'vendor/@angular/forms/bundles/forms-testing.umd.js',
21-
'@angular/router': 'vendor/@angular/router/bundles/router.umd.js',
22-
'@angular/router/testing': 'vendor/@angular/router/bundles/router-testing.umd.js',
2321
'@angular/platform-browser': 'vendor/@angular/platform-browser/bundles/platform-browser.umd.js',
2422
'@angular/platform-browser/testing':
2523
'vendor/@angular/platform-browser/bundles/platform-browser-testing.umd.js',

‎src/lib/tooltip/tooltip.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ import {Dir} from '../core/rtl/dir';
3232
import {ScrollDispatcher} from '../core/overlay/scroll/scroll-dispatcher';
3333
import {OverlayPositionBuilder} from '../core/overlay/position/overlay-position-builder';
3434
import {ViewportRuler} from '../core/overlay/position/viewport-ruler';
35+
import 'rxjs/add/operator/first';
3536

3637
export type TooltipPosition = 'left' | 'right' | 'above' | 'below' | 'before' | 'after';
3738

‎test/browser-providers.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export const customLaunchers: { [name: string]: BrowserLauncherInfo } = {
6363
'SL_CHROME': {
6464
base: 'SauceLabs',
6565
browserName: 'chrome',
66-
version: '46'
66+
version: 'latest'
6767
},
6868
'SL_CHROMEBETA': {
6969
base: 'SauceLabs',
@@ -78,7 +78,7 @@ export const customLaunchers: { [name: string]: BrowserLauncherInfo } = {
7878
'SL_FIREFOX': {
7979
base: 'SauceLabs',
8080
browserName: 'firefox',
81-
version: '42'
81+
version: 'latest'
8282
},
8383
'SL_FIREFOXBETA': {
8484
base: 'SauceLabs',

‎test/protractor.conf.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,11 @@ if (process.env['TRAVIS']) {
4343
'browserName': 'chrome',
4444
'tunnel-identifier': process.env['TRAVIS_JOB_NUMBER'],
4545
'build': process.env['TRAVIS_JOB_NUMBER'],
46-
'name': 'Material 2 E2E Tests'
46+
'name': 'Material 2 E2E Tests',
47+
48+
// By default Saucelabs tries to record the whole e2e run. This can slow down the builds.
49+
'recordVideo': false,
50+
'recordScreenshots': false
4751
};
4852
}
4953

‎tools/gulp/constants.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,9 @@ export const SASS_AUTOPREFIXER_OPTIONS = {
1717

1818
export const HTML_MINIFIER_OPTIONS = {
1919
collapseWhitespace: true,
20-
removeComments: true
20+
removeComments: true,
21+
caseSensitive: true,
22+
removeAttributeQuotes: false
2123
};
2224

2325
export const NPM_VENDOR_FILES = [

0 commit comments

Comments
 (0)