<metro-card header="@L["CardHeader"].Value" content="Card with header and footer. Card header is used to display card title and footer for some additional information or for custom actions." footer="Card footer" content-cls="p-2"></metro-card>   <metro-card header="@L["CardHeader"].Value" footer="@L["CardFooter"].Value" >     <metro-card-content class="p-2">         Card with header and footer. Card header is used to display card title and footer for some additional information or for custom actions.     </metro-card-content> </metro-card>   <metro-card header="@L["CardHeader"].Value" footer="@L["CardFooter"].Value" content-cls="p-2">     Card with header and footer. Card header is used to display card title and footer for some additional information or for custom actions. </metro-card>   <metro-card footer="Card footer" content-cls="p-2">     <metro-card-header>@L["CardHeader"].Value</metro-card-header>     Card with header and footer. Card header is used to display card title and footer for some additional information or for custom actions. </metro-card>

<metro-card header="@L["CardHeader"].Value" header-image="/images/image.jpg" header-cls="fg-white" footer="@L["CardFooter"].Value">     <metro-card-content class="p-2">         Card with header and footer. Card header is used to display card title and footer for some additional information or for custom actions.     </metro-card-content> </metro-card>   <metro-card footer="@L["CardFooter"].Value" content-cls="p-2">     <metro-card-header image="/images/image.jpg" class="fg-white">@L["CardHeader"].Value</metro-card-header>     Card with header and footer. Card header is used to display card title and footer for some additional information or for custom actions. </metro-card>