skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(button): accent color not set on fab buttons with build optimizer (#9376)

Browse Source 
When running an Angular application in production mode with the build optimizer and the Angular CLI, the code part, that sets the default color for round buttons, is removed accidentally.

This seems to be an issue, that's caused by the build optimizer: https://github.com/angular/devkit/issues/388.

Fixes #9360
This commit is contained in:
Paul Gschwendtner
2018-01-23 16:47:31 +01:00
committed by Jeremy Elbourn
parent 843061777d
commit b3f8a42321
2 changed files with 17 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/demo-app/button/button-demo.html
+9 -10
View File
@@ -2,17 +2,16 @@
<section>
<button mat-button>flat</button>
<button mat-raised-button>raised</button>
<button mat-fab>
<mat-icon>check</mat-icon>
</button>
<button mat-fab>Btn</button>
<a mat-fab routerLink=".">Link</a>
<button mat-fab><mat-icon>check</mat-icon></button>
<button mat-fab color="primary">Btn</button>
<a mat-fab color="warn" routerLink=".">Link</a>
<a mat-fab routerLink="."><mat-icon>check</mat-icon></a>
<button mat-mini-fab>
<mat-icon>check</mat-icon>
</button>
<button mat-mini-fab>Btn</button>
<a mat-mini-fab routerLink=".">Link</a>
<button mat-mini-fab><mat-icon>check</mat-icon></button>
<button mat-mini-fab color="primary">Btn</button>
<a mat-mini-fab color="warn" routerLink=".">Link</a>
<a mat-mini-fab routerLink="."><mat-icon>check</mat-icon></a>
</section>
<section>
src/lib/button/button.ts
+8 -20
View File
@@ -13,11 +13,7 @@ import {
Component,
Directive,
ElementRef,
forwardRef,
Inject,
OnDestroy,
Optional,
Self,
ViewEncapsulation,
} from '@angular/core';
import {
@@ -74,30 +70,17 @@ export class MatIconButtonCssMatStyler {}
selector: 'button[mat-fab], a[mat-fab]',
host: {'class': 'mat-fab'}
})
export class MatFab {
constructor(@Self() @Optional() @Inject(forwardRef(() => MatButton)) button: MatButton,
@Self() @Optional() @Inject(forwardRef(() => MatAnchor)) anchor: MatAnchor) {
// Set the default color palette for the mat-fab components.
(button || anchor).color = DEFAULT_ROUND_BUTTON_COLOR;
}
}
export class MatFab {}
/**
* Directive that targets mini-fab buttons and anchors. It's used to apply the `mat-` class
* to all mini-fab buttons and also is responsible for setting the default color palette.
* Directive whose purpose is to add the mat- CSS styling to this selector.
* @docs-private
*/
@Directive({
selector: 'button[mat-mini-fab], a[mat-mini-fab]',
host: {'class': 'mat-mini-fab'}
})
export class MatMiniFab {
constructor(@Self() @Optional() @Inject(forwardRef(() => MatButton)) button: MatButton,
@Self() @Optional() @Inject(forwardRef(() => MatAnchor)) anchor: MatAnchor) {
// Set the default color palette for the mat-mini-fab components.
(button || anchor).color = DEFAULT_ROUND_BUTTON_COLOR;
}
}
export class MatMiniFab {}
// Boilerplate for applying mixins to MatButton.
@@ -139,7 +122,12 @@ export class MatButton extends _MatButtonMixinBase
private _platform: Platform,
private _focusMonitor: FocusMonitor) {
super(elementRef);
this._focusMonitor.monitor(this._elementRef.nativeElement, true);
if (this._isRoundButton) {
this.color = DEFAULT_ROUND_BUTTON_COLOR;
}
}
ngOnDestroy() {