<?php
$smartModalComponent = ['devices' => isset($_GET['devices']) ? $_GET['devices'] : 'mobile,tablet,desktop'];
?>
<aside class="smart-modal" v-bind:class="{'is-closing': isClosing, 'is-visible': isVisible}" data-component="smartModal" data-hours-delay="24" data-devices-types="<?= $smartModalComponent['devices'] ?>">
    <div class="smart-modal-overlay" v-on:click.self="close">
        <div class="smart-modal-container">
            <div class="smart-modal-dialog">
                <picture class="smart-modal-dialog-picture">
                    <source media="@@MQ_DESKTOP" srcset="img/components/SMART-MODAL/image-desktop.jpg">
                    <source media="@@MQ_TABLET" srcset="img/components/SMART-MODAL/image-tablet.jpg">
                    <source media="@@MQ_MOBILE_LANDSCAPE" srcset="img/components/SMART-MODAL/image-mobile-landscape.jpg">
                    <source media="@@MQ_MOBILE" srcset="img/components/SMART-MODAL/image-mobile.jpg">
                    <img class="smart-modal-dialog-picture-image" alt="">
                </picture>
                <div class="smart-modal-dialog-buttons">
                    <a class="smart-modal-dialog-button button-golden" href="TP13-presentation-app.php">DÉCOUVRIR L'APPLI</a>
                </div>
                <button class="smart-modal-dialog-close" type="button" v-on:click="close">╳</button>
            </div>
        </div>
    </div>
</aside>
