<div class="c-tab o-container u-size-full-view u-flex u-column">
    <header id="c-header" class="c-header u-py-medium u-py-medium@md c-header--vanilla c-header--inverse u-z-high u-relative  u-relative u-flex u-justify-center u-size-full">
        <a class="u-flex u-justify-center" href="/">

            <svg class="c-brand 
  c-brand--resize-small 
   
   
  " viewBox="0 0 500 50" xmlns="http://www.w3.org/2000/svg">

                <path d="M22.5 40.6l1.5 8.5h10.5L24.5.9H10L0 49.1h10.2l1.4-8.5h10.9zM278.3 0c11 0 17.7 6.6 17.7 25 0 18.3-6.6 25-17.7 25-11 0-17.7-6.5-17.7-25 0-18.3 6.6-25 17.7-25zM53.2 0c9.7 0 14.3 5.5 15.6 13.8l-9.6 2.6c-.7-3.7-2.2-6.8-6.4-6.8-4.6 0-6.8 4-6.8 14.5 0 11.9 2.5 16.3 7.8 16.3 4 0 5.8-2.2 6.3-4.3v-4.8h-7v-9.5h16.4V49h-9.2v-3h-.2a11 11 0 01-8.6 3.6c-8.3 0-15.9-5.7-15.9-25C35.6 6.2 42.6 0 53.2 0zm86.7 0c9.8 0 14.3 5.5 15.6 13.8l-9.6 2.6c-.7-3.7-2.2-6.8-6.3-6.8-4.7 0-7 4-7 14.5 0 11.9 2.6 16.3 8 16.3 3.9 0 5.7-2.2 6.3-4.3v-4.8h-7v-9.5h16.3V49h-9.1v-3h-.2a11 11 0 01-8.6 3.6c-8.4 0-16-5.7-16-25 0-18.6 7-24.7 17.6-24.7zM89.1.9c9.5 0 14.4 6.5 14.4 15.9 0 5.9-2.2 10.5-6.5 12.7l7.6 19.6H93.3l-6-17.4-1.4.1h-1.4v17.3h-10V.9zm29.1 0v48.2h-10V.9h10zm69.3 0v9.6h-16.3v9.3h12.2V29h-12.2v10.4H188V49h-26.7V.9h26.3zm15.2 0l12.9 28h.2V.9h9.6v48.2h-10.2l-12.9-27h-.2v27h-9.6V.9h10.2zm56.2 0v9.6h-9.8V49h-10V10.5h-9.8V.9h29.6zm19.4 8.7c-5 0-7.4 3.6-7.4 15.3 0 11.9 2.4 15.5 7.4 15.5s7.4-3.5 7.4-15.3c0-12-2.5-15.5-7.4-15.5zm-261.1.8l1.5 9 2.1 12h-7.5l2.1-12.1 1.5-8.9h.3zm71.2 0h-4v13h4.2c2.9 0 4.8-2 4.8-6.5 0-4-1.7-6.5-5-6.5z" class="c-brand__edition"></path>
                <path d="M356.8 0c11 0 17.8 6.6 17.8 25 0 18.3-6.6 25-17.8 25-11 0-17.8-6.5-17.8-25 0-18.3 6.7-25 17.8-25zm-44.6.9l13 28h.1V.9h9.6v48.2h-10.2l-12.9-27h-.2v27H302V.9h10.2zm93.8 0v9.6h-10V49h-10V10.5h-9.9V.9H406zm14 0v48.2h-10.1V.9h10zm33 0V11l-13.4 22.2-3.7 6 .1.3h17.2v9.6h-28.7v-9.7L438.8 16l3.3-5.4-.1-.2h-17V.9h28zm14.9 0v48.2h-10.1V.9h10zm31.8 0v9.6h-16.4v9.3h12.2V29h-12.2v10.4H500V49h-26.8V.9h26.5zM356.8 9.6c-5 0-7.4 3.6-7.4 15.3 0 11.9 2.4 15.5 7.4 15.5s7.4-3.5 7.4-15.3c0-12-2.5-15.5-7.4-15.5z" class="c-brand__network"></path>

            </svg>

        </a>
    </header>

    <section class="c-tab u-flex-one u-mb-medium" data-section-key="native" data-items-count="5" role="complementary">

        <div class="c-tab--desktop u-p-none">
            <div class="u-size-full u-border-none">
                <div class="l-double l-double--reverse u-grid">
                    <div class="l-double__aside u-relative">
                        <div class="u-flex u-column u-justify-center u-items-center u-my-large">
                            <div>
                                <figure class="c-avatar c-avatar--large u-relative u-radius-circle u-overflow-hidden ">
                                    <img decoding="async" referrerpolicy="no-referrer" class="c-avatar__thumb u-absolute u-left u-bottom u-size-full" src="https://admin.previewtoday.strategy.it/images/test/alberto_berlini.png" loading="lazy" alt="" />
                                </figure>
                            </div>
                            <div class="u-text-center">
                                <h1 class="u-title-05 u-mb-xsmall">
                                    Alberto
                                </h1>
                                <span class="u-label-07 u-color-secondary">Iscritto dal 21 dicembre 2023</span>
                                <br>
                                <span class="u-label-07 u-color-secondary">via mail <b>@citynews.it</b></span>
                            </div>
                        </div>
                        <ul class="u-list-none u-list-reset l-list-border u-label-07 u-flex u-column@lg u-justify-around u-justify-start@lg u-pb-medium">

                            <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                                <a href="user--profile2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                                    <svg class="u-mr-small@lg o-icon o-icon--md">
                                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-user"></use>
                                    </svg>
                                    <span class="u-none u-block@lg">
                                        Modifica profilo
                                    </span>
                                </a>
                            </li>

                            <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                                <a href="" class="o-link-text-active u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                                    <svg class="u-mr-small@lg o-icon o-icon--md">
                                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-email"></use>
                                    </svg>
                                    <span class="u-none u-block@lg">
                                        Newsletter Dossier
                                    </span>
                                </a>
                            </li>

                            <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                                <a href="user--arguments2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                                    <svg class="u-mr-small@lg o-icon o-icon--md">
                                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-tag"></use>
                                    </svg>
                                    <span class="u-none u-block@lg">
                                        Scegli argomenti
                                    </span>
                                </a>
                            </li>

                            <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                                <a href="user--subscriptions2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                                    <svg class="u-mr-small@lg o-icon o-icon--md">
                                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-key"></use>
                                    </svg>
                                    <span class="u-none u-block@lg">
                                        Gestione abbonamenti
                                    </span>
                                </a>
                            </li>

                            <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                                <a href="user--notifications2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                                    <svg class="u-mr-small@lg o-icon o-icon--md">
                                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-lock"></use>
                                    </svg>
                                    <span class="u-none u-block@lg">
                                        Preferenze notifiche
                                    </span>
                                </a>
                            </li>

                        </ul>
                    </div>
                    <div class="form-body l-double__main">
                        <div class="u-size-full u-pl-base u-pr-base u-pl-large@md u-pr-large@md">
                            <div class="u-mb-xlarge u-mt-large">
                                <h2 class="u-heading-09 u-mb-small u-text-center u-text-left@md">Newsletter Dossier</h2>

                                <p class="u-body-03 u-color-secondary u-my-none u-text-center u-text-left@md">Seleziona le newsletter che vuoi ricevere tra quelle incluse nella tua offerta. Se vuoi puoi impostare un indirizzo e-mail differente</p>
                            </div>

                            <div class="u-mb-base u-size-full">
                                <div class="u-mb-base">
                                    <label class="u-label-04 u-color-base" for="">E-mail per le newsletter</label>
                                    <input class=" u-block u-size-full u-size-1-2@md" type="text" placeholder="">
                                </div>

                                <div class="u-flex u-items-center">
                                    <input class="u-mr-small" type="checkbox" id="myCheckbox">
                                    <label class="u-label-04" for="myCheckbox">Voglio ricevere le seguenti newsletter settimanali</label>
                                </div>
                            </div>

                            <div class="c-tab">
                                <input type="radio" id="form-radio-subscriptionsList" class="u-none u-absoute u-left u-top usize-full" name="c-tabs__choice" checked="">
                                <div class="c-tab__content u-size-full u-p-none u-mt-base">

                                    <div class="u-mb-base u-border-1 u-border-bottom-solid u-border-gray-light ">
                                        <div class="u-flex u-mb-base u-items-center u-px-xsmall">
                                            <img class="c-dropdown__brand u-mr-medium" src="http://2.citynews.stgy.ovh/~shared/images/v2015/brands/citynews-romatoday.png" alt="Basic">
                                            <div>
                                                <h4 class="u-mb-xsmall">Romatoday</h4>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="u-mt-large">
                                        <div class="u-flex u-items-center">
                                            <div class="u-size-full u-text-right u-size-full u-size-1-2@md ">
                                                <input class="fw__button c-btn c-btn--primary u-label-03 u-cursor-pointer c-btn--large u-text-center u-size-full" type="submit" value="Salva preferenze">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <footer class="c-footer c-footer--vanilla u-py-small u-py-medium@md u-mt-auto">
        <div class="u-gap-medium o-divider u-flex u-column u-items-center">
            <div class="u-flex u-column u-row@md u-gap-small u-text-center u-label-08 u-color-light">
                <span> © 2024 Citynews SpA - P.IVA 10786801000 </span>
                <span> <a href=https://citynews.it/termini-servizio#_ga=2.195002985.558624410.1646066405-2053839960.1623412359>Termini e Condizioni</a> </span>
                <span> <a href=https://citynews.it/condizioni-particolari#_ga=2.5143347.1498799164.1669298142-1368784910.1664177783>Condizioni particolari </a></span>
                <span> <a href=https://citynews.it/privacy#_ga=2.195002985.558624410.1646066405-2053839960.1623412359>Privacy Policy</a> </span>
                <span> <a href=https://www.citynews.it/gruppo/compliance />Modello 231 e Codice Etico</a></span>
            </div>
            <a class="u-mr-base" href="">
                <svg class="c-brand-cn" width="176" height="46">
                    <use xlink:href="#brand-citynews"></use>
                </svg>
            </a>
        </div>
    </footer>
</div>
<div class="c-tab o-container u-size-full-view u-flex u-column">
	{% render "@header--vanilla" %}	
  <section class="c-tab u-flex-one u-mb-medium" data-section-key="native" data-items-count="5" role="complementary">
    
    <div class="c-tab--desktop u-p-none">
      <div class="u-size-full u-border-none">
        <div class="l-double l-double--reverse u-grid">
          <div class="l-double__aside u-relative">
            <div class="u-flex u-column u-justify-center u-items-center u-my-large">    
              <div>
                <figure class="c-avatar c-avatar--large u-relative u-radius-circle u-overflow-hidden ">
                  <img decoding="async" referrerpolicy="no-referrer" class="c-avatar__thumb u-absolute u-left u-bottom u-size-full" src="https://admin.previewtoday.strategy.it/images/test/alberto_berlini.png" loading="lazy" alt="" />     
                </figure>
              </div>			
              <div class="u-text-center">
                <h1 class="u-title-05 u-mb-xsmall">
                  Alberto      
                </h1>					
                <span class="u-label-07 u-color-secondary">Iscritto dal 21 dicembre 2023</span>
                <br>
                <span class="u-label-07 u-color-secondary">via mail <b>@citynews.it</b></span>
              </div>					
            </div>
            <ul class="u-list-none u-list-reset l-list-border u-label-07 u-flex u-column@lg u-justify-around u-justify-start@lg u-pb-medium">

              <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                <a href="user--profile2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                <svg class="u-mr-small@lg o-icon o-icon--md">
                <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-user"></use>
                </svg>
                <span class="u-none u-block@lg">
                Modifica profilo
                </span>
                </a>
              </li>

              <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                <a href="" class="o-link-text-active u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                <svg class="u-mr-small@lg o-icon o-icon--md">
                <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-email"></use>
                </svg>
                <span class="u-none u-block@lg">
                Newsletter Dossier
                </span>
                </a>
              </li>

              <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                <a href="user--arguments2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                <svg class="u-mr-small@lg o-icon o-icon--md">
                <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-tag"></use>
                </svg>
                <span class="u-none u-block@lg">
                Scegli argomenti
                </span>
                </a>
              </li>

              <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                <a href="user--subscriptions2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                <svg class="u-mr-small@lg o-icon o-icon--md">
                <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-key"></use>
                </svg>
                <span class="u-none u-block@lg">
                Gestione abbonamenti
                </span>
                </a>
              </li>

              <li class="u-py-small u-inline-flex u-justify-center u-flex-one u-block@lg">
                <a href="user--notifications2021" class="o-link-text u-label-04 u-no-underline u-cursor-pointer u-block u-flex u-items-center">
                <svg class="u-mr-small@lg o-icon o-icon--md">
                <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-lock"></use>
                </svg>
                <span class="u-none u-block@lg">
                Preferenze notifiche
                </span>
                </a>
              </li>

            </ul>
          </div>
          <div class="form-body l-double__main">
            <div class="u-size-full u-pl-base u-pr-base u-pl-large@md u-pr-large@md">
              <div class="u-mb-xlarge u-mt-large">
                <h2 class="u-heading-09 u-mb-small u-text-center u-text-left@md">{{title}}</h2>
                {% if basic %}
                <p class="u-body-03 u-color-secondary u-my-none u-text-center u-text-left@md"><b>{{label}}</b></p>
                {% endif %}
                <p class="u-body-03 u-color-secondary u-my-none u-text-center u-text-left@md">{{subtitle}}</p>
              </div>
              {% if checkbox %}
              <div class="u-mb-base u-size-full">
                <div class="u-mb-base">
                  <label class="u-label-04 u-color-base" for="">{{form}}</label>
                  <input class=" u-block u-size-full u-size-1-2@md" type="text" placeholder="">
                </div>
                
                <div class="u-flex u-items-center">
                  <input class="u-mr-small" type="checkbox" id="myCheckbox">
                  <label class="u-label-04" for="myCheckbox">{{checkbox}}</label>
                </div>
              </div>              
              {% endif %}
              <div class="c-tab">                    
                <input type="radio" id="form-radio-subscriptionsList" class="u-none u-absoute u-left u-top usize-full" name="c-tabs__choice" checked="">
                <div class="c-tab__content u-size-full u-p-none u-mt-base">
                  
                  {% if img %}
                  <div class="u-mb-base u-border-1 u-border-bottom-solid u-border-gray-light ">
                    <div class="u-flex u-mb-base u-items-center u-px-xsmall">
                      <img class="c-dropdown__brand u-mr-medium" src="http://2.citynews.stgy.ovh/~shared/images/v2015/brands/citynews-romatoday.png" alt="Basic">
                      <div>
                        <h4 class="u-mb-xsmall">{{editionName}}</h4>
                      </div>		
                    </div>        
                  </div>
                  {% endif %}

                  {% if cta2 %}
                  <div class="u-flex u-justify-end">
                    <label for="idpaywall" class="c-btn c-btn--link u-label-04 u-px-base u-py-small u-cursor-pointer">{{cta2}}</label>
                   
                  </div>
                <div class="c-paywall">
                   <input type="checkbox" type="button" id="idpaywall" value="" class="u-none">
                  <div class="c-paywall__modal o-bg-base u-px-medium u-py-none@md u-p-large@md u-radius-base u-border-2 u-border-divider u-border-solid u-size-full u-size-1-2@md" popover id="newsletter-container">
                      <div class="u-px-medium u-py-none u-z-high u-size-full-height u-flex u-column">
                        <div class="u-mb-medium o-bg-base u-px-none u-py-base u-z-overcover  ">
                          <div class="u-flex u-justify-between u-items-center u-mb-xsmall">
                            <h2 class="u-heading-08 u-mb-none">Gestisci Newsletter</h2>
                            <label for="idpaywall">
                              <svg class="o-icon o-icon--md u-cursor-pointer">
                                <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-x"></use>
                              </svg>
                            </label>
                          </div>
                          <p class="u-body-03 u-color-secondary u-my-none">Puoi attivare fino ad un massimo di 5 newsletter. Non potrai modificare questa preferenza in futuro</p>
                        </div>
                        <div class="u-gap-medium u-overflow-y-auto">
                          {% for item in userSettingsSections %}
                          <div class="u-flex u-mb-base u-justify-between u-items-center u-relative u-border-1 u-border-bottom-solid u-border-gray-light u-pb-base u-pr-base">
                            <div class="u-flex u-items-center">
                              <img class="c-dropdown__brand u-mr-medium" src="{{item.img}}" alt="Basic">
                              <h4 class="u-mb-xsmall">{{item.edition}}</h4>
                            </div>
                            <label  class="c-form-switch u-relative">
                              <input type="checkbox">
                              <span class="c-form-switcher u-absolute u-top u-right u-bottom u-cursor-pointer u-mt-base"></span>
                            </label>	
                          </div>  
                          {% endfor %}
                        </div>
                        <div class=" o-bg-base u-p-base u-mt-auto u-flex u-column u-row@md u-justify-between u-items-center u-gap-small u-text-center">
                          <label class="u-color-error u-label-04" for="">Hai raggiunto il massimo delle newsletter attivabili</label>
                          <label for="newsletter-close"   class="c-btn c-btn--primary u-label-04 u-px-base u-py-small u-text-center u-size-full u-size-1-3@md u-cursor-pointer">Aggiorna</label>
                        </div> 
                      </div>
                    </div>
                  </div>
                  {% endif %}

                  <div class="u-mt-large">					
                    <div class="u-flex u-items-center">                     
                        <div class="u-size-full u-text-right u-size-full u-size-1-2@md ">
                          <input class="fw__button c-btn c-btn--primary u-label-03 u-cursor-pointer c-btn--large u-text-center u-size-full" type="submit" value="{{cta}}">
                        </div>         
                    </div>            
                  </div>
                </div>				
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
 {% render "@footer--vanilla" %}	
</div>
{
  "title": "Newsletter Dossier",
  "label": "Non hai Newsletter Dossier attivabili.",
  "subtitle": "Seleziona le newsletter che vuoi ricevere tra quelle incluse nella tua offerta. Se vuoi puoi impostare un indirizzo e-mail differente",
  "cta": "Salva preferenze",
  "basic": false,
  "img": "http://2.citynews.stgy.ovh/~shared/images/v2015/brands/citynews-romatoday.png",
  "editionName": "Romatoday",
  "modifier": "plus",
  "form": "E-mail per le newsletter",
  "checkbox": "Voglio ricevere le seguenti newsletter settimanali"
}

No notes defined.