feat(@clayui/css): Adds translucent buttons and badges

[pat270]

Edit: We need to follow this up with https://liferay.atlassian.net/browse/LPS-201347 and remove beta variants.

https://liferay.atlassian.net/browse/LPS-198003

This adds translucent buttons and badges. I decided to stick with .btn-translucent and .btn-translucent.btn-info, instead of something like .btn-translucent-info. I think it will be easier to implement on the JS side.

For the dark variants, I did something different and want some feedback whether it's a good idea. We keep the class names the same,.btn-translucent.btn-info, but qualify it with .clay-dark on the parent element or component. This will apply dark styles to everything inside. I noticed we are shifting to be more accommodating with user preferences maybe can provide the dark theme version similar to cadmin by adding .clay-dark to the parent.

[ethib137]

LGTM...

Regarding clay-dark, I think that's fine, we just need to make sure we are consistent in applying this in the future.

For the beta-btn and beta-badge. @pat270 can you create a follow up technical task to remove it from Clay once we've released this and applied it to the beta indicator in Portal?

[matuzalemsteles]

That's good I also like this idea, can we also add the translucent property to components or are we wanting to avoid that now?

[pat270]

@matuzalemsteles I'll add it to our components in this pull. I can also do what @ethib137 is requesting here.

[pat270]

@ethib137 I created https://liferay.atlassian.net/browse/LPS-201347 for removing beta styles.