<div class="product-card product-card--small-heading product-card--dynamic-height ">
<div class="product-card-inner">
<div class="product-card-content">
<div class="product-card-content-inner">
<header class="product-card-header">
<h3 id="product-card-sub-heading" class="heading heading--category product-card-subheading">Fast pris & fri strøm</h3>
<h2 id="product-card-heading" class="heading heading--secondary product-card-heading">Til dig der vil købe en fabriksny bil</h2>
</header>
<div class="product-card-body">
<p>Få rabat på dit Clever abonnement hos bilforhandleren. Vi samarbejder med de fleste bilmærker. Ved køb af ny bil får du:</p>
<ul>
<li>Gratis installation af ladeboks hjemme <strong>(spar 7.999 kr)</strong></li>
<li>Rabat på dit Clever abonnement de første 3 år (helt ned til <strong>0 kr</strong>)</span>
</ul>
</div>
<div class="product-card-components">
<a href="#" class="btn">Læs mere og bestil</a>
</div>
</div>
</div>
</div>
</div>
{% set productCardHeadingId = productCardId|default('product-card') ~ '-heading' %}
{% set productCardSubheadingId = productCardId|default('product-card') ~ '-sub-heading' %}
<div class="product-card{% if productCardModifiers is defined and productCardModifiers|length %} product-card--{{ productCardModifiers|join(' product-card--') }}{% endif %} {% if dynamicHeight is defined %} product-card--dynamic-height {% endif %}">
<div class="product-card-inner">
{% if productCardMedia %}
<div class="product-card-media">
{% include ('@' ~ productCardMedia.type) with productCardMedia.content|merge(
{ attributes: {
'data-object-fit': 'cover',
'data-object-position': 'center center',
} }
) only %}
</div>
{% endif %}
<div class="product-card-content">
<div class="product-card-content-inner">
{% if productCardHeading or productCardSubheading %}
<header class="product-card-header">
{% if productCardSubheading %}
<{{ subHeadingLevel|default('h3') }} id="{{productCardSubheadingId}}" class="heading heading--category product-card-subheading">{{ productCardSubheading }}</{{ subHeadingLevel|default('h3') }}>
{% endif %}
{% if productCardHeading %}
<{{ headingLevel|default('h2') }} id="{{productCardHeadingId}}" class="heading heading--secondary product-card-heading">{{ productCardHeading }}</{{ headingLevel|default('h2') }}>
{% endif %}
</header>
{% endif %}
{% if productCardBody %}
<div class="product-card-body">
{{ productCardBody }}
</div>
{% endif %}
{% set childComponentBlock = block('childComponents') %}
{% if childComponents or childComponentBlock|trim is not empty %}
<div class="product-card-components">
{% if childComponentBlock %}
{{ childComponentBlock|raw }}
{% endif %}
{% for component in childComponents %}
{% include '@' ~ component.type with component.content only %}
{% endfor %}
</div>
{% endif %}
</div>
</div>
</div>
</div>
{
"dynamicHeight": false,
"productCardModifiers": [
"small-heading"
],
"productCardHeading": "Til dig der vil købe en fabriksny bil",
"productCardSubheading": "Fast pris & fri strøm",
"productCardBody": "\n\t\t\t<p>Få rabat på dit Clever abonnement hos bilforhandleren. Vi samarbejder med de fleste bilmærker. Ved køb af ny bil får du:</p>\n\t\t\t<ul>\n\t\t\t\t<li>Gratis installation af ladeboks hjemme <strong>(spar 7.999 kr)</strong></li>\n\t\t\t\t<li>Rabat på dit Clever abonnement de første 3 år (helt ned til <strong>0 kr</strong>)</span>\n\t\t\t</ul>\n\t\t",
"childComponents": [
{
"type": "button",
"content": {
"modifiers": [],
"url": "#",
"text": "Læs mere og bestil"
}
}
]
}