You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request
[ ] Other... Please describe:
Current behavior
<svg-icon> adds style="color: var(--svg-icon-color)" to the element, even if color is undefined. This forces us to write code like this which looks very ugly. Since the element has a color in the style property, this would then override css-classes that tried to change the color of the icon.
@Component({
selector: 'hpi-icon',
// Even if color is undefined, <svg-icon> would add style="color: var(--svg-icon-color)" to the element which defaulted to a white icon.
// This is a temporary fix until this is (hopefully) fixed
template: `
<svg-icon *ngIf="color" [key]="key" [fontSize]="fontSize" [color]="color"></svg-icon>
<svg-icon *ngIf="!color" [key]="key" [fontSize]="fontSize"></svg-icon>
`,
styles: [
`
svg-icon {
color: var(--color-grey-1100);
line-height: 1;
vertical-align: middle;
}
`
]
})
export class IconComponent {
@Input() key: SvgIcons;
@Input() color: string | undefined;
@Input() fontSize: string | undefined;
@Input() set size(size: IconSize) {
this.fontSize = iconSizes[size];
}
}
Expected behavior
if @Input color of <svg-icon> is undefined it should not add any color styling at all to the DOM element.
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Environment
Angular version: 14.1.1
"@ngneat/svg-icon": "^6.3.0",
Browser:
- [x ] Chrome (desktop) version XX
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
For Tooling issues:
- Node version: 16
- Platform: Mac
The text was updated successfully, but these errors were encountered:
dmattsson
changed the title
style="color.
style="color: var(--svg-icon-color)" added even if color == undefined
Mar 22, 2023
I'm submitting a...
Current behavior
<svg-icon>
addsstyle="color: var(--svg-icon-color)"
to the element, even ifcolor
isundefined
. This forces us to write code like this which looks very ugly. Since the element has a color in the style property, this would then override css-classes that tried to change the color of the icon.Expected behavior
if
@Input color
of<svg-icon>
is undefined it should not add any color styling at all to the DOM element.Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Environment
The text was updated successfully, but these errors were encountered: