photon
photon copied to clipboard
Modal component
There should be a simple modal component. This would be used in the current window instead of popping a new window.
@connors How about just styling the already-available HTML5 <dialog> element? That way the project can stay CSS-only - <dialog> already provides JS methods for .showModal() and .close(), and supports backdrop styling and keyboard shortcuts.
Here's a working demo (I keep doing this):
http://jsfiddle.net/developit/ymx5qev6/

Here's the CSS (because no new markup is needed):
dialog {
padding: 0;
border: 1px solid #bebebe;
border-radius: 6px;
box-shadow: 0 0 30px rgba(0,0,0,.1);
overflow: hidden;
/* if you want a non-default backdrop: */
&::backdrop {
background: rgba(0,0,0,.2); /* the default is rgba(0,0,0,.1) */
}
}