2015-03-17 15 views
5

Ich möchte $mdThemingProvider universelle Konfiguration aller Schaltflächen auf meiner Website mit einer benutzerdefinierten Palette verwenden. Ich kann die Hintergrundfarbe der Schaltflächen manipulieren, indem ich A200 und A700 in der Palette konfiguriere. Ich möchte auch die Standardtextfarbe ändern. Ich habe mit contrastDefaultColor, contrastLightColors und contrastDarkColors gezündet, aber das beste, das ich tun konnte, ist, schwarzen oder weißen Text zu erhalten.Theme-Taste Text mit Angular Material Design

Die folgende snippit wird weiße Tasten mit dunkler Text erzeugen:

var lightGrey = $mdThemingProvider.extendPalette('grey', { 
    'A200': '#fefefe', // Element background color (default) 
    'A700': '#fefefe', // Element hover background color (default) 
    'contrastDefaultColor': 'dark', 
    'contrastLightColors': '600 700 800 900' 
}); 
$mdThemingProvider.definePalette('light-grey', lightGrey); 

$mdThemingProvider.theme('default') 
    // Accent palette controls buttons, links, etc 
    .accentPalette('light-grey'); 

Ändern contrastDefaultColor zu "Licht" bewirkt, dass der Text weiß drehen.

kann ich manuell erreichen den Effekt, den ich durch Überschreiben der erzeugten Sheet-Regeln will:

.md-button.md-default-theme.md-fab { 
    color: #bdc3c7; 
} 

... aber ich versuche, die Werkzeuge in der Bibliothek zu nutzen.

Antwort

1

Ich weiß nicht, warum Sie mit diesem Problem konfrontiert sind, aber mit A200 & A700 die Farbe, die Sie geben wollen, wird das Problem lösen. dies wie:

var lightGrey = $mdThemingProvider.extendPalette('grey', { 
    'A200': '#bdc3c7', // Element background color (default) 
    'A700': '#bdc3c7', // Element hover background color (default) 
    'contrastDefaultColor': 'dark', 
    'contrastLightColors': ['600', '700', '800', '900'] 
}); 

Hinweis: Versuchen Kontrast Palette in Array-Form zu geben.

Und wenn Sie etwas anderes Problem konfrontiert bitte aktualisieren oder Sie können diese link

+0

Wow beziehen. Diese Frage ist alt. Wir haben mit den Updates Schritt gehalten, aber für dieses Problem haben wir nur eine zusätzliche Klasse erstellt und seitdem nicht wieder besucht. Wenn ich einen Zyklus habe, werde ich es noch einmal geben und Sie wissen lassen. Sehr geschätzt. –

Verwandte Themen