Blueprint: Allow custom elevation for interactive mode in Card component

[shuyangli]

Feature request

Currently for the Card component, although we can customize the default elevation, we don't have an easy way to customize the elevation on hover. The current behavior has a couple drawbacks:

1. for our current use case, the elevation on hover (3) is too high
2. if the default elevation is 3, hover does nothing even when the card has interactive=true

[giladgray]

@shuyangli we chose not to support this because the whole thing is done elegantly in CSS using :hover and box-shadow variables. customizing the hover requires either awkward JS or a _ton_ more CSS.

[shuyangli]

Can we instead export the box-shadows variables for all elevations then? My current workaround is to override the :hover css, but the variable doesn't seem to be exported, which makes for sad copy-paste times

[giladgray]

@shuyangli i got your back https://github.com/palantir/blueprint/blob/develop/packages/core/src/common/_variables.scss#L74-L106

[shuyangli]

Oh sweet! That's exactly what I wanted. Do we want to add this to blueprint docs as well?

[giladgray]

@shuyangli https://blueprintjs.com/docs/#core/variables

[shuyangli]

Yeah, I don't see these specific ones on that page - I will submit a PR for it