Aeroporto di Bologna - Design System

Info utili e dati di prenotazione: Default 

<div class="c-utils">

    <div class="c-utils__item">
        <p class="title">Dati cliente</p>
        <div class="c-identity c-identity--agency">

            <div class="c-identity__info">
                <dl>
                    <dt>Nome</dt>
                    <dd>Mario</dd>
                    <dt>Cognome</dt>
                    <dd>Rossi</dd>
                    <dt>E-mail</dt>
                    <dd>mariorossi@gmail.com</dd>
                    <dt>Telefono</dt>
                    <dd>348 1234567</dd>
                </dl>
            </div>

        </div>

        <div class="c-identity c-identity--agency">

            <div class="c-identity__info">
                <dl>
                    <dt>Agenzia</dt>
                    <dd>Travel Fusion s.r.l.</dd>
                    <dt>E-mail</dt>
                    <dd>info@travelfusion.it</dd>
                    <dt>Telefono</dt>
                    <dd>338 7791227</dd>
                </dl>
            </div>

        </div>
    </div>

    <div class="c-utils__item is-double">
        <p class="title">Informazioni utili</p>
        <div class="">

            <h4>In caso di sosta prolungata</h4>
            <p>
                In caso di sosta più lunga rispetto a quella già corrisposta, l'eventualeccedenza dovrà essere pagata in aeroporto nelle modalità descritte in <a href='#'>come e dovpagare</a>.
            </p>

            <h4>Come richiedere la fattura</h4>
            <p>
                <strong>Se decidi di pagare in Aeroporto</strong>, puoi richiedere la fattura aPresidio parcheggi.<br><strong>Se decidi di pagare online</strong>, puoi richiedere la fattura soldurante l'acquisto online e ti sarà inviata via mail. Per richiedere la fattura dell’eccedenze pagatin aeroporto su soste più lunghe di quelle prenotate e già pagate online, sarà possibile richiederlpresso il Presidio parcheggi.
            </p>

            <h4>Ubicazione presidio parcheggi</h4>
            <p>
                - P1-2-3-5: il presidio è posto alla base del parcheggio multipiano P2<br>- P4: ipresidio è posto all'entrata del parcheggio
            </p>

        </div>
    </div>
</div>
 
<div class="c-utils">

  <div class="c-utils__item">
    <p class="title">Dati cliente</p>
    {{ render "@identity--agency" }}
  </div>

  <div class="c-utils__item is-double">
    <p class="title">Informazioni utili</p>
    {{ render "@parking-useful-info" }}
  </div>
</div>
 
/* No context defined. */
  • Content: 
    $utils-breakpoint: 1280px;

.c-utils {
  grid-column: main;
  margin-top: remify(24px);

  @include min-screen ( remify($utils-breakpoint) ) {
    display: flex;
  }

  .c-utils__item {

    margin-bottom: remify(24px);

    @include min-screen ( remify($utils-breakpoint) ) {
      display: flex;
      flex-direction: column;
      flex: 1 1 33%;
      margin-right: remify(16px);

      &:last-child {
        margin-right: 0;
      }

      &.is-double {
        flex: 2 1 66%;
      }

    }

    .title {
      font-size: 200%;
      text-align: left;
      color: primary(night, 100);
      margin-bottom: remify(16px);
      @include max-screen( bp(tablet) ) {
        font-size: 125%;
      }
    }

  }

}

/*------------------------------------*\
  Flight modifier
\*------------------------------------*/

.c-utils--flight {

  .c-utils__item {
    @include min-screen ( remify($utils-breakpoint) ) {
      max-width: 50%;
    }
  } 

}
  • URL: /components/raw/utils/_utils.scss
  • Filesystem Path: src/views/03-organisms/utils/_utils.scss
  • Size: 948 Bytes

No notes defined.