search

elm-street-technology / elevate-ui

🎨 💻 📱An opinionated toolkit of React components and patterns
https://elevate-ui.com/
MIT License
10 stars 4 forks source link

Global Error Notification uses the theme's primary color instead of a constant red #246

Open doloczki opened 5 years ago

doloczki commented 5 years ago

It would be nice if the Error Notification would use a constant red color for it's border (just like the warning and success notifications which use yellow and green). In my application I had to change the primary color in the theme and it effected the notification's border color.

chrisheninger commented 5 years ago

👋 Hi Doloczki–

Excellent feedback– looking at the component I can see that we're using primary 800 for the error messaging on that component– https://github.com/elm-street-technology/elevate-ui/blob/master/src/GlobalNotification/Notification.js#L59

Checking out the color palette– it looks like we have a section for elevateRed (which happens to be the primary color for Elevate apps) that we could use for the error messaging. This will fix issues like you're running into where the primary colors might have been substituted and might not fit for the error messaging. https://www.elevate-ui.com/color-palette

If you'd like to submit a PR that updates the Notification component to use theme.colors.elevateRed["800"] instead of primary, I'm sure it would be an accepted change. 🙂