<div class="c-voucher-partial-form">
<div class="c-voucher-partial-form__fieldset">
<p class="u-typo-level-2 u-typo-weight-bold u-mb-space-32">Per procedere al rimborso carica la seconda ricevuta del pagamento.</p>
<div class="c-form">
<div class="c-voucher-partial-form__control">
<label for="input-payment-receipt" class="is-positive" aria-label="">
Ricevuta di pagamento <span class="required-marker" aria-hidden="true">*</span>
<input id="input-payment-receipt" type="file" class="" placeholder="" value="" aria-describedby="file-note" multiple>
<p class="c-field__note " id="file-note">
File accettati: .pdf, .png, .jpg. Dimensione massima 3MB
</p>
</label>
<p class="c-field__note" id="" aria-hidden="true">
</p>
</div>
<div class="c-voucher-partial-form__control">
<label for="double-payment-textarea-field" class="" aria-label="">
Info aggiuntive:
<textarea id="double-payment-textarea-field" placeholder="" class="" rows="5" aria-describedby="double-payment-textarea-note"></textarea>
<em class="c-field__note " id="double-payment-textarea-note">
Massimo 500 caratteri
</em>
</label>
</div>
</div>
<p class="u-typo-level-1 u-mt-space-32"><sup>*</sup>Campi obbligatori</p>
</div>
<div class="c-voucher-partial-form__selection">
<p class="u-typo-level-2 u-typo-weight-bold u-color-night-120 u-my-space-24">Indica in che modo vuoi essere rimborsato.</p>
<div grid="grid">
<div grid="6@md">
<div class="c-voucher-partial-form__selection-item">
<div class="c-selection c-selection--responsive">
<div class="c-selection__img-block">
<img class="c-selection__img" src="/images/svgs/stk-voucher.svg" alt="Voucher digitale">
</div>
<div class="c-selection__text">
<strong>Voucher elettronico parcheggi</strong>
<p class="c-selection__extra-text">(Spendibile, entro un anno, per il prodotto Parcheggi del nostro e-commerce)</p>
</div>
<input class="c-selection__radio u-visuallyhidden" type="radio" name="refund-option" id="voucher-97">
<label class="c-selection__label" for="voucher-97">
<span class="u-visuallyhidden"><strong>Voucher elettronico parcheggi</strong></span>
</label>
<div class="c-selection__input"></div>
</div>
</div>
</div>
<div grid="6@md">
<div class="c-voucher-partial-form__selection-item">
<div class="c-selection c-selection--responsive">
<div class="c-selection__img-block">
<img class="c-selection__img" src="/images/svgs/stk-richiesta-rimborso.svg" alt="Riaccredito">
</div>
<div class="c-selection__text">
<strong>Riaccredito su [Carta di Credito]</strong>
<p class="c-selection__extra-text">(Accredito entro 60 giorni dalla richiesta)</p>
</div>
<input class="c-selection__radio u-visuallyhidden" type="radio" name="refund-option" id="credit-back-62">
<label class="c-selection__label" for="credit-back-62">
<span class="u-visuallyhidden"><strong>Riaccredito su [Carta di Credito]</strong></span>
</label>
<div class="c-selection__input"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-voucher-partial-form{{#if modifier}} {{ modifier }}{{/if}}">
{{!-- FIELDSET --}}
<div class="c-voucher-partial-form__fieldset">
<p class="u-typo-level-2 u-typo-weight-bold u-mb-space-32">Per procedere al rimborso carica la seconda ricevuta del pagamento.</p>
<div class="c-form">
<div class="c-voucher-partial-form__control">
{{render "@input--file" input-file-upload merge=true }}
</div>
<div class="c-voucher-partial-form__control">
{{render "@textarea" textarea merge=true }}
</div>
</div>
<p class="u-typo-level-1 u-mt-space-32"><sup>*</sup>Campi obbligatori</p>
</div>
{{!-- END FIELDSET --}}
{{!-- SELECTION --}}
<div class="c-voucher-partial-form__selection">
<p class="u-typo-level-2 u-typo-weight-bold u-color-night-120 u-my-space-24">Indica in che modo vuoi essere rimborsato.</p>
<div grid="grid">
<div grid="6@md">
<div class="c-voucher-partial-form__selection-item">
{{> @selection selection-voucher }}
</div>
</div>
<div grid="6@md">
<div class="c-voucher-partial-form__selection-item">
{{> @selection selection-credit-back }}
</div>
</div>
</div>
</div>
{{!-- END SELECTION --}}
</div>
{
"selection-voucher": {
"modifier": "c-selection--responsive",
"text": "<strong>Voucher elettronico parcheggi</strong>",
"extra-text": "(Spendibile, entro un anno, per il prodotto Parcheggi del nostro e-commerce)",
"img": {
"src": "/images/svgs/stk-voucher.svg",
"alt": "Voucher digitale"
},
"input": {
"id": "voucher",
"name": "refund-option"
}
},
"selection-credit-back": {
"modifier": "c-selection--responsive",
"text": "<strong>Riaccredito su [Carta di Credito]</strong>",
"extra-text": "(Accredito entro 60 giorni dalla richiesta)",
"img": {
"src": "/images/svgs/stk-richiesta-rimborso.svg",
"alt": "Riaccredito"
},
"input": {
"id": "credit-back",
"name": "refund-option"
}
},
"input-file-upload": {
"name": "input-payment-receipt",
"label_id": "input-payment-receipt",
"label_message": "Ricevuta di pagamento",
"atom-input": {
"id": "input-payment-receipt"
},
"note_message": "File accettati: .pdf, .png, .jpg. Dimensione massima 3MB"
},
"textarea": {
"label_id": "double-payment-textarea-field",
"label_message": "Info aggiuntive:",
"label_class": "",
"atom-textarea": {
"id": "double-payment-textarea-field",
"class": "",
"rows": "5",
"placeholder": null,
"required": false,
"hasNote": true,
"describedby": "double-payment-textarea-note"
},
"note_id": "double-payment-textarea-note",
"note_message": "Massimo 500 caratteri",
"note_class": null
}
}
.c-voucher-partial-form__fieldset {
background-color: primary(sky, 10);
color: primary(night, 120);
padding: remify(24px) remify(16px);
border-radius: remify(12px);
}
.c-voucher-partial-form__selection-item {
height: 100%;
& > .c-selection {
height: 100%;
}
}
No notes defined.