Cards - Inverted cards can't have colors

[etshy]

Bug Report

Steps to reproduce

1. make inverted cards
2. make color card
3. border (box-shadow actually) are grey, not colored

Expected result

Card have colored box-shadow

Actual result

Card have grey box-shadow

Testcase

JsFiddle

Version

2.7.1

Another "problem", As you could see in the jsfiddle, with a footer, like a button, the box-shadow make a weird result (there is the grey box-shadow + colored border), it's even more visible with a colored button.

I think the card element shouldn't have box-shadow or border, and only the internal element (header/image/content/...) should have a border.
Like that the colored border of the button could be "good to see".

[lubber-de]

For now, I prepared #455 to support colors in inverted cards. Removing the box-shadow or a border overall would be a breaking change and i also do not totally agree with that 😉

[etshy]

I can understand that. I never was very fond of shadow or this kind of things so I don't really like box-shadow effect.

I just saw that butfor this rule : .ui.cards > .card > .buttons, .ui.card > .buttons, .ui.cards > .card > .button, .ui.card > .button in the jsfiddle, making the margin: -1px -1px instead of margin: 0 -1px make the bottom border of the card and the button overlaping. It fix a bit the "weird result" I talked about earlier.
https://jsfiddle.net/0sbn6gma/

[lubber-de]

@etshy I had to do some additional testing and came up with the fix in #457 which makes sure only the bottom margin gets adjusted to keep everything else as it is (also for button groups and non inverted variants)

[lubber-de]

Reopening because #455 has not been merged yet (only #457 was)