JSFiddle - React, Tailwind, and code Playground

by samonela

HTML

<link href="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/assets/skins/sam/button.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/assets/skins/sam/container.css" rel="stylesheet"/>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/yuiloader/yuiloader-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/event/event-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/connection/connection-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/dom/dom-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/animation/animation-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/dragdrop/dragdrop-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/container/container-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/element/element-min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/yui/2.9.0/button/button-min.js"></script>
<button id="open">open</button>

CSS

.yui-skin-sam .yui-panel .hd {
background: url(http://yui.yahooapis.com/2.9.0/build/assets/skins/sam/sprite.png) repeat-x 0 -200px;
}

JavaScript

var openButton = document.getElementById('open');
openButton.addEventListener('click', openClickHandler);
var config = {
		underlay: 'none',
    width: '120px',
		modal: true,
		visible: true,
		close: true
	};
function openClickHandler() {
  var content = document.createElement('div');
  content.id = 'modalContentContainer';
  
  var modalDialog = new YAHOO.widget.Panel(content, config);
  modalDialog.setBody('modal content');
  modalDialog.setHeader('header');
  modalDialog.render(document.body);
}