Rails – Changing the attributes of the flash notice

Last Updated on November 30, 2019 by Christopher G Mendla

Some of the apps I do make a lot of use of the Rails flash notices. The default text attributes don’t make the notice stick out enough. I wanted to use a yellow background to highlight any notices. 

Using the Inspect tool in chrome, I found that the controlling CSS was in assets/scaffolds.scss. In my case it happened to be around line 39

Look for #notice.  The only attibute was color: green;. I changed that to add a yellow background color as follows

#notice {
 color: green;
 background-color: yellow;
}

Now the text is in green with a yellow highlight behind it.