Cards

Instructions

This component has two props and a slot:

heading
body

The example below is constructed in the following way:

<x-bl.card heading='Heading looks like this' body='Text looks like this in a card. Vel illum qui dolorem eum fugiat quo voluptas nulla pariatur Nemo enim ipsam voluptatem quia voluptas sit aspernatur.'> <div class='bl-button-box'> <x-bl.button>Do this</x-bl.button> <x-bl.button>No, do this</x-bl.button> </div> </x-bl.card>

You'll want to wire up those buttons, but this serves as an example of how one could use this component.

Note: These can be entirely informational, i.e. they don't need buttons)

Heading looks like this

Text looks like this in a card. Vel illum qui dolorem eum fugiat quo voluptas nulla pariatur Nemo enim ipsam voluptatem quia voluptas sit aspernatur.