Can someone advice me how to get working Cards from Bootstrap or rather any Bootstrap component? I would like to render the cards as grid and fill them by data either from velocity or groovy, it doesn’t matter. As I understand Bootstrap is used by Flamingo skin which is in xwiki by default. However it seems it’s a little bit stripped. I don’t think it’s good idea to import whole css classes for example from CDN. At first time I tried to use Box macro instead of cards but I didn’t find way how to organize them in grid and not break the responsive design.
My mistaken assumption was that current Bootstrap is already in xwiki but as I found there is “only” version 3 that is quite old (2013). The main reason is that newer versions are not backward compatible and it means a lot of work to implement it.
It is possible to import external CSS like below, however it breaks Flamingo skin. In conclusion it’s probably better to learn how to use v3 for now and hope that newer version will be implemented at some time.
$xwiki.linkx.use("https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css", {'type': 'text/css', 'rel': 'stylesheet'})