Aeroporto di Bologna - Design System

PDF ingresso MBL 

<div grid="grid" class="u-p-space-24 u-bg-color-sky-10">
    <div grid="12" class="u-text-center">
        <a href="#"><img src="../../images/print-assets/logo-raster.png" alt="" width="130" /></a>
        <a href="#" class="u-ml-space-16"><img src="../../images/print-assets/logo-innovability-raster.png" alt="" width="60" /></a>
    </div>
</div>

<div grid="grid" class="u-p-space-24">
    <div grid="12">
        <h1 class="u-text-center u-typo-level-4 u-color-night-100 u-typo-weight-semibold">
            Questo è il tuo biglietto per accedere alla MBL Vip Lounge
        </h1>
    </div>
    <div grid="12" class="u-text-center">
        <p>Stampa questa pagina o <strong>scarica la nostra app</strong> per visualizzare il tuo ingresso dal tuo smartphone</p>
    </div>
</div>

<div grid="grid" class="u-px-space-24">
    <div grid="12" class="u-text-center">
        <a href="#"><img src="../../images/print-assets/badge_appstore_it-raster.png" alt="Scarica su App Store" height="40" /></a>
        <a href="#" class="u-ml-space-16"><img src="../../images/print-assets/Google_Play_Store_badge_IT-raster.png" alt="Disponibile su Google Play" height="40" /></a>
    </div>
</div>

<div grid="grid 12" class="u-px-space-24 u-mt-space-48">
    <div grid="grid vertical-center" class="u-bg-color-soft-100" style="border: 1px solid #D0D7DF">
        <div grid="2@md" class="u-p-space-16 u-text-center">
            <img src="../../images/print-assets/mbl-raster.png" alt="Marconi Business Lounge" width="90" />
        </div>
        <div grid="7@md" class="u-p-space-16" style="border-right: 1px solid #D0D7DF; border-left: 1px solid #D0D7DF">
            <div>
                <span class="c-rounded-label c-rounded-label--positive" aria-label="">

                    Pagato
                </span> <span class="c-rounded-label c-rounded-label--grey" aria-label="">

                    CODICE <strong>1102935</strong>
                </span>
            </div>
            <div class="u-d--f u-my-space-16">
                <div class="u-pr-space-12">
                    <div class="c-time-detail c-time-detail--raw">
                        <span class="c-time-detail__icon">
                            <svg class="c-icon">
                                <use xlink:href="#ic_flight_takeoff_black_24px"></use>
                            </svg> </span>
                        <span>
                            <strong>Data di ingresso</strong>
                            <time datetime=2023/11/15>
                                15/11/2023
                            </time>
                        </span>
                        <span>
                    </div>
                </div>
                <div class="u-pl-space-12">
                    <div class="c-time-detail c-time-detail--raw">
                        <span class="c-time-detail__icon">
                            <svg class="c-icon">
                                <use xlink:href="#ic-man-black-24px"></use>
                            </svg> </span>
                        <span>
                            <strong>Ingressi</strong>
                            <span>3</span>
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div grid="3@md" class="u-p-space-16 u-text-center">
            <p class="u-typo-level-0">TOTALE</p>
            <p class="u-typo-level-4"><strong>€ 61,00</strong></p>
        </div>
    </div>
</div>

<div grid="grid vertical-center" class="u-px-space-24 u-mt-space-48">
    <div grid="12">
        <p class="u-typo-level-4 u-color-night-100 u-typo-weight-semibold">
            Informazioni importanti
        </p>
    </div>
</div>

<div grid="grid" class="u-p-space-24 u-mt-space-12">
    <div grid="12" class="u-bg-color-sky-10 u-p-space-24 u-color-night-100">
        <div>
            <p><strong>ORARI DI APERTURA</strong></p>
            <p>I nostri attuali orari di apertura sono: tutti i giorni dalle 5:00 alle 21:00</p>
        </div>

        <div class="u-mt-space-24">
            <p><strong>COME ACCEDERE</strong></p>
            <ul class="c-list--bulleted">
                <li>L’ingresso alla MBL Vip Lounge è situato al 1° piano, prima di entrare ai controlli di sicurezza. Segui la segnaletica Business Lounge</li>
                <li><strong>Consegna i tuoi bagagli da stiva prima di accedere alla MBL Vip Lounge</strong>.
                    Per garantire il massimo comfort ai nostri ospiti, non è possibile accedere ad MBL Vip Lounge con bagagli da stiva.
                    Ti ricordiamo quindi di effettuare la consegna del tuo bagaglio da stiva ai check-in situati nell’area Partenze al Piano Terra dell’Aerostazione.</li>
            </ul>
        </div>

        <div class="u-mt-space-24">
            <p><strong>COME RICHIEDERE LA FATTURA DEL TUO INGRESSO VIP LOUNGE</strong></p>
            <ul class="c-list--bulleted">
                <li>Se decidi <strong>di pagare in Aereoporto</strong> puoi richiedere la fattura al tuo ingresso in MBL Vip Lounge</li>
                <li>Se decidi di <strong>pagare online</strong> la fattura è automatica e ti sarà inviata via e-mail.</li>
            </ul>
        </div>
    </div>
</div>
 
<div grid="grid" class="u-p-space-24 u-bg-color-sky-10">
  <div grid="12" class="u-text-center">
    <a href="#"><img src="{{ path "/images/print-assets/logo-raster.png" }}" alt="" width="130" /></a>
    <a href="#" class="u-ml-space-16"><img src="{{ path "/images/print-assets/logo-innovability-raster.png" }}" alt="" width="60" /></a>
  </div>
</div>

<div grid="grid" class="u-p-space-24">
  <div grid="12">
    <h1 class="u-text-center u-typo-level-4 u-color-night-100 u-typo-weight-semibold">
      Questo è il tuo biglietto per accedere alla MBL Vip Lounge
    </h1>
  </div>
  <div grid="12" class="u-text-center">
    <p>Stampa questa pagina o <strong>scarica la nostra app</strong> per visualizzare il tuo ingresso dal tuo smartphone</p>
  </div>
</div>

<div grid="grid" class="u-px-space-24">
  <div grid="12" class="u-text-center">
    <a href="#"><img src="{{ path "/images/print-assets/badge_appstore_it-raster.png" }}" alt="Scarica su App Store" height="40" /></a>
    <a href="#" class="u-ml-space-16"><img src="{{ path "/images/print-assets/Google_Play_Store_badge_IT-raster.png" }}" alt="Disponibile su Google Play" height="40" /></a>
  </div>
</div>

{{!-- Parking item --}}
<div grid="grid 12" class="u-px-space-24 u-mt-space-48">
  <div grid="grid vertical-center" class="u-bg-color-soft-100" style="border: 1px solid #D0D7DF">
    <div grid="2@md" class="u-p-space-16 u-text-center">
      <img src="{{ path "/images/print-assets/mbl-raster.png" }}" alt="Marconi Business Lounge" width="90" />
    </div>
    <div grid="7@md" class="u-p-space-16" style="border-right: 1px solid #D0D7DF; border-left: 1px solid #D0D7DF">
      <div>
        {{> @rounded-label parking-status-label }}
        {{> @rounded-label parking-code-label }}
      </div>
      <div class="u-d--f u-my-space-16">
        <div class="u-pr-space-12">{{> @time-detail mbl-entrance }}</div>
        <div class="u-pl-space-12">{{> @time-detail--simple mbl-passengers }}</div>
      </div>
    </div>
    <div grid="3@md" class="u-p-space-16 u-text-center">
      <p class="u-typo-level-0">TOTALE</p>
      <p class="u-typo-level-4"><strong>€ 61,00</strong></p>
    </div>
  </div>
</div>
{{!-- End parking item --}}

<div grid="grid vertical-center" class="u-px-space-24 u-mt-space-48">
  <div grid="12">
    <p class="u-typo-level-4 u-color-night-100 u-typo-weight-semibold">
      Informazioni importanti
    </p>
  </div>
</div>

<div grid="grid" class="u-p-space-24 u-mt-space-12">
  <div grid="12" class="u-bg-color-sky-10 u-p-space-24 u-color-night-100">
    <div>
      <p><strong>ORARI DI APERTURA</strong></p>
      <p>I nostri attuali orari di apertura sono: tutti i giorni dalle 5:00 alle 21:00</p>
    </div>
    
    <div class="u-mt-space-24">
      <p><strong>COME ACCEDERE</strong></p>
      <ul class="c-list--bulleted">
        <li>L’ingresso alla MBL Vip Lounge è situato al 1° piano, prima di entrare ai controlli di sicurezza. Segui la segnaletica Business Lounge</li>
        <li><strong>Consegna i tuoi bagagli da stiva prima di accedere alla MBL Vip Lounge</strong>.
          Per garantire il massimo comfort ai nostri ospiti, non è possibile accedere ad MBL Vip Lounge con bagagli da stiva.
          Ti ricordiamo quindi di effettuare la consegna del tuo bagaglio da stiva ai check-in situati nell’area Partenze al Piano Terra dell’Aerostazione.</li>
      </ul>
    </div>
    
    <div class="u-mt-space-24">
      <p><strong>COME RICHIEDERE LA FATTURA DEL TUO INGRESSO VIP LOUNGE</strong></p>
      <ul class="c-list--bulleted">
        <li>Se decidi <strong>di pagare in Aereoporto</strong> puoi richiedere la fattura al tuo ingresso in MBL Vip Lounge</li>
        <li>Se decidi di <strong>pagare online</strong> la fattura è automatica e ti sarà inviata via e-mail.</li>
      </ul>
    </div>
  </div>
</div>
 
{
  "parking-status-label": {
    "text": "Pagato",
    "modifier": "c-rounded-label--positive"
  },
  "parking-code-label": {
    "text": "CODICE <strong>1102935</strong>",
    "modifier": "c-rounded-label--grey"
  },
  "mbl-entrance": {
    "modifier": "c-time-detail--raw",
    "time-detail-icon": {
      "symbol": "ic_flight_takeoff_black_24px",
      "class": "c-icon"
    },
    "datetime-label": "Data di ingresso",
    "datetime-day": "15",
    "datetime-month": "11",
    "datetime-year": "2023"
  },
  "mbl-passengers": {
    "modifier": "c-time-detail--raw",
    "icon": {
      "symbol": "ic-man-black-24px",
      "class": "c-icon"
    },
    "label": "Ingressi",
    "text": "3"
  },
  "suggestion-qrcode": {
    "modifier": "c-suggestion--tutorial-roommate",
    "hasImage": true,
    "img-src": "/images/svgs/qr-code-example.svg",
    "text": "<strong>Il QR code non viene letto oppure non hai il QR code con te?</strong><p>Potrai contattare la nostra assistenza (h.24), premendo, sulla colonnina di entrata del parcheggio, il tasto con il simbolo della cornetta telefonica.</p>"
  },
  "warnings": {
    "warnings": [
      {
        "modifier": "c-media--warning",
        "img-src": "/images/svgs/tolls.svg",
        "img-alt": "Telepedaggi Telepass e UnipolMove",
        "img-width": "110",
        "body": "<strong>Viaggi con un dispositivo per il telepedaggio?</strong><br>Se hai un Telepass o un UnipolMove a bordo non entrare nei varchi d'ingresso dedicato, oppure, disattiva il servizio parcheggi attraverso le specifiche app. In caso di utilizzo del dispositivo, la prenotazione che hai fatto non potrà essere riconosciuta e verrà applicata la tariffa ordinaria.<div><a href=\"#\">Maggiori informazioni su Telepass</a></div><div><a href=\"#\">Maggiori informazioni su UnipolMove</a></div>"
      }
    ]
  }
}

No notes defined.