-
Notifications
You must be signed in to change notification settings - Fork 5k
Description
First of all - thank you for great job you did. The dashboard looks really great, but after we got used to it, we bumped into major issues:
At first it seems that primary color is defined in material-dashboard-react.jsx with name primaryColor. That looked great, but:
- just below there is
primaryBoxShadowwhich uses hard-coded RGB values ofprimaryColor. - same thing with
primaryCardHeader- hardcoded RGB buttonStyle.jsx-buttonStyle.primaryuses hardcoded RGB for boxShadow.
Same applies for all colors.
It is practically a rewrite for someone willing to use different color palette and total mess is guaranteed when one would like to update package.
In my opinion best approach would be to use custom Material-ui theme as this is how they suggest to customize components. If that's not possible I suggest to use some color manipulation package, like https://www.npmjs.com/package/color:
const colorPrimary = Color('#ff9800');
const primaryBoxShadow = {
boxShadow:
`0 12px 20px -10px ${colorPrimary.alpha(0.28).rgb().string()}, 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px ${colorPrimary.alpha(0.2).rgb().string()}`
};
Sorry for criticism, but this is a main issue we decided to abandon further integration of this nice dashboard.