JSFiddle - React, Tailwind, and code Playground
JavaScript
enyo.kind({
kind:'enyo.Control',
name:'Page',
components:[
{kind:'onyx.Button',
content:'Popup',
ontap:'showPopup'},
{kind:'onyx.Popup',
name:'popup',
centered: true,
scrim:true,
modal: true,
autoDismiss:false,
floating: true,
style:'top: 90.5px !important;left: 60.5px !important;',
components:[
{name:'modalButton', kind:'onyx.Button', content:'Close', ontouchstart:'hidePopup', ontap:'hidePopup'}
]},
{kind:'onyx.Input',
style:'width:200px;height:200px;display:block;',
value:'big input...'}
],
create: function(){
this.inherited(arguments);
},
showPopup : function(){
this.$.popup.show();
},
hidePopup : function(s,e){
this.$.popup.hide();
e.preventDefault();
},
changeColor : function(inSender){
inSender.applyStyle('background-color', 'red');
}
});
new Page().renderInto(document.body);