Create full screen dialog using angularjs

A full screen dialog can be created in case you want to show a message to the user or capture some sort of input hiding other details on the page. I have created following angular directive to create a full screen dialog. Any content that we want to include in full screen dialog, its transcluded within the directive tag.


Launch fullscreen dialog
<button>Open Dialog</button>
Creates the full screen dialog
    <div class="dialog"></div>
Holds the content of the dialog
    <div class="dialog">
        <div class="content"></div>
NOTE Id ‘dialog’ is added to body tag to find and add class to it. This can be customised to the following: eg.