Block which allows creation of individual panels of text separated by a border. Each individual panel can also act as a link.

None of these individual spotlights should contain too much content, and they should all be kept at a similar length, as otherwise, the different spotlights will have fluctuating heights.

This block is a container block, and you will need to create spotlight blocks within it in the Spotlights field. Information on both types of block can be found below.

Spotlight Container Block Fields

  • Spotlights - Where you can add each individual spotlight block

Spotlight Block Fields

  • Title - Heading that appears at the top of the spotlight.
  • Copy - The main text of the individual spotlight block. This should be kept at a similar length as the copy in the other spotlight blocks that are part of the same container.
  • Icon - The image that appears at the top right of the spotlight. This image is preferably smaller in size, and has an equal width and height.
  • Link URL - The place the spotlight links to. This makes the whole spotlight panel a clickable link, as opposed to adding a CTA.
    It is recommended that over a page, all spotlight blocks should use a link, or none of them should. As no CTA is added when there's a link, just a hover state for the panel itself, it can be frustrating for a user if they hover over one panel and it's a link, another identical panel is not.

Back To Component Library