JSFiddle - React, Tailwind, and code Playground
by András Parditka
HTML
<div id="app">
Loading...
</div>
<div id="modals">
</div>
CSS
.modal {
position: absolute;
top: 10px;
bottom: 10px;
left: 10px;
right: 10px;
background: white;
border: 1px solid black;
}
JavaScript
const data = {
isOpen: false
}
const Portal = {
}
const AppComp = {
view: () => {
return (
[
m('button[type=button]', {onclick: () => {data.isOpen = true}},
'Click me!'
),
data.isOpen && (
m('div.modal', {onclick: () => {data.isOpen = false}},
'I\'m here!'
)
)
]
)
}
}
m.mount(document.getElementById('app'), AppComp)