JSFiddle - React, Tailwind, and code Playground

by superbDeveloper

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        
        .workflow-diagram-01
        {
            width: 170px;
            height: auto;
            background-color: #fff;
            font-size:0.6em;
            font-family: Arial;
        }
        
        .workflow-diagram-01 .workflow-diagram-phase-01
        {
            height: 73px;
            border: 1px solid #2d94f3;
            background-color:#fff;
            filter: alpha(opacity=30);
            opacity:0.3;
        }
        
        .workflow-diagram-01 .phase-active-01, .workflow-diagram-01 .phase-active-01 h3, .workflow-diagram-01 .phase-active-01 ul
        {
            background-color:#fff;
            filter: alpha(opacity=100) !important;
            opacity:1.0 !important;
        }
        
        .workflow-diagram-01 .workflow-diagram-phase-01 .phase-header-01
        {
            background-color:#2d94f3;
            color:#fff;
            margin:0;
            text-align:center;
        }
        
        .workflow-diagram-01 .workflow-diagram-phase-01 .phase-details-01
        {
            margin:0;
            list-style:none;
            padding:2px;
        }
    </style>
</head>
<body>

    <div class="workflow-diagram-01">
        <div class="workflow-diagram-phase-01 phase-active-01">
         <h3 class="phase-header-01">Workflow Phase 1</h3>
         <ul class="phase-details-01">
          <li>Phase title: User</li>
          <li>Description: Initial Data</li>
         </ul>
        </div>
        <div class="workflow-diagram-phase-01">
         <h3 class="phase-header-01">Workflow Phase 2</h3>
         <ul class="phase-details-01">
          <li>Phase title: Supervisor</li>
          <li>Description: Supervisor Capture</li>
         </ul>
        </div>
        <div...

JavaScript

$(document).ready(function(){
   
    
        
    
});