fonteva-design-guide
Version:
## Dev, Build and Test
44 lines (42 loc) • 1.86 kB
HTML
<template>
<c-pfm-container>
<c-pfm-tile>
<template for:each={items} for:item="item">
<c-pfm-row padding="vertical:small" key={item.name}>
<c-pfm-column>
<c-pfm-text weight="bold" data-value="itemName" data-name={item.name}>
<strong>{item.name}</strong>
</c-pfm-text>
</c-pfm-column>
<c-pfm-column align="right" size="auto">
<c-pfm-currency
val={item.total}
currency-i-s-o-code={currencyIsoCode}
is-multi-currency-org="false"
data-name={item.name}
></c-pfm-currency>
</c-pfm-column>
</c-pfm-row>
</template>
</c-pfm-tile>
<c-pfm-tile type="rectangle" theme="blue-dark">
<c-pfm-row>
<c-pfm-column>
<c-pfm-text color="white" weight="bold" type="body" size="medium" data-name="total">
{totalLabel}
</c-pfm-text>
</c-pfm-column>
<c-pfm-column size="auto">
<c-pfm-text type="body" weight="bold" align="right" size="medium" color="white">
<c-pfm-currency
val={total}
currency-i-s-o-code={currencyIsoCode}
data-name="total"
is-multi-currency-org="false"
></c-pfm-currency>
</c-pfm-text>
</c-pfm-column>
</c-pfm-row>
</c-pfm-tile>
</c-pfm-container>
</template>