Q) Can someone help me troubleshoot the custom component below to make it resemble a plus sign, inheriting styling from the <ion-buttons>
directive?
In my navbar, I've included a custom component:
<notifications-bell></notifications-bell>
, as shown:
<ion-navbar *navbar header-colour>
<button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-buttons end>
<notifications-bell></notifications-bell>
<button>
<ion-icon name="add"></ion-icon>
</button>
</ion-buttons>
<ion-title>Clients</ion-title>
</ion-navbar>
However, it is displaying with an unwanted background color:
https://i.sstatic.net/FIYdS.png
Below is the code for the problematic component:
import {Component} from 'angular2/core';
@Component({
selector: 'notifications-bell',
directives: [],
template: `<button><ion-icon name="notifications-outline"></ion-icon></button>`
})
export class NotificationsBellComponent {
constructor() {
}
}
Any assistance would be appreciated. Thank you.