Media with link

[dromo77]

The speaking prototype uses the Media pattern to display upcoming talks. The Media object, including the text and Calendar Date, link to individual event pages. The Media object should be updated to support and format links. Either that or we may need a new pattern.

Example

[gerardo-rodriguez]

I was first leaning toward trying to make this work with the Media object as-is but I'm now not sure that's the best approach.

I was setting up the CSS something like this following what is done for the Card component:

.o-media a::after {
  //   border-radius: size.$border-radius-medium;
  bottom: $_focus-overflow;
  content: '';
  left: $_focus-overflow;
  position: absolute;
  right: $_focus-overflow;
  top: $_focus-overflow;
  z-index: 1;
}

This might work okay but it makes me a bit nervous that you can pass anything into the Media object via the content block. What if there are multiple links? That seems like it would break my solution.

So now, I'm leaning toward making a new pattern that is a bit more pre-defined/controlled based on its intent.

Does anyone else have any thoughts?

[gerardo-rodriguez]

I'm going to move forward and create a new component.