Cards

If you’re familiar with Bootstrap 3, cards replace our old panels, wells, and thumbnails. Similar functionality to those components is available as modifier classes for cards.

<div>   
<b-card
title="Card Title"
img-src="https://picsum.photos/600/300/?image=25"
img-alt="Image"
img-top
tag="article"
style="max-width: 20rem;"
class="mb-2"
>
<b-card-text>Some quick example text to build on the card title and make up the bulk of the card's content.</b-card-text>
<b-button href="#" variant="primary">Go somewhere</b-button>
</b-card>
</div>

You can check some other layouts of cards below. For adding any of the below layout in the template, please check their relative code in the src -> views -> ui-elements-> Cards.vue folder.

Last Updated 4 years ago
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages