Dialog
<div class="dialog dialog--open">
<div class="dialog__container">
<div class="toolbar">
<div class="toolbar__title">
Dialog Title
</div>
<div class="toobar__action">
<button type="button" class="button button--icon">
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/><path d="M0 0h24v24H0z" fill="none"/></svg>
</button>
</div>
</div>
<div class="padding overflow-auto">
Dialog Content
</div>
<div class="toolbar">
<div class="toolbar__space">
</div>
<div class="toolbar__action">
<button type="button" class="button button--text">Action 1</button>
</div>
<div class="toolbar__action">
<button type="button" class="button button--text button--primary">Action 2</button>
</div>
</div>
</div>
<div class="dialog__scrim"></div>
</div>
Dialog Toggle
<button type="button" class="button button--contained button--primary" data-controller="toggle" data-toggle-target="#demo-dialog" data-toggle-action="dialog#toggle">
Toggle
</button>
<div id="demo-dialog" class="dialog" data-controller="dialog">
<div class="dialog__container">
<div class="toolbar">
<div class="toolbar__title">
Dialog Title
</div>
<div class="toobar__action">
<button type="button" class="button button--icon" data-action="dialog#close">
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/><path d="M0 0h24v24H0z" fill="none"/></svg>
</button>
</div>
</div>
<div class="padding overflow-auto">
Dialog Content
</div>
<div class="toolbar">
<div class="toolbar__space">
</div>
<div class="toolbar__action">
<button type="button" class="button button--text">Action 1</button>
</div>
<div class="toolbar__action">
<button type="button" class="button button--text button--primary">Action 2</button>
</div>
</div>
</div>
<div class="dialog__scrim" data-action="click->dialog#close"></div>
</div>