I'm using material ui for a react app. I'm also using material table. My nav bar just uses the default styling that material ui provides. This has been working fine. However when I add material table to the page, the nav bar goes from blue to white! I'm not sure how to resolve this. The code is below:
class ProfilePage extends React.Component {
render() {
const rows = [
{ title: "Time", field: "time" },
{ title: "Type", field: "type" },
{ title: "Feature", field: "feature" },
{ title: "Weight", field: "weight" }
];
const {Profile, error, match } = this.props;
const features = Profile;
const userId = `ID: ${match.params.userId}`;
if (error || Object.entries(tasteProfile).length === 0) {
toastr.error(error);
featureTable = <h2>Couldn't find profiles for that id</h2>;
}
return (
<div>
<NavBar />
<Typography id="userId" variant="h6" color="inherit">
{userId}
</Typography>
<Paper>
<div>
<MaterialTable
title="Profiles"
columns={rows}
data={features["features"]}
>
</MaterialTable>
</div>
</Paper>
</div>
);
}
}
Grateful for any help!