Action buttons inherit default :focus styling

[mortenson]

Action buttons, like those seen at /node/add or /admin/structure/types/manage/article/fields, have their red color hard-coded in CSS. It looks like some of the default button styling is not being overridden, because when focused the red action buttons are teal.

Instead of hard-coding colors in CSS, we should use add a color class like red on action buttons.

[briancwald]

Are you using dev? I think that was fixed recently in dev.

Nothing is hardcoded at all that I am aware of. it all uses variables defined in the settings and color schema.

this is where the action button colors are defined. This is where the action button is defined. Originally it only had the :hover defined, so it was inheriting the default .btn styling for :focus and :active. Now it should be fine.

[mortenson]

I was a few commits behind - I can confirm that this is fixed in dev.

By hard-coded I mean defined in SASS - it seems like with MaterializeCSS color classes are the way they want you to add colors to elements, not by targeting selectors, which is why I brought it up. Since this is fixed we can close this out if you want to keep the SASS the same.

[briancwald]

Yeah, I think in certain areas, like action buttons I am using the markup that Core provides so I cant do everything exactly how the framework wants without adding a bunch of extra markup or changing it, which I am trying to limit to avoid conflicts with newer versions of core or contrib modules. If you have a better idea of how to handle that, I am happy to reconfigure it, I just didn't think of anything easy.

[mortenson]

I think to really do this "right", we would have to find every instance where a class we could add with a preprocess or Twig is being added with @extend and change that. ex: for buttons: https://github.com/briancwald/material_admin/search?utf8=%E2%9C%93&q=extend+.btn&type=

This is a pretty big task so I think we can table it for now since my original bug report is fixed in dev.