<div class="statement-of-cost">
<ul class="statement-of-cost__list">
<li class="statement-of-cost__list-item">
<div class="statement-of-cost__title-container">
<div class="statement-of-cost__title">Subtotal</div>
</div>
<div class="statement-of-cost__price">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">2'259.90</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="statement-of-cost__list-item">
<div class="statement-of-cost__title-container">
<div class="statement-of-cost__title">Rabatt</div>
</div>
<div class="statement-of-cost__price">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">174.00</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="statement-of-cost__list-item">
<div class="statement-of-cost__title-container">
<div class="statement-of-cost__title">Lieferkosten</div>
</div>
<div class="statement-of-cost__price">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">9.00</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="statement-of-cost__list-item">
<div class="statement-of-cost__title-container">
<div class="statement-of-cost__title">Vorgezogene Recyclinggebühr</div>
<div class="statement-of-cost__tooltip">
<button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Lorem ipsum dolor sit amet">
<span class="visually-hidden">Information</span>
</button>
</div>
</div>
<div class="statement-of-cost__price">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">4.00</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="statement-of-cost__list-item">
<div class="statement-of-cost__title-container">
<div class="statement-of-cost__title">Transportzuschlag Gefahrengut</div>
<div class="statement-of-cost__tooltip">
<button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Lorem ipsum dolor sit amet">
<span class="visually-hidden">Information</span>
</button>
</div>
</div>
<div class="statement-of-cost__price">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">35.00</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="statement-of-cost__list-item">
<div class="statement-of-cost__title-container">
<div class="statement-of-cost__title">MwSt. (7.7%)</div>
</div>
<div class="statement-of-cost__price">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">59.00</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
{% include '@SharedComponents/modules/shared-account/components/statement-of-cost/statement-of-cost.twig' %}
{
"list": [
{
"title": "Subtotal",
"price": {
"variant": "small",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "2'259.90"
}
}
},
{
"title": "Rabatt",
"price": {
"variant": "small",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "174.00"
}
}
},
{
"title": "Lieferkosten",
"price": {
"variant": "small",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "9.00"
}
}
},
{
"title": "Vorgezogene Recyclinggebühr",
"tooltip": {
"variant": "small",
"title": "Information",
"content": "Lorem ipsum dolor sit amet"
},
"price": {
"variant": "small",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "4.00"
}
}
},
{
"title": "Transportzuschlag Gefahrengut",
"tooltip": {
"variant": "small",
"title": "Information",
"content": "Lorem ipsum dolor sit amet"
},
"price": {
"variant": "small",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "35.00"
}
}
},
{
"title": "MwSt. (7.7%)",
"price": {
"variant": "small",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "59.00"
}
}
}
]
}
import './statement-of-cost.scss';
@import "~shared/base";
@import "~cando-cx-components-library/components/modules/shared-account/components/statement-of-cost/statement-of-cost";
No notes defined.