JSFiddle - React, Tailwind, and code Playground

by Leonam, Carlos

HTML

<div class="content-s">
  <div class="box--no-padding">
      <div class="item-preview -preview-live">
        
             

    <a target="_blank" href="/item/xavier-php-login-script-user-management/full_screen_preview/9146226"><img alt="Xavier - PHP Login Script &amp; User Management Admin Panel - CodeCanyon Item for Sale" srcset="https://codecanyon.img.customer.envatousercontent.com/files/242733520/xavier-codecanyon-topbanner01-590-300-2.png?auto=compress%2Cformat&amp;fit=crop&amp;crop=top&amp;max-h=8000&amp;max-w=590&amp;s=ee653c3f01a878bc74d339a5a4f0dca5 590w, https://codecanyon.img.customer.envatousercontent.com/files/242733520/xavier-codecanyon-topbanner01-590-300-2.png?auto=compress%2Cformat&amp;fit=crop&amp;crop=top&amp;max-h=6780&amp;max-w=500&amp;s=9b685a27b93f718875e07d5c5cf11005 500w, https://codecanyon.img.customer.envatousercontent.com/files/242733520/xavier-codecanyon-topbanner01-590-300-2.png?auto=compress%2Cformat&amp;fit=crop&amp;crop=top&amp;max-h=5424&amp;max-w=400&amp;s=ebe1c2e6b07222c7dbc6fa5ca7539062 400w, https://codecanyon.img.customer.envatousercontent.com/files/242733520/xavier-codecanyon-topbanner01-590-300-2.png?auto=compress%2Cformat&amp;fit=crop&amp;crop=top&amp;max-h=4068&amp;max-w=300&amp;s=7d2ae697c514f24fc85ddd79e4070f7a 300w" sizes="(min-width: 1024px) 590px, (min-width: 1px) 100vw, 600px" src="https://codecanyon.img.customer.envatousercontent.com/files/242733520/xavier-codecanyon-topbanner01-590-300-2.png?auto=compress%2Cformat&amp;fit=crop&amp;crop=top&amp;max-h=8000&amp;max-w=590&amp;s=ee653c3f01a878bc74d339a5a4f0dca5"></a>
  <div class="js- item-preview-image__gallery" data-title="Xavier - PHP Login Script &amp; User Management Admin Panel - CodeCanyon Item for Sale Screenshots Gallery" data-url="xavier-php-login-script-user-management/screenshots/modal/9146226">
      <a class="is-hidden" href="https://s3.envato.com/files/242733523/edit_user.PNG">edit_user.PNG</a>      <a class="is-hidden"...