Currently, I am encountering an issue with the snackbar in my Angular 9 project. Despite adding CSS styles to both the component.scss file and the global style.scss file, the action button on the snackbar displays the same background and text color. In an attempt to resolve this, I utilized the following code:
this._snackBar.open(`Chart has been copied to ${workspace.name}`, 'Check it out!',
{ duration: 5000, panelClass: "blue-snackbar"}).onAction().subscribe(() => {})
I have also experimented with this alternative approach:
panelClass: ['my-snack-bar', 'button-bar']}Furthermore, I incorporated the following styling rules into the styles.scss and component.scss files:
.my-snack-bar {
background-color: #E8EAF6;
color: red;
}
.button-bar {
background-color: pink;
color: blue;
}For reference, please see the example image here: https://i.sstatic.net/m6Qph.jpg
Despite these efforts, the issue persists. Any suggestions or assistance regarding this matter would be greatly appreciated.