Estoy intentando crear una barra de navegación negra en reaccionar. Aquí está mi código hasta ahora:
import UploadIcon from "@mui/icons-material/Upload"; import CustomButton from "./CustomButton"; import AppBar from '@mui/material/AppBar'; import Toolbar from '@mui/material/Toolbar'; import {createMuiTheme} from '@material-ui/core/styles' const Header = () => { return ( <AppBar sx = {{color:'black'}} position="sticky"> <Toolbar variant="dense"> <CustomButton text='Upload' endIcon={<UploadIcon/>}/> </Toolbar> </AppBar> ) } export default Header;Las técnicas que he intentado hasta ahora para cambiar el color de mi barra de aplicaciones han sido soluciones propuestas aquí: https://smartdevpreneur.com/setting-material-ui-appbar-color-and-styling/#Method_1_Styling_AppBar_With_Classes
Todos los hilos anteriores que he visto en el desbordamiento de pila sobre esto tampoco me han ayudado. ¿Cómo cambio el color de mi barra de navegación?
Diseñar la barra de herramientas en lugar de diseñar la barra de aplicaciones funcionó. Aquí está mi código final
import UploadIcon from "@mui/icons-material/Upload"; import CustomButton from "./CustomButton"; import AppBar from '@mui/material/AppBar'; import Toolbar from '@mui/material/Toolbar'; import {createMuiTheme} from '@material-ui/core/styles' const Header = () => { return ( <AppBar position="sticky"> <Toolbar sx = {{background:'black',}} variant="dense"> <CustomButton text='Upload' endIcon={<UploadIcon/>}/> </Toolbar> </AppBar> ) } export default Header;