Regione Toscana Design System

Card Banner Links: Grid 2 

<section class="rtds-section rtds-section--siti-web-collegati rtds-py-8 md:rtds-py-12">
    <div class="rtds-container rtds-space-y-4">
        <div class="rtds-section-header rtds-section-header--siti-web-collegati">
            <div class="rtds-flex rtds-items-center rtds-gap-4 md:rtds-gap-6 rtds-content-01">
                <div class="rtds-flex rtds-flex-wrap rtds-items-center rtds-gap-2 md:rtds-gap-4">

                    <h2 class="rtds-heading-3 md:rtds-heading-2">Titolo sezione</h2>

                    <div class="rtds-vertical-divider rtds-w-4 md:rtds-w-6 lg:rtds-w-8">
                        <img class="rtds-w-full rtds-h-auto" src="/images/vertical-divider.svg" alt="">
                    </div>

                </div>

            </div>
        </div>
        <div class="rtds-space-y-5">
            <ul role="list" class="rtds-grid rtds-gap-4 md:rtds-grid-cols-2">
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        Toscana Notizie

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        GiovaniSì

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        Open Toscana

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        Toscana Accessibile

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        Digital Innovation Hub - Industria 4.0

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        Muoversi in Toscana

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        Toscana Digitale

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
                <li class="rtds-col">
                    <div class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card">

                        <picture class="rtds-card__image-wrapper
  ">
                            <img class="rtds-card__image" alt="" src="/images/card-image.jpg" />
                        </picture>

                        <div class="rtds-card__content">

                            <div class="rtds-card__heading">

                                <h3 class="rtds-card__title">
                                    <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">

                                        Ufficio Relazioni con il Pubblico

                                        <svg class="rtds-icon rtds-fill-current rtds-flex-shrink-0" aria-hidden="true" focusable="false" role="img">
                                            <use href="../../icons.svg#mini--arrow-small-right" />
                                        </svg>

                                    </a>
                                </h3>

                            </div>

                        </div>

                    </div>
                </li>
            </ul>
        </div>
    </div>

</section>
 
<section class="rtds-section rtds-section--siti-web-collegati rtds-py-8 md:rtds-py-12">
    <div class="rtds-container rtds-space-y-4">
        {% render '@section-header', { 
            classes: 'rtds-section-header--siti-web-collegati',
            heading: 'Titolo sezione'
            }, true %}
        <div class="rtds-space-y-5">
            <ul role="list" class="rtds-grid rtds-gap-4 md:rtds-grid-cols-2">
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/toscana-notizie-icon.png', srcset: '/images/icone-siti/toscana-notizie-icon@2x.png 2x, /images/icone-siti/toscana-notizie-icon.png 1x' }, heading: 'Toscana Notizie' },true %}</li>
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/giovanisi-icon.png', srcset: '/images/icone-siti/giovanisi-icon@2x.png 2x, /images/icone-siti/giovanisi-icon.png 1x' }, heading: 'GiovaniSì' },true %}</li>
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/open-toscana-icon.png', srcset: '/images/icone-siti/open-toscana-icon@2x.png 2x, /images/icone-siti/open-toscana-icon.png 1x' }, heading: 'Open Toscana' },true %}</li>
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/toscana-accessibile-icon.png', srcset: '/images/icone-siti/toscana-accessibile-icon@2x.png 2x, /images/icone-siti/toscana-accessibile-icon.png 1x' }, heading: 'Toscana Accessibile' },true %}</li>
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/digital-innovation-hub-icon.png', srcset: '/images/icone-siti/digital-innovation-hub-icon@2x.png 2x, /images/icone-siti/digital-innovation-hub-icon.png 1x' }, heading: 'Digital Innovation Hub - Industria 4.0' },true %}</li>
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/muoversi-in-toscana-icon.png', srcset: '/images/icone-siti/muoversi-in-toscana-icon@2x.png 2x, /images/icone-siti/muoversi-in-toscana-icon.png 1x' }, heading: 'Muoversi in Toscana' },true %}</li>
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/toscana-digitale-icon.png', srcset: '/images/icone-siti/toscana-digitale-icon@2x.png 2x, /images/icone-siti/toscana-digitale-icon.png 1x' }, heading: 'Toscana Digitale' },true %}</li>
                <li class="rtds-col">{% render '@card--sito-tematico-l',{ headingThumb: {path: '/images/icone-siti/urp-icon.png', srcset: '/images/icone-siti/urp-icon@2x.png 2x, /images/icone-siti/urp-icon.png 1x' }, heading: 'Ufficio Relazioni con il Pubblico' },true %}</li>
            </ul>
        </div>
    </div>

</section>
 
/* No context defined. */

No notes defined.