Comment définir la couleur des boutons à bascule
J'ai un groupe de boutons à bascule. Ils sont très légers et disparaissent en arrière-plan sur les pauvres des moniteurs avec un haut niveau de luminosité.
Comment apprendre à bien le style? Je préfère les affecter la accent ou primaire couleurs, la façon dont vous pouvez le faire régulièrement des boutons.
En mai cas, le primaire et les accents de couleurs sont sombres. Sorte qu'ils de texte doit être blanche (avec une certaine transparence). Régulièrement des boutons, il fonctionne automatiquement.
<div class="output-size">
<mat-button-toggle-group>
<mat-button-toggle value="letter">Letter</mat-button-toggle>
<mat-button-toggle value="legal">Legal</mat-button-toggle>
<mat-button-toggle value="a4">A4</mat-button-toggle>
<mat-button-toggle value="a5">A5</mat-button-toggle>
</mat-button-toggle-group>
</div>
OriginalL'auteur Codo | 2018-01-08
Vous devez vous connecter pour publier un commentaire.
matButtonToggle
ne prend pas en charge lacolor
propriété commematButton
.Vous pouvez utiliser les classes css
.mat-button-toggle
et.mat-button-toggle-checked
de style différents états.Avec le matériel de la thématisation vous pouvez extraire selon des palettes individuelles vous avez besoin à partir du thème et l'appliquer le fond par défaut de la couleur de contraste de la couleur du texte pour optimiser le contraste avec la lumière ou des couleurs foncées.
Ici est un Stackblitz avec votre
mat-button-toggle-group
exemple: Stackblitzangulaires-t1k1x6
Thématisation utilisé:
Documents: Thématisation Angulaire du Matériel d'application
@include mix-app-theme
doit être ajouté après@include angular-material-theme
si vous utilisez un thème personnalisé que je fais.Juste au cas où quelqu'un veux faire un complet de la thématisation dans
primary
couleur pour lemat-button-toggle
j'ai résumé (après quelques difficultés) stackoverflow.com/a/53846456/325868OriginalL'auteur Sashel Niles Gruber
La personnalisation de la présentation à l'aide de votre propre thème SASS, comme les autres expositions de la réponse, est une excellente solution à court terme et vous donne beaucoup de pouvoir au cours de la présentation. Idéalement, ce serait devenu une partie du thème de base de déclarations, de sorte que
<mat-button-toggle-group color="primary">
(peut-être aussi<mat-button-toggle color="primary">
) fonctionne sans étapes supplémentaires.Si vous voulez faire le plus simple à l'avenir, donner un pouce vers le haut pour ce problème.
OriginalL'auteur Coderer
Une solution de contournement peut être quelque chose comme:
OriginalL'auteur Sergiu Starciuc