inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

expose icon color property (#4248)

Browse Source
This commit is contained in:
Denys Vuika
2019-02-04 10:53:12 +00:00
committed by GitHub
parent aa2036dddd
commit cf922dd46e
3 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/core/icon.component.md
View File

@@ -28,7 +28,8 @@ Provides a universal way of rendering registered and named icons.
| Name | Type | Default value | Description | | Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- | | ---- | ---- | ------------- | ----------- |
| value | `string` | | Icon value, which can be either a ligature name or a custom icon in the format `[namespace]:[name]`. | | value | `string` | | Icon value, which can be either a ligature name or a custom icon in the format `[namespace]:[name]`. |
| color | ThemePalette | |Theme color palette for the component. |
## Details ## Details

4
lib/core/icon/icon.component.html
View File

@@ -1,7 +1,7 @@
<ng-container *ngIf="isCustom; else: default"> <ng-container *ngIf="isCustom; else: default">
<mat-icon [svgIcon]="value"></mat-icon> <mat-icon [color]="color" [svgIcon]="value"></mat-icon>
</ng-container> </ng-container>
<ng-template #default> <ng-template #default>
<mat-icon>{{ value }}</mat-icon> <mat-icon [color]="color">{{ value }}</mat-icon>
</ng-template> </ng-template>

4
lib/core/icon/icon.component.ts
View File

@@ -22,6 +22,7 @@ import {
ChangeDetectionStrategy ChangeDetectionStrategy
} from '@angular/core'; } from '@angular/core';
import { ThumbnailService } from '../services/thumbnail.service'; import { ThumbnailService } from '../services/thumbnail.service';
import { ThemePalette } from '@angular/material';
@Component({ @Component({
selector: 'adf-icon', selector: 'adf-icon',
@@ -35,6 +36,9 @@ export class IconComponent {
private _value = ''; private _value = '';
private _isCustom = false; private _isCustom = false;
@Input()
color: ThemePalette;
get value(): string { get value(): string {
return this._value; return this._value;
} }