<section class=" rtds-pb-8 md:rtds-pb-12">
<div class="rtds-container rtds-space-y-4 md:rtds-space-y-6">
<div class="rtds-grid rtds-grid-cols-1 lg:rtds-grid-cols-12 rtds-gap-4 md:rtds-gap-6 lg:rtds-gap-8 xl:rtds-gap-16">
<div class="rtds-space-y-4 md:rtds-space-y-6 rtds-col-span-12 lg:rtds-col-span-5">
<h2 class="rtds-heading-2">Lorem ipsum dolor sit amet</h2>
<div class="rtds-body">
<p>Nella programmazione 2021-2027 la Toscana ha a disposizione con il programma del Fondo europeo di sviluppo regionale 1,2 miliardi e con il programma del Fondo sociale europeo plus 1,1 miliardi, un totale di 2,3 miliardi di euro. Per la pesca e l'acquacoltura il programma Feampa 2021-2027 Toscana ha una dotazione complessiva (quota UE, quota dello Stato, quota della Regione), di 22.684.066 milioni. Per l'agricoltura e lo sviluppo rurale, il Complemento per lo sviluppo rurale 2023-2027 mette a disposizione della Toscana 748.813.503 milioni di euro.</p>
</div>
</div>
<div class="rtds-col-span-12 lg:rtds-col-span-7">
<div class="rtds-space-y-4">
<div class="rtds-px-2 rtds-py-4 rtds-border-b rtds-border-gray-02">
<h2 class="rtds-heading-4 rtds-content-primary">I servizi per { questo argomento }</h2>
</div>
<div class="rtds-flex rtds-gap-4 md:rtds-gap-6 lg:rtds-gap-8 rtds-flex-wrap">
<ul role="list" class="rtds-flex rtds-flex-wrap rtds-gap-4 md:rtds-gap-6 lg:rtds-gap-8">
<li class="rtds-content-02 rtds-font-bold rtds-flex rtds-items-center rtds-gap-2 rtds-text-sm lg:rtds-text-base">
<svg class="rtds-icon rtds-fill-current rtds-w-4 rtds-h-4 md:rtds-w-5 md:rtds-h-5 lg:rtds-w-6 lg:rtds-h-6" aria-hidden="true" focusable="false" role="img">
<use href="../../icons.svg#outline--cog-6-tooth" />
</svg>
3 servizi disponibili
</li>
<li class="rtds-content-02 rtds-font-bold rtds-flex rtds-items-center rtds-gap-2 rtds-text-sm lg:rtds-text-base">
<svg class="rtds-icon rtds-fill-current rtds-w-4 rtds-h-4 md:rtds-w-5 md:rtds-h-5 lg:rtds-w-6 lg:rtds-h-6" aria-hidden="true" focusable="false" role="img">
<use href="../../icons.svg#outline--computer-desktop" />
</svg>
3 servizi disponibili
</li>
<li class="rtds-content-02 rtds-font-bold rtds-flex rtds-items-center rtds-gap-2 rtds-text-sm lg:rtds-text-base">
<svg class="rtds-icon rtds-fill-current rtds-w-4 rtds-h-4 md:rtds-w-5 md:rtds-h-5 lg:rtds-w-6 lg:rtds-h-6" aria-hidden="true" focusable="false" role="img">
<use href="../../icons.svg#outline--hands-shaking" />
</svg>
3 servizi disponibili
</li>
</ul>
<div class="lg:rtds-ml-auto">
<div class="rtds-input-field rtds-select-field rtds-field-inline rtds-select-field--sm">
<label for="selectId" class="rtds-input-field__label">
Rivolto a:
</label>
<div class="rtds-select rtds-select--light">
<select id="selectId" class="">
<option value="1">Text</option>
<option value="2">Option 1</option>
<option value="3">Option 2</option>
<option value="4">Option 3</option>
<option value="5">Option 4</option>
<option value="6">Option 5</option>
</select>
</div>
</div>
</div>
</div>
<div class="rtds-servizi-list">
<div class="rtds-grid rtds-gap-4 md:rtds-gap-5 rtds-grid-cols-1 md:rtds-grid-cols-3 lg:rtds-grid-cols-3">
<!-- Grid item wrapper -->
<div class="rtds-col">
<article class="rtds-card rtds-card--information rtds-bg-gradient-04
is-card-fullclickable rtds-group/card">
<div class="rtds-card__content">
<div class="rtds-card__heading">
<h3 class="rtds-card__title">
<a class="group-hover/card:rtds-underline" href="">
Nunc aliquam phasellus molestie blandit. Nisi, amet, id maecenas diam
</a>
</h3>
</div>
<div class="rtds-card__description ">
<p>
Neque blandit pellentesque nunc sed amet. Nisl, semper sed aliquam amet proin purus augue et.
</p>
</div>
<ul class="rtds-card__tags" aria-label="Categorie">
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
</ul>
</div>
</article>
</div>
<!-- Grid item wrapper -->
<div class="rtds-col">
<article class="rtds-card rtds-card--information rtds-bg-gradient-04
is-card-fullclickable rtds-group/card">
<div class="rtds-card__content">
<div class="rtds-card__heading">
<h3 class="rtds-card__title">
<a class="group-hover/card:rtds-underline" href="">
Nunc aliquam phasellus molestie blandit. Nisi, amet, id maecenas diam
</a>
</h3>
</div>
<div class="rtds-card__description ">
<p>
Neque blandit pellentesque nunc sed amet. Nisl, semper sed aliquam amet proin purus augue et.
</p>
</div>
<ul class="rtds-card__tags" aria-label="Categorie">
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
</ul>
</div>
</article>
</div>
<!-- Grid item wrapper -->
<div class="rtds-col">
<article class="rtds-card rtds-card--information rtds-bg-gradient-04
is-card-fullclickable rtds-group/card">
<div class="rtds-card__content">
<div class="rtds-card__heading">
<h3 class="rtds-card__title">
<a class="group-hover/card:rtds-underline" href="">
Nunc aliquam phasellus molestie blandit. Nisi, amet, id maecenas diam
</a>
</h3>
</div>
<div class="rtds-card__description ">
<p>
Neque blandit pellentesque nunc sed amet. Nisl, semper sed aliquam amet proin purus augue et.
</p>
</div>
<ul class="rtds-card__tags" aria-label="Categorie">
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
<li><span class="rtds-chip rtds-chip--category rtds-chip--sm">
label</span></li>
</ul>
</div>
</article>
</div>
</div>
<div class="rtds-flex rtds-justify-center rtds-py-8">
<a href="#" class="rtds-btn
rtds-btn--icon-right rtds-group/button rtds-btn--secondary rtds-btn--s">
vedi tutti i servizi
<svg class="rtds-icon rtds-fill-current rtds-w-4 rtds-h-4 rtds-transition-all rtds-duration-200 rtds-ease-out rtds-transform group-hover/button:rtds-translate-x-1" aria-hidden="true" focusable="false" role="img">
<use href="../../icons.svg#mini--chevron-right" />
</svg>
</a>
</div>
</div>
</div>
</div>
</div>
<div>
<h2 class="rtds-sr-only">Contenuti utili</h2>
<ul role="list" class="rtds-grid rtds-grid-cols-1 md:rtds-grid-cols-2 lg:rtds-grid-cols-3 rtds-gap-4">
<li class="rtds-col">
<article class="rtds-card rtds-card--news rtds-card--news-small rtds-card--news-no-thumb is-card-fullclickable rtds-group/card">
<div class="rtds-card__content">
<div class="rtds-card__heading">
<h3 class="rtds-card__title">
<a class="group-hover/card:rtds-underline" href="">
Nunc aliquam phasellus molestie blandit. Nisi, amet, id maecenas diam
</a>
</h3>
<div class="rtds-card__metadata">
</div>
</div>
<div class="rtds-card__description ">
<p>
Neque blandit pellentesque nunc sed amet. Nisl, semper sed aliquam amet proin purus augue et.
</p>
</div>
<div class="rtds-card__categories">
<a href="#" class="rtds-category rtds-category--sm">
Categoria
</a>
</div>
</div>
</article>
</li>
<li class="rtds-col">
<article class="rtds-card rtds-card--news rtds-card--news-small rtds-card--news-no-thumb is-card-fullclickable rtds-group/card">
<div class="rtds-card__content">
<div class="rtds-card__heading">
<h3 class="rtds-card__title">
<a class="group-hover/card:rtds-underline" href="">
Nunc aliquam phasellus molestie blandit. Nisi, amet, id maecenas diam
</a>
</h3>
<div class="rtds-card__metadata">
</div>
</div>
<div class="rtds-card__description ">
<p>
Neque blandit pellentesque nunc sed amet. Nisl, semper sed aliquam amet proin purus augue et.
</p>
</div>
<div class="rtds-card__categories">
<a href="#" class="rtds-category rtds-category--sm">
Categoria
</a>
</div>
</div>
</article>
</li>
<li class="rtds-col">
<article class="rtds-card rtds-card--news rtds-card--news-small rtds-card--news-no-thumb is-card-fullclickable rtds-group/card">
<div class="rtds-card__content">
<div class="rtds-card__heading">
<h3 class="rtds-card__title">
<a class="group-hover/card:rtds-underline" href="">
Nunc aliquam phasellus molestie blandit. Nisi, amet, id maecenas diam
</a>
</h3>
<div class="rtds-card__metadata">
</div>
</div>
<div class="rtds-card__description ">
<p>
Neque blandit pellentesque nunc sed amet. Nisl, semper sed aliquam amet proin purus augue et.
</p>
</div>
<div class="rtds-card__categories">
<a href="#" class="rtds-category rtds-category--sm">
Categoria
</a>
</div>
</div>
</article>
</li>
</ul>
</div>
</div>
</section>
{% extends '@text-with-cards' %}
{% block rightColumn %}
<div class="{{ rightColumnWidth }}">
<div class="rtds-space-y-4">
<div class="rtds-px-2 rtds-py-4 rtds-border-b rtds-border-gray-02">
<h2 class="rtds-heading-4 rtds-content-primary">I servizi per { questo argomento }</h2>
</div>
<div class="rtds-flex rtds-gap-4 md:rtds-gap-6 lg:rtds-gap-8 rtds-flex-wrap">
<ul role="list" class="rtds-flex rtds-flex-wrap rtds-gap-4 md:rtds-gap-6 lg:rtds-gap-8">
<li class="rtds-content-02 rtds-font-bold rtds-flex rtds-items-center rtds-gap-2 rtds-text-sm lg:rtds-text-base">
{% render '@icon', { id: 'outline--cog-6-tooth', size: 'rtds-w-4 rtds-h-4 md:rtds-w-5 md:rtds-h-5 lg:rtds-w-6 lg:rtds-h-6' }, true %}
3 servizi disponibili
</li>
<li class="rtds-content-02 rtds-font-bold rtds-flex rtds-items-center rtds-gap-2 rtds-text-sm lg:rtds-text-base">
{% render '@icon', { id: 'outline--computer-desktop', size: 'rtds-w-4 rtds-h-4 md:rtds-w-5 md:rtds-h-5 lg:rtds-w-6 lg:rtds-h-6' }, true %}
3 servizi disponibili
</li>
<li class="rtds-content-02 rtds-font-bold rtds-flex rtds-items-center rtds-gap-2 rtds-text-sm lg:rtds-text-base">
{% render '@icon', { id: 'outline--hands-shaking', size: 'rtds-w-4 rtds-h-4 md:rtds-w-5 md:rtds-h-5 lg:rtds-w-6 lg:rtds-h-6' }, true %}
3 servizi disponibili
</li>
</ul>
<div class="lg:rtds-ml-auto">
{% render '@select-field--sm',{label: 'Rivolto a:', inline: 'true', variant: '--light' }, true %}
</div>
</div>
<div class="rtds-servizi-list">
<div class="rtds-grid rtds-gap-4 md:rtds-gap-5 rtds-grid-cols-1 md:rtds-grid-cols-3 lg:rtds-grid-cols-3">
{% for i in range(0,3) %}
<!-- Grid item wrapper -->
<div class="rtds-col">
{% render '@card--information-with-gradient' %}
</div>
{% endfor %}
</div>
<div class="rtds-flex rtds-justify-center rtds-py-8">
{% render '@button--icon-right-s',{ href: '#', classes: 'rtds-btn--secondary', label: 'vedi tutti i servizi', hasIcon: 'true' }, true %}
</div>
</div>
</div>
</div>
{% endblock rightColumn %}
{
"sectionPadding": "rtds-pb-8 md:rtds-pb-12",
"heading": "Lorem ipsum dolor sit amet",
"text": "Nella programmazione 2021-2027 la Toscana ha a disposizione con il programma del Fondo europeo di sviluppo regionale 1,2 miliardi e con il programma del Fondo sociale europeo plus 1,1 miliardi, un totale di 2,3 miliardi di euro. Per la pesca e l'acquacoltura il programma Feampa 2021-2027 Toscana ha una dotazione complessiva (quota UE, quota dello Stato, quota della Regione), di 22.684.066 milioni. Per l'agricoltura e lo sviluppo rurale, il Complemento per lo sviluppo rurale 2023-2027 mette a disposizione della Toscana 748.813.503 milioni di euro.",
"cardNumber": 3,
"leftColumnGap": "rtds-gap-4 md:rtds-gap-6 lg:rtds-gap-8 xl:rtds-gap-16",
"leftColumnWidth": "rtds-col-span-12 lg:rtds-col-span-5",
"rightColumnWidth": "rtds-col-span-12 lg:rtds-col-span-7",
"listHeading": "Contenuti utili",
"card": {
"handle": "card--news-small-no-thumb",
"context": {
"date": ""
}
}
}
Section of content used eg: TEMA.
Section heading with decription text, and card grid of content, for istance “Finanziamenti”.