Modal Transfer: Express

The class -transferInfoShown is added to the modal itself, to show the message, once the transfer's state has been determined.

The transfer modal has a base -transfer modifier applied to it.

<div class="sds-modal modal fade -transfer -transferInfoShown" id="" aria-hidden="true" tabindex="-1">
    <div class="sds-modal__dialog modal-dialog modal-dialog-centered modal-sm">
        <div class="sds-modal__content modal-content">

            <div class="sds-modal__header modal-header">

                <div class="embed-responsive embed-responsive-4by3">
                    <div class="embed-responsive-item">
                        <!-- adapt animation on each transfer state change -->
                        <div class="lottie lottie-transfer-anim-all--express" data-lottie-anim></div>
                    </div>
                </div>

            </div>

            <div class="sds-modal__reveal">

                <div class="sds-modal__body modal-body">

                    <div class="modal-reveal">
                        <!-- Virement Info Message Start -->
                        <div class="modal-body text-center">

                            <div class="h3">Virement effectué avec succès</div>
                            <p>Votre ordre de virement a été enregistré sous le numéro de référence S-NET :
                                0048-005487</p>

                        </div>
                    </div>

                </div>

                <div class="sds-modal__footer modal-footer justify-content-center">

                    <ul class="sds-btnGroup">
                        <li>
                            <button type="button" class="sds-btn -btnPrimary" data-dismiss="modal">

                                <span class="sds-btn__text">Fermer</span>

                            </button>
                        </li>
                    </ul>

                </div>

            </div>

        </div>
    </div>
</div>
 
{% extends "@snet-modal-base-frame" %}
{% block header %}
	<div class="embed-responsive embed-responsive-4by3">
		<div class="embed-responsive-item">
			<!-- adapt animation on each transfer state change -->
			{% render "@snet-"+modalVirementStateAnim %}
		</div>
	</div>
{% endblock %}
{% block body %}
	<div class="modal-reveal">
		<!-- Virement Info Message Start -->
		<div class="modal-body text-center">
			{% if success %}
				<div class="h3">Virement effectué avec succès</div>
				<p>Votre ordre de virement a été enregistré sous le numéro de référence S-NET :
					0048-005487</p>
			{% elseif error %}
				<div class="h3">Erreur lors du virement</div>
				<p>Votre ordre de virement a été enregistré sous le numéro de référence S-NET :
					0048-005487</p>
			{% endif %}
		</div>
	</div>
{% endblock %}
{% block footer %}
	<ul class="{{ namespace }}btnGroup">
		<li>
			{% render "@btn-primary",{
				text: "Fermer",
				attrs:{
					"data-dismiss":"modal"
				}
			},true %}
		</li>
	</ul>
{% endblock %}