Material-ui: ¿Cómo configuro el color del texto global?
Tengo un tema oscuro que actualmente muestra todo el texto de todos los componentes en negro sobre un fondo negro. El único que es blanco es el menú que se ha configurado mediante una anulación
He probado varias cosas diferentes como puede ver a continuación. No estoy seguro, pero los documentos hacen referencia a un texto de paleta, pero eso no parece funcionar.
¿Cómo configuro el color de fuente global?
import { createMuiTheme } from "material-ui/styles";
const dark = createMuiTheme({
shadows: ["none"],
type: 'dark',
typography: {
color: 'white',
},
palette: {
background: {
paper: '#000',
default: '#000',
},
text: {
default: '#fff',
},
textColor: '#fff',
primary: {
main: '#ff0000',
},
},
root: {
textDecoration: 'none',
},
overrides: {
MuiPaper: {
root: {
boxShadow: 'none',
},
},
MuiBackdrop: {
root: {
backgroundColor: 'rgba(255, 0, 0, 0.75)',
},
},
MuiAppBar: {
root: {
background: 'white',
boxShadow: 'none',
},
colorPrimary: {
backgroundColor: 'transparent'
}
},
MuiIconButton: {
root: {
marginLeft: -12,
marginRight: 20,
color: 'white',
}
}
}
});
export default dark;
- [x] He buscado las ediciones de este repositorio y creo que esto no es un duplicado.
Contexto
https://codesandbox.io/s/kk6zp8jw07
Tu entorno
| Tech | Versión |
| -------------- | --------- |
| Material-UI | 1.00beta.40 |
| Reaccionar | 16.3.0 |
| navegador | cromo |
| etc | |
afridley
Todos 6 comentarios
Todo está documentado aquí: https://material-ui-next.com/style/color/
lazee
en 10 abr. 2018
¿Cómo configuro el color de fuente global?
@afridley No hay un color de fuente global. La mayor parte del color que busca proviene de la parte de tipografía. Necesita leer la documentación más de cerca:
const theme = createMuiTheme({
- type: "dark",
palette: {
+ type: "dark",
},
});
oliviertassinari
en 10 abr. 2018
@oliviertassinari Ahh gracias por la rápida respuesta No puedo creer que me perdí eso. Estaba pensando en la nota sobre cómo
palette: {
+ type: "dark",
},
changes palette.text significaba que podría cambiar manualmente el color de fuente predeterminado con eso si supiera qué poner en él.
como cómo palette.background tiene papel y predeterminado en él. Pensé que tal vez palette.text puede tener valores similares. Pero no pude encontrar documentación sobre de dónde provienen el papel y los valores predeterminados para incluirlos en la paleta.
Así que me pregunto si hay documentación sobre estos valores porque parece que solo puedo encontrarla en los tickets de emisión.
palette.text
palette.divider
palette.background
palette.action
ex This works
palette: {
background: {
paper: '#000',
default: '#000',
},
},
But what values can I change in
palette: {
text: {
?: '#000',
?: '#000',
},
},
Basado en la documentación aquí https://material-ui-next.com/customization/themes/#type -light-dark-theme-
afridley
en 10 abr. 2018
@afridley Los valores que puede cambiar son primario, secundario, desactivado y sugerencia. Examinar los objetos de tema predeterminados puede ayudarlo a comprender qué se puede cambiar y cómo.
Aquí hay un enlace https://material-ui.com/customization/default-theme/
Sleazer
en 27 ago. 2018
))) Dedique un par de horas a intentar averiguarlo ...
palette: {
text: {
primary: "#ffffff",
secondary: "#00000"
}
}
color = "textPrimary"
color = "textSecondary"
¡Gracias, Sleazer!
777akot
en 3 may. 2019
La situación debería haber mejorado en v4. El componente CssBasline aplica theme.palette.text.primary al elemento body.
oliviertassinari
en 4 may. 2019
Temas relacionados
ericraffin
·
3Comentarios
revskill10
·
3Comentarios
reflog
·
3Comentarios
anthony-dandrea
·
3Comentarios
zabojad
·
3Comentarios
Comentario más útil
))) Dedique un par de horas a intentar averiguarlo ...
color = "textPrimary"
color = "textSecondary"
¡Gracias, Sleazer!