<style include="cr-icons cros-color-overrides">
.template-container {
display: flex;
flex-direction: column;
height: 100%;
justify-content: flex-start;
position: relative;
width: 100%;
}
.title-bar {
background-color: transparent;
border-top-left-radius: 11px;
border-top-right-radius: 11px;
height: 36px;
position: absolute;
width: 600px;
/* Allows title bar to be superimposed on top of content-container */
z-index: 2;
}
#closeButton {
margin: 2px 2px 2px 566px;
}
.content-container {
display: flex;
height: 100%;
position: absolute;
width: 100%;
z-index: 1;
}
.main {
height: 100%;
width: 100%;
}
</style>
<div class="template-container">
<div class="title-bar">
<cr-icon-button id="closeButton" class="icon-clear"
title="$i18n{closeButtonTitle}" aria-label="$i18n{closeButtonTitle}"
on-click="onParentAccessDialogClosed">
</cr-icon-button>
</div>
<div class="content-container">
<div class="main">
<slot name="main"></slot>
</div>
</div>
</div>