<?php
/**
 * Story Viewer Modal Template
 *
 * @package Storyposts
 */

defined('ABSPATH') || exit;
?>
<div id="sp-story-modal" class="sp-modal hidden">
    <canvas class="sp-modal-backdrop"></canvas>
    <div id="sp-modal-header" class="sp-modal-header">
        <img class="sp-modal-avatar" src="" alt="">
        <div class="sp-modal-user-info">
            <span class="sp-modal-name"></span>
            <span class="sp-modal-time"></span>
        </div>
        <div class="sp-close sp-modal-close" aria-label="<?php esc_attr_e( 'Close', 'storyposts' ); ?>"></div>
    </div>
    <div class="sp-modal-body">
        <div class="sp-story-indicators"></div>
        <div class="sp-story-controls"></div>
        <div class="sp-modal-media fill">
            <!-- Media gets injected here -->
        </div>
        <div class="sp-modal-info">
            <h4 class="sp-modal-title"></h4>
            <div class="sp-modal-caption"></div>
        </div>
        <div class="sp-modal-progress"></div>
    </div>
    <div class="sp-modal-nav sp-modal-prev" aria-label="<?php esc_attr_e( 'Previous', 'storyposts' ); ?>"><i class="sp-icon--arrow-left"></i></div>
    <div class="sp-modal-nav sp-modal-next" aria-label="<?php esc_attr_e( 'Next', 'storyposts' ); ?>"><i class="sp-icon--arrow-right"></i></div>
    <div class="sp-modal-footer">
        <div class="sp-footer-avatars"></div>
    </div>
</div>
