Vitrail
x
1
2
3
<div class="border border-slate-200 rounded px-4 py-2 bg-white shadow-sm !bg-red-100 !border-red-200 text-red-800" >
  Card with custom background
</div>

Card component comes with a default background color bg-white and border color border-slate-200.

If you want to override them, you must use the important modifier (!) in your CSS class.

1
render Vitrail::Card.new(class: "!bg-red-100 !border-red-200 text-red-800").with_content("Card with custom background")