<?php 
/* 
* Block Name: VS
* Post Type: page, post
*/
?>
<?php if (isset($block['data']['previewImage'])): ?>
    <?php do_action('block_image', __FILE__); ?>
<?php else: ?>
    <?php

    // Block helper
    require \get_template_directory() . '/template-parts/base/block-helper.php';
    if (isset($disable) && $disable) {
        return;
    }

    // Load values and assing defaults.
    $vs = get_field('vs') ?: false;
    $right = get_field('yes_position') ?: false;
?>
    <section class="section vs-section block <?php echo $className; ?>" 
        <?php if ($bgUrl): ?>
            style="background-image: url('<?php echo $bgUrl; ?>');"
            data-desktop-image="<?php echo $bgUrl; ?>"
        <?php endif; ?>
        <?php if ($mobileBgUrl): ?>
            data-mobile-image="<?php echo $mobileBgUrl; ?>"
        <?php endif; ?>
        <?php if ($sectionId): ?>
            id="<?php echo $sectionId; ?>"
        <?php endif; ?>
    >
        <div class="container">
            <?php if (is_array($vs)): ?>
                <?php foreach ($vs as $k => $v): ?>
                    <div class="row py-3 <?php echo ($k%2) ? 'bg-light' : 'bg-default'; ?>">
                        <div class="col-6 order-last <?php echo $right ? 'order-md-first' : ''; ?>">
                            <?php if ($v['is_title']): ?>
                                <h2><?php echo $v['yes']; ?></h2>
                            <?php elseif($v['is_highlighted']): ?>
                                <div class="item px-lg-3 d-md-flex align-items-center">
                                    <i class="fa fa-check icon pe-2"></i>
                                    <b><?php echo $v['yes']; ?></b>
                                </div>
                            <?php else: ?>
                                <div class="item px-lg-3 d-md-flex align-items-center">
                                    <i class="fa fa-check icon pe-2"></i>
                                    <?php echo $v['yes']; ?>
                                </div>
                            <?php endif; ?>
                        </div>
                        <div class="col-6">
                            <?php if ($v['is_title']): ?>
                                <h2><?php echo $v['no']; ?></h2>
                            <?php elseif ($v['is_highlighted']): ?>
                                <div class="item px-lg-3 d-md-flex align-items-center">
                                    <i class="fa fa-times icon pe-2"></i>
                                    <b><?php echo $v['no']; ?></b>
                                </div>
                            <?php else: ?>
                                <div class="item px-lg-3 d-md-flex align-items-center">
                                    <i class="fa fa-times icon pe-2"></i>
                                    <?php echo $v['no']; ?>
                                </div>
                            <?php endif; ?>
                        </div>
                    </div>
                <?php endforeach; ?>
            <?php endif; ?>
        </div>
    </section>
<?php endif; ?>

