JSFiddle - React, Tailwind, and code Playground

by fredd man

HTML

<link rel="stylesheet" href="https://embed-ssl.wistia.com/deliveries/405cc5f90e34c16ecf82b1ab00d6ca88.bin?disposition=attachment&filename=style.css" type="text/css" media="all">
<script type="text/javascript" async src="https://www.google-analytics.com/analytics.js"></script>
<script src="https://embed-ssl.wistia.com/deliveries/d5dada8a0b565e5c74f08b1a43a1408f.bin?disposition=attachment&filename=cb=gapi.loaded_0" async></script> ==0
<script type="text/javascript" src="https://embed-ssl.wistia.com/deliveries/eb3db5aa2a8fb7fb818775b67e4d7bdc.bin?disposition=attachment&filename=scroller.js"></script>
<script>
window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-144276616-1'); ==$0
  </script>
 
 </script>
  <script type="text/javascript"> if(top.location!=this.location) top.location=this.location;</script> ==$0
  <script type="text/javascript" src="https://apis.google.com/js/plusone.js" gapi_processed="true"></script>
  <script type="text/javascript">
var nW,nH,oH,oW;  function zoomToggle(iWideSmall,iHighSmall,iWideLarge,iHighLarge,whichImage){    oW=whichImage.style.width;oH=whichImage.style.height;    if((oW==iWideLarge)||(oH==iHighLarge)){      nW=iWideSmall;nH=iHighSmall;    }else{      nW=iWideLarge;nH=iHighLarge;    }    whichImage.style.width=nW;whichImage.style.height=nH;  } ==$0
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){

jQuery(".contenido_tab").hide(); //Ocultar capas

jQuery("ul.tabs li:first").addClass("activa").show(); //Activar primera pestaña

jQuery(".contenido_tab:first").show(); //Mostrar contenido primera pestaña

// Sucesos al hacer click en una pestaña

jQuery("ul.tabs li a").click(function() {

    jQuery("ul.tabs li").removeClass("activa");

    jQuery(this).parent().addClass("activa");

   ...