<div class="links-block">
<div class="links-block__title">
<h3 class="
title-m
title-m_color_light
">Descubre UCI</h3>
</div>
<div class="links-block__links">
<ul class="links-block__list">
<li class="links-block__item">
<a class="link
link_large
link_color_light
" href="#">
<span>Sobre nosotros</span>
</a>
</li>
<li class="links-block__item">
<a class="link
link_large
link_color_light
" href="#">
<span>Centro de ayuda</span>
</a>
</li>
<li class="links-block__item">
<a class="link
link_large
link_color_light
" href="#">
<span>Simulamos tu hipoteca</span>
</a>
</li>
</ul>
<ul class="links-block__list">
<li class="links-block__item">
<a class="link
link_large
link_color_light
" href="#">
<span>Trabaja con nosotros</span>
</a>
</li>
<li class="links-block__item">
<a class="link
link_large
link_color_light
" href="#">
<span>Políticas RSC</span>
</a>
</li>
<li class="links-block__item">
<a class="link
link_large
link_color_light
" href="#">
<span>Solicita tu hipoteca</span>
</a>
</li>
</ul>
</div>
</div>
<div class="links-block">
<div class="links-block__title">
{{> @title-m title}}
</div>
<div class="links-block__links">
<ul class="links-block__list">
{{#each link-first-col}}
<li class="links-block__item">
{{> @link this}}
</li>
{{/each}}
</ul>
<ul class="links-block__list">
{{#each link-second-col}}
<li class="links-block__item">
{{> @link this}}
</li>
{{/each}}
</ul>
</div>
</div>
{
"title": {
"text": "Descubre UCI",
"colorLight": true
},
"link-first-col": [
{
"href": "#",
"text": "Sobre nosotros",
"isLarge": true,
"isLight": true
},
{
"href": "#",
"text": "Centro de ayuda",
"isLarge": true,
"isLight": true
},
{
"href": "#",
"text": "Simulamos tu hipoteca",
"isLarge": true,
"isLight": true
}
],
"link-second-col": [
{
"href": "#",
"text": "Trabaja con nosotros",
"isLarge": true,
"isLight": true
},
{
"href": "#",
"text": "Políticas RSC",
"isLarge": true,
"isLight": true
},
{
"href": "#",
"text": "Solicita tu hipoteca",
"isLarge": true,
"isLight": true
}
]
}
.links-block {
&__title {
margin-bottom: 20px;
}
&__links {
display: flex;
}
&__list {
width: 50%;
&:first-child {
width: calc(56.5% - 20px);
margin-right: 20px;
@media (--viewport-ms-min) {
width: calc(50.5% - 20px);
}
@media (--viewport-sm-min) {
width: calc(54.5% - 20px);
}
}
&:last-child {
width: 43.5%;
@media (--viewport-ms-min) {
width: 49.5%;
}
@media (--viewport-sm-min) {
width: 45.5%;
}
}
}
&__item {
&:last-child {
.link {
padding-bottom: 0;
}
}
.link {
display: block;
padding-bottom: 20px;
@media (--viewport-sm-min) {
padding-bottom: 10px;
}
}
}
}
No notes defined.