J'ai créé une barre d'outils mat et ajouté des boutons de tapis à l'aide de la couleur de la police pour les boutons de tapis reste gris au lieu de blanc p> C'est ce qu'il est ressemble à
p> ceci est le composant.TS p> 
Voici le composant.html code p> export class HeaderComponent implements OnInit {
signedIn: boolean;
public path = '' ;
@Output() public sidenavToggle = new EventEmitter();
constructor( private amplifyService: AmplifyService,
private router: Router) {
this.amplifyService.authStateChange$
.subscribe(authState => {
this.signedIn = authState.state === 'signedIn';
});
this.path = router.url;
}
public onToggleSidenav = () => {
this.sidenavToggle.emit();
}
}
4 Réponses :
Essayez d'utiliser CSS pour la modifier:
.mat-button {
color: #FFF;
opacity: 1;
}
Il est probable que les propriétés CSS de votre bouton sont écrasées par la portée avec la classe S'il n'y a rien d'important En lui, vous voudrez peut-être supprimer entièrement la classe De plus, je remarque que certains de vos boutons sont stylés avec Sinon, votre barre d'outils devrait fonctionner simplement, comme indiqué dans ce Demo . .Label . .Label entièrement ou vérifier si la classe .Label contient des propriétés CSS (telles que couleur ) qui peuvent avoir écrasé les styles par défaut pour tapis . Accent couleur. Notez que pour ces boutons, les étiquettes de texte dans les boutons seront rouges, au lieu de blanc.
Je mets une couleur d'accent pour montrer que cela n'affecte pas mes touches de tapis. Je suppose que je peux essayer de faire le projet. Je ne peux pas obtenir le texte blanc même si le SB fonctionne.
Vous pouvez essayer ceci en ajoutant un fichier CSS.
/deep/ .mat-button {
color: #FFF;
opacity: 1;
}
Vous pouvez remplacer votre bouton de type mat avec la classe CSS .Label CSS. Changez votre CSS à ceci:
:host ::ng-deep .mat-button {
color: #FFF !important;
}
Est-il écrasé par le nom de classe
.Label ? Puis-je savoir ce qui est déclaré dans.Label ?