JSFiddle - React, Tailwind, and code Playground

by Nikhil krishnan

HTML

<!--limitless explore-case start-->
<section class="limitless-explore-case">
  
   <!-- renderSingleVideo = new function for non responsive videos-->
   <!--for 768w and above-->
   <div class="video-cover hidden-xs visible-sm">        
        <?php $contentService->renderSingleVideo("explore-case","explore case",get_stylesheet_directory_uri() . "/mous_next/assets/images/explore-case/768w.jpg", false, false) ?>
        <img class="poster-img" src="<?php echo get_stylesheet_directory_uri();?>/mous_next/assets/images/explore-case/768w.jpg" alt="explore-case">
    </div>
   
   <!--for 767w and below-->
   <div class="video-cover hidden-sm">
        <?php $contentService->renderSingleVideo("explore-case","explore case",get_stylesheet_directory_uri() . "/mous_next/assets/images/explore-case/768w.jpg", false, false) ?>
        <img class="poster-img" src="<?php echo get_stylesheet_directory_uri();?>/mous_next/assets/images/explore-case/767w.jpg" alt="explore-case">
    </div>
    
    
    <div class="btn-wrap"><button class="btn primary-btn shop-now-pp-btn">SHOP NOW</button></div>
</section>
<!--limitless explore-case end-->