<section class="splitter splitter_bg-color_white ">
<div class="container">
<div class="splitter__wrapper">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12">
<div class="lightbox-content-description-list">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12">
<div class="lightbox__title calculatorLightbox2">
<h2><span class="title-l
">Desglose de gastos</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></h2>
</div>
</div>
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6">
<div class="description-list">
<h3>
<div class="text-label-m">Gastos</div>
</h3> <!-- en los cambios propuestos en 05/2023 el átomo pasa de ser s a m -->
<dl>
<dt class="" id=""><span class="bodycopy-m">Notaría</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="" id=""><span class="bodycopy-m">1.151 €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
<dt class="" id=""><span class="bodycopy-m">Registro</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="" id=""><span class="bodycopy-m">574 €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
<dt class="" id=""><span class="bodycopy-m">Gestoría</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="" id=""><span class="bodycopy-m">391 €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
<dt class="" id=""><span class="bodycopy-m">Tasación</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="" id=""><span class="bodycopy-m">- €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
<dt class="total" id=""><span class="bodycopy-l">Total</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="total" id=""><span class="bodycopy-l">2.115 €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
</dl>
</div>
</div>
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6">
<div class="description-list">
<h3>
<div class="text-label-m">Impuestos</div>
</h3> <!-- en los cambios propuestos en 05/2023 el átomo pasa de ser s a m -->
<dl>
<dt class="" id=""><span class="bodycopy-m">Transmisiones</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="" id=""><span class="bodycopy-m">20.700 €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
<dt class="" id=""><span class="bodycopy-m">Otro impuesto</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="" id=""><span class="bodycopy-m">220 €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
<dt class="total" id=""><span class="bodycopy-l">Total</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dt>
<dd class="total" id=""><span class="bodycopy-l">20.900 €</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) --></dd>
</dl>
</div>
</div>
</div>
<div class="box-result">
<h3>
<div class="
text-label-s
"><span>Total de gastos e impuestos</span></div>
</h3>
<div class="text">
<h2 class="
title-l
">
<p>23.015 €</p>
</h2>
</div>
</div> <span class="bodycopy-xs">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut maximus vitae leo vel consequat. Aenean vitae libero accumsan, ultricies sem vitae, egestas nunc. In non neque nec odio venenatis eleifend ac ac quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi nec hendrerit ligula, sed efficitur tortor. Mauris bibendum quam ut nisl euismod imperdiet. Sed vehicula, quam id rutrum placerat, diam dolor tincidunt sem, non placerat risus ex nec nunc. Aliquam id arcu vel quam efficitur tempus. Integer nec interdum ligula. Ut interdum tellus eu tellus dapibus, quis aliquet risus sollicitudin.</p>
</span>
<!-- Las variantes por hs son exclusivamente para Fractal. No se migra a Storybook (CA.R.) -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
{{#extend '@splitter' splitter }}
{{#content 'content-first-column'}}
<div class="lightbox-content-description-list">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12">
<div class="lightbox__title calculatorLightbox2">
<h2>{{> @title title }}</h2>
</div>
</div>
<div class="col-xs-12 col-ms-12 col-sm-12 col-lg-12">
<div class="row">
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6">
{{> @description-list list1 }}
</div>
<div class="col-xs-12 col-ms-12 col-sm-6 col-lg-6">
{{> @description-list list2 }}
</div>
</div>
{{> @box-result result }}
{{> @bodycopy clarification }}
</div>
</div>
</div>
{{/content}}
{{/extend}}
{
"splitter": {
"oneColumn": true,
"bgColorWhite": true
},
"title": {
"text": "Desglose de gastos",
"type": "-l"
},
"list1": {
"titulo": {
"text": "Gastos"
},
"row": [
{
"item": {
"text": "Notaría",
"type": "-m"
},
"description": {
"text": "1.151 €",
"type": "-m"
}
},
{
"item": {
"text": "Registro",
"type": "-m"
},
"description": {
"text": "574 €",
"type": "-m"
}
},
{
"item": {
"text": "Gestoría",
"type": "-m"
},
"description": {
"text": "391 €",
"type": "-m"
}
},
{
"item": {
"text": "Tasación",
"type": "-m"
},
"description": {
"text": "- €",
"type": "-m"
}
},
{
"extra-classes-dt": "total",
"extra-classes-dd": "total",
"item": {
"text": "Total",
"strong": true,
"type": "-l"
},
"description": {
"text": "2.115 €",
"strong": true,
"type": "-l"
}
}
]
},
"list2": {
"titulo": {
"text": "Impuestos",
"type": "-m"
},
"row": [
{
"item": {
"text": "Transmisiones",
"type": "-m"
},
"description": {
"text": "20.700 €",
"type": "-m"
}
},
{
"item": {
"text": "Otro impuesto",
"type": "-m"
},
"description": {
"text": "220 €",
"type": "-m"
}
},
{
"extra-classes-dt": "total",
"extra-classes-dd": "total",
"item": {
"text": "Total",
"strong": true,
"type": "-l"
},
"description": {
"text": "20.900 €",
"strong": true,
"type": "-l"
}
}
]
},
"result": {
"titulo": {
"text": "Total de gastos e impuestos",
"strong": true,
"type": "-m"
},
"texto": {
"text": "<p>23.015 €</p>",
"strong": true,
"type": "-m"
}
},
"clarification": {
"type": "-xs",
"text": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut maximus vitae leo vel consequat. Aenean vitae libero accumsan, ultricies sem vitae, egestas nunc. In non neque nec odio venenatis eleifend ac ac quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi nec hendrerit ligula, sed efficitur tortor. Mauris bibendum quam ut nisl euismod imperdiet. Sed vehicula, quam id rutrum placerat, diam dolor tincidunt sem, non placerat risus ex nec nunc. Aliquam id arcu vel quam efficitur tempus. Integer nec interdum ligula. Ut interdum tellus eu tellus dapibus, quis aliquet risus sollicitudin.</p>"
}
}
.lightbox-content-description-list {
.description-list {
margin-top: 48px;
height: 100%;
display: flex;
flex-direction: column;
position: relative;
padding-bottom: 32px;
@media (--viewport-md-max) {
padding-bottom: 34px;
}
dl{
.total{
position: absolute;
bottom:0;
}
dd.total{
right:0;
}
}
}
.bodycopy-xs{
color: var(--color-text-subtle); margin-top: 48px;display: block;
}
}
No notes defined.