GDL - Global Design Language

Footer 

<footer class="c-footer o-bg-dark u-z-sky">
    <div class="o-container">

        <div class="c-footer__head u-py-base u-flex u-items-center u-justify-between">
            <a href="/">

                <style>
                    @font-face {
                        font-family: 'NovecentoNarrow';
                        src: url("/~shared/files/webfonts/NovecentoSansNarrow.woff") format("woff2"),
                            url("/~shared/files/webfonts/NovecentoSansNarrow.woff") format("woff");
                        font-style: normal;
                        font-display: swap;
                    }
                </style>

                <div class="c-brand c-brand__text u-uppercase u-no-underline c-brand--small  ">
                    <span class="c-brand__edition">agrigento</span><span class="c-brand__network">notizie</span>
                </div>

            </a>
            <a href="#c-header" class="o-link-text u-label-05 u-flex u-column u-items-center">
                <svg class="o-icon o-icon--animated o-icon--md">
                    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-arrow-up-circle"></use>
                </svg>
                <span class="u-label-08">Torna su</span>
            </a>
        </div>

        <div class="c-footer__section u-pt-base u-mb-medium u-mb-large@lg u-flex u-wrap">
            <div class="u-mb-medium u-pr-large u-size-1-2@md u-size-1-3@lg">
                <div class="u-flex u-mb-base">
                    <a href="http://" target="_blank" rel="noopener noreferrer">
                        <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32">
                            <path d="M16 0a16 16 0 00-2.7 31.8V19.4H9.5v-4.5h3.8v-3.3c0-3.8 2.3-5.9 5.7-5.9l3.5.2v4H20c-1.8 0-2.2.9-2.2 2.2v2.8h4.4l-.5 4.5h-3.9v12.5A16 16 0 0016 0z" />
                        </svg>
                    </a>
                    <a href="http://" target="_blank" rel="noopener noreferrer" class="u-ml-small u-ml-base@md">
                        <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32">
                            <path d="M16 0a16 16 0 100 32 16 16 0 000-32zm7.3 12.5v.4a10.4 10.4 0 01-16 8.8 7.5 7.5 0 005.4-1.5 3.7 3.7 0 01-3.5-2.5 3.7 3.7 0 001.7 0 3.7 3.7 0 01-3-3.7c.6.2 1.1.4 1.7.4a3.7 3.7 0 01-1.6-3c0-.7.2-1.3.5-1.9a10.4 10.4 0 007.6 3.9 3.7 3.7 0 016.2-3.4 7.4 7.4 0 002.3-.9 3.7 3.7 0 01-1.6 2 7.3 7.3 0 002.1-.5 7.5 7.5 0 01-1.8 1.9z" />
                        </svg>
                    </a>
                    <a href="http://" target="_blank" rel="noopener noreferrer" class="u-ml-small u-ml-base@md">
                        <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32">
                            <path d="M16 0a16 16 0 110 32 16 16 0 010-32zm1 7h-4.7c-1 0-1.6.2-2.2.5a4.4 4.4 0 00-1.6 1c-.4.5-.8 1-1 1.6-.2.6-.4 1.2-.4 2.2v7.4c0 1 .2 1.6.4 2.2a4.4 4.4 0 001 1.6c.5.4 1 .8 1.6 1 .6.2 1.2.4 2.2.4h7.4c1 0 1.6-.2 2.2-.4a4.6 4.6 0 002.6-2.6c.2-.6.4-1.3.4-2.2V19a66.3 66.3 0 000-2.3v-2-2.5c0-1-.2-1.6-.4-2.2a4.4 4.4 0 00-1-1.6 4.4 4.4 0 00-1.6-1c-.6-.2-1.2-.4-2.2-.4L17 7zm0 1.6h2.6a5 5 0 011.7.4c.4.1.7.4 1 .7.3.3.6.6.7 1 .1.3.3.8.3 1.7V17a60.6 60.6 0 010 2v.6a5 5 0 01-.3 1.7 3 3 0 01-1.7 1.7 48.3 48.3 0 01-4.3.4h-2a49 49 0 01-4.3-.4 2.8 2.8 0 01-1-.7 2.8 2.8 0 01-.7-1 5 5 0 01-.3-1.7V19a61.5 61.5 0 010-2V15v-2.6c0-1 .2-1.4.3-1.7a2.7 2.7 0 01.7-1 2.8 2.8 0 011-.7 5 5 0 011.7-.3h2.8zm-1 2.8a4.6 4.6 0 000 9.2 4.6 4.6 0 000-9.2zm0 1.6a3 3 0 110 6 3 3 0 010-6zm4.8-2.9a1 1 0 100 2.2 1 1 0 000-2.2z" fill-rule="evenodd" />
                        </svg>
                    </a>
                    <a href="http://" target="_blank" rel="noopener noreferrer" class="u-ml-small u-ml-base@md">
                        <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32">
                            <path d="M16 0a16 16 0 110 32 16 16 0 010-32zm6.6 7H9.4v4.4l-2.4.4 1.8 9.3V24h14.3v-2.8l1.9-9.3-2.4-.4V7zm-.5 7.6v8.2H9.9v-8.2h12.2zm-8 1a3 3 0 00-3.1 3.1 3 3 0 003 3 3 3 0 003-3v-.5h-3v1h2v.2a2 2 0 01-2 1.3 2 2 0 01-2-2 2 2 0 013.4-1.4l.7-.8-.1-.1a3 3 0 00-2-.7zm7 4.7h-3v1h3v-1zm0-2.1h-3v1h3v-1zm0-2.1h-3v1h3v-1zm0-4l2.6.6-.6 3v-2.2h-1.7l-.3-1.4zm-1.4-1.7l.6 3.1H8.8v2.2l-.6-3 11.5-2.3zM21.5 8v3H21l-.4-2-10 2v-3h11z" fill-rule="evenodd" />
                        </svg>
                    </a>
                </div>

                <span class="u-label-08 u-color-light">Today plurisettimanale telematico reg. tribunale di Roma n. 93/2010 P.iva 10786801000. Testata iscritta all’<a href="#" class="u-label-08 o-link-inverse">USPI</a></span>
            </div>
            <div class="u-size-full u-size-1-2@md u-size-1-3@lg u-flex">

                <div class="u-size-1-2">
                    <h4 class="u-nav-05 u-color-light u-mb-small">Canali</h4>
                    <ul class="u-list-none u-m-none u-p-none">

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Notizie</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Ultime notizie</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Lifestyle</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Cultura</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Opinioni</a>
                        </li>

                    </ul>
                </div>

                <div class="u-size-1-2">
                    <h4 class="u-nav-05 u-color-light u-mb-small">Link utili</h4>
                    <ul class="u-list-none u-m-none u-p-none">

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Presentazione</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Registrati</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Codice di condotta</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Condizioni generali</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Privacy</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Invia contenuti</a>
                        </li>

                        <li class="u-mb-small">
                            <a class="u-nav-03 o-link-text" href="#">Help</a>
                        </li>

                    </ul>
                </div>

            </div>
            <div class="c-footer__claim u-size-full u-size-1-3@lg u-flex u-column u-justify-center u-items-center u-p-xlarge">
                <span class="u-title-05 u-color-inverse u-text-center u-mb-base">Il tuo brand sulle nostre testate</span>

                <button class="c-btn c-btn--primary 
  
    c-btn--rounded
   
  
    u-flex
  
  
    u-label-04
   
   
  u-cursor-pointer  u-items-center">
                    Richiedi info

                </button>
            </div>
        </div>

        <div class="c-footer__section o-divider o-divider--top u-py-base u-flex u-column u-row@md u-items-center u-justify-between">
            <div class="u-flex u-items-center u-mb-base u-mb-none@lg u-justify-between">
                <a class="u-mr-base" href="">
                    <svg class="c-brand-cn" width="91" height="24">
                        <use xlink:href="#brand-citynews"></use>
                    </svg>
                </a>
                <div tabindex="1" class="c-dropdown c-dropdown--reset c-dropdown--network u-cursor-pointer u-flex u-items-center u-justify-center u-label-05 u-p-small" data-dd-controller>
                    Edizioni locali
                    <svg class="o-icon o-icon--animated o-icon--md" data-dd-icon>
                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
                    </svg>
                    <div class="c-dropdown__panel u-fixed u-bottom u-size-full" data-dd-panel>
                        <div class="u-flex u-p-medium u-overflow-auto u-size-full">
                            <div class="u-flex">

                                <a href="http://www.romatoday.it" title="romatoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-romatoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="milanotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-milanotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="torinotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-torinotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="firenzetoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-firenzetoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="padovaoggi">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-padovaoggi.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="chietitoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-chietitoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="palermotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-palermotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="arezzonotizie">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-arezzonotizie.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="baritoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-baritoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="lecceprima">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-lecceprima.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="ilpiacenza">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-ilpiacenza.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="veneziatoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-veneziatoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="trevisotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-trevisotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="trentotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-trentotoday.png" alt="">
                                </a>
                            </div>
                            <div class="u-flex">

                                <a href="http://www.romatoday.it" title="romatoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-romatoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="milanotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-milanotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="torinotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-torinotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="firenzetoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-firenzetoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="padovaoggi">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-padovaoggi.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="chietitoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-chietitoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="palermotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-palermotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="arezzonotizie">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-arezzonotizie.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="baritoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-baritoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="lecceprima">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-lecceprima.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="ilpiacenza">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-ilpiacenza.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="veneziatoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-veneziatoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="trevisotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-trevisotoday.png" alt="">
                                </a>
                                <a href="http://www.romatoday.it" title="trentotoday">
                                    <img loading="lazy" preload="none" decoding="async" referrerpolicy="no-referrer" class="c-dropdown__brand u-mr-medium" src="https://citynews.stgy.ovh/~shared/images/v2015/brands/citynews-trentotoday.png" alt="">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <span class="u-label-08 u-color-light u-self-center">© Copyright 2009-2020</span>
        </div>

    </div>
</footer>
 
<footer class="c-footer o-bg-dark u-z-sky">
  <div class="o-container">

    <div class="c-footer__head u-py-base u-flex u-items-center u-justify-between">
      <a href="/">
        {% if local %}
          {% render "@brand", {local:true, modifier: 'small', logo: false}, false %}
        {% else %}
          {% render "@brand", {logo: false, modifier: 'small'}, false %}
        {% endif %}
      </a>
      <a href="#c-header" class="o-link-text u-label-05 u-flex u-column u-items-center">
        <svg class="o-icon o-icon--animated o-icon--md">
          <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-arrow-up-circle"></use>
        </svg>
        <span class="u-label-08">Torna su</span>
      </a>
    </div>
    
    <div class="c-footer__section u-pt-base u-mb-medium u-mb-large@lg u-flex u-wrap">
      <div class="u-mb-medium u-pr-large u-size-1-2@md u-size-1-3@lg">
        <div class="u-flex u-mb-base">
          <a href="http://" target="_blank" rel="noopener noreferrer">
            <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32"><path d="M16 0a16 16 0 00-2.7 31.8V19.4H9.5v-4.5h3.8v-3.3c0-3.8 2.3-5.9 5.7-5.9l3.5.2v4H20c-1.8 0-2.2.9-2.2 2.2v2.8h4.4l-.5 4.5h-3.9v12.5A16 16 0 0016 0z"/></svg>
          </a>
          <a href="http://" target="_blank" rel="noopener noreferrer" class="u-ml-small u-ml-base@md">
            <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32"><path d="M16 0a16 16 0 100 32 16 16 0 000-32zm7.3 12.5v.4a10.4 10.4 0 01-16 8.8 7.5 7.5 0 005.4-1.5 3.7 3.7 0 01-3.5-2.5 3.7 3.7 0 001.7 0 3.7 3.7 0 01-3-3.7c.6.2 1.1.4 1.7.4a3.7 3.7 0 01-1.6-3c0-.7.2-1.3.5-1.9a10.4 10.4 0 007.6 3.9 3.7 3.7 0 016.2-3.4 7.4 7.4 0 002.3-.9 3.7 3.7 0 01-1.6 2 7.3 7.3 0 002.1-.5 7.5 7.5 0 01-1.8 1.9z"/></svg>
          </a>
          <a href="http://" target="_blank" rel="noopener noreferrer" class="u-ml-small u-ml-base@md">
            <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32"><path d="M16 0a16 16 0 110 32 16 16 0 010-32zm1 7h-4.7c-1 0-1.6.2-2.2.5a4.4 4.4 0 00-1.6 1c-.4.5-.8 1-1 1.6-.2.6-.4 1.2-.4 2.2v7.4c0 1 .2 1.6.4 2.2a4.4 4.4 0 001 1.6c.5.4 1 .8 1.6 1 .6.2 1.2.4 2.2.4h7.4c1 0 1.6-.2 2.2-.4a4.6 4.6 0 002.6-2.6c.2-.6.4-1.3.4-2.2V19a66.3 66.3 0 000-2.3v-2-2.5c0-1-.2-1.6-.4-2.2a4.4 4.4 0 00-1-1.6 4.4 4.4 0 00-1.6-1c-.6-.2-1.2-.4-2.2-.4L17 7zm0 1.6h2.6a5 5 0 011.7.4c.4.1.7.4 1 .7.3.3.6.6.7 1 .1.3.3.8.3 1.7V17a60.6 60.6 0 010 2v.6a5 5 0 01-.3 1.7 3 3 0 01-1.7 1.7 48.3 48.3 0 01-4.3.4h-2a49 49 0 01-4.3-.4 2.8 2.8 0 01-1-.7 2.8 2.8 0 01-.7-1 5 5 0 01-.3-1.7V19a61.5 61.5 0 010-2V15v-2.6c0-1 .2-1.4.3-1.7a2.7 2.7 0 01.7-1 2.8 2.8 0 011-.7 5 5 0 011.7-.3h2.8zm-1 2.8a4.6 4.6 0 000 9.2 4.6 4.6 0 000-9.2zm0 1.6a3 3 0 110 6 3 3 0 010-6zm4.8-2.9a1 1 0 100 2.2 1 1 0 000-2.2z" fill-rule="evenodd"/></svg>
          </a>
          <a href="http://" target="_blank" rel="noopener noreferrer" class="u-ml-small u-ml-base@md">
            <svg class="c-footer__badge" xmlns="http://www.w3.org/2000/svg" width="0%" height="0%" viewBox="0 0 32 32"><path d="M16 0a16 16 0 110 32 16 16 0 010-32zm6.6 7H9.4v4.4l-2.4.4 1.8 9.3V24h14.3v-2.8l1.9-9.3-2.4-.4V7zm-.5 7.6v8.2H9.9v-8.2h12.2zm-8 1a3 3 0 00-3.1 3.1 3 3 0 003 3 3 3 0 003-3v-.5h-3v1h2v.2a2 2 0 01-2 1.3 2 2 0 01-2-2 2 2 0 013.4-1.4l.7-.8-.1-.1a3 3 0 00-2-.7zm7 4.7h-3v1h3v-1zm0-2.1h-3v1h3v-1zm0-2.1h-3v1h3v-1zm0-4l2.6.6-.6 3v-2.2h-1.7l-.3-1.4zm-1.4-1.7l.6 3.1H8.8v2.2l-.6-3 11.5-2.3zM21.5 8v3H21l-.4-2-10 2v-3h11z" fill-rule="evenodd"/></svg>  
          </a>
        </div>
        {% if local %}
          <div class="u-flex u-mb-base">
            <a href="http://" target="_blank" rel="noopener noreferrer">
              <img decoding="async" referrerpolicy="no-referrer" class="c-footer__badge" src="http://1.citynews.stgy.ovh/~shared/images/v2015/icons/badge-apple.svg" alt="">
            </a>
            <a href="http://" target="_blank" rel="noopener noreferrer" class="u-mx-small u-mx-base@md">
              <img decoding="async" referrerpolicy="no-referrer" class="c-footer__badge" src="http://3.citynews.stgy.ovh/~shared/images/v2015/icons/badge-google.png" alt="">
            </a>
          </div>
        {% endif %}
        <span class="u-label-08 u-color-light">Today plurisettimanale telematico reg. tribunale di Roma n. 93/2010 P.iva 10786801000. Testata iscritta all’<a href="#" class="u-label-08 o-link-inverse">USPI</a></span>
      </div>
      <div class="u-size-full u-size-1-2@md u-size-1-3@lg u-flex">
        {% for nav in navigation %}
          <div class="u-size-1-2">
              <h4 class="u-nav-05 u-color-light u-mb-small">{{nav.name}}</h4>
              <ul class="u-list-none u-m-none u-p-none">
                {% for item in nav.list %}
                  <li class="u-mb-small">
                    <a class="u-nav-03 o-link-text" href="#">{{item.name}}</a>
                  </li>
                {% endfor %}
              </ul>
          </div>
        {% endfor %}
      </div>
      <div class="c-footer__claim u-size-full u-size-1-3@lg u-flex u-column u-justify-center u-items-center u-p-xlarge">
        <span class="u-title-05 u-color-inverse u-text-center u-mb-base">{{claim}}</span>
        {% render "@button--primary", {rounded: true, label: 'Richiedi info', icon: false}, true %}
      </div>
    </div>

    <div class="c-footer__section o-divider o-divider--top u-py-base u-flex u-column u-row@md u-items-center u-justify-between">
      <div class="u-flex u-items-center u-mb-base u-mb-none@lg u-justify-between">
        <a class="u-mr-base" href="">
          <svg class="c-brand-cn" width="91" height="24">
						<use xlink:href="#brand-citynews"></use>
					</svg>
        </a>
        {% render "@dropdown--network" %}
      </div>
      <span class="u-label-08 u-color-light u-self-center">© Copyright 2009-2020</span>
    </div>

  </div>
</footer>
 
{
  "claim": "Il tuo brand sulle nostre testate",
  "action": "Richiedi info",
  "links": [
    {
      "item": "Chi siamo"
    },
    {
      "item": "Press"
    },
    {
      "item": "Contatti"
    }
  ],
  "navigation": [
    {
      "nav": null,
      "name": "Canali",
      "list": [
        {
          "item": null,
          "name": "Notizie"
        },
        {
          "item": null,
          "name": "Ultime notizie"
        },
        {
          "item": null,
          "name": "Lifestyle"
        },
        {
          "item": null,
          "name": "Cultura"
        },
        {
          "item": null,
          "name": "Opinioni"
        }
      ]
    },
    {
      "nav": null,
      "name": "Link utili",
      "list": [
        {
          "item": null,
          "name": "Presentazione"
        },
        {
          "item": null,
          "name": "Registrati"
        },
        {
          "item": null,
          "name": "Codice di condotta"
        },
        {
          "item": null,
          "name": "Condizioni generali"
        },
        {
          "item": null,
          "name": "Privacy"
        },
        {
          "item": null,
          "name": "Invia contenuti"
        },
        {
          "item": null,
          "name": "Help"
        }
      ]
    }
  ]
}
  • Content: 
    // Name:            Footer
// Description:     Footer of website
//
// Component:       `c-footer`
//
// Dependencies:    `settings/colors.tokens`
//                  `v7_colors`
//
// ========================================================================

.c-footer {

  // Custom properties
  // ======================================================================

  --footer-brand-height: 2rem;
  
  // ======================================================================

  border-top: 2px solid var(--divider-color);

  .c-brand {
    fill: $ui-01;
    height: var(--footer-brand-height);
    @include bp(sm) {
      --footer-brand-height: 2.5rem;
    }
  }

  &__claim {
    background-color: $ui-07;
  }

  &__head {
    justify-content: center;
    @include bp(sm) {
      align-items: center;
      justify-content: space-between;
    }
  }
  
  &__badge {
    height: $icon-size-large;
    width: auto;
    fill: $ui-01;
    @include bp(md) {
      margin-top: 0;
    }
  }

  .c-dropdown--network {
    color: $link-01;
  }
}
  • URL: /components/raw/footer/footer.scss
  • Filesystem Path: src/lib/components/footer/footer.scss
  • Size: 1 KB

No notes defined.