<style include="print-management-shared">
:host-context(body.jelly-enabled) #confirmationText {
font: var(--cros-body-2-font);
}
:host-context(body.jelly-enabled) cr-dialog::part(dialog) {
border-radius: 20px;
}
#buttonContainer {
display: flex;
justify-content: flex-end;
}
#clearDialog [slot=button-container] {
padding-bottom: 20px;
padding-inline-end: 24px;
padding-inline-start: 24px;
padding-top: 32px;
}
#clearDialog {
--cr-dialog-top-container-min-height: 24px;
}
#confirmationText {
color: var(--print-management-default-text-color);
font-family: var(--print-management-default-font-family);
font-size: var(--print-management-default-font-size);
font-weight: var(--print-management-default-font-weight);
overflow-wrap: break-word;
}
#cancelButton {
margin-inline-end: 8px;
}
cr-dialog::part(dialog) {
width: 350px;
}
</style>
<cr-dialog id="clearDialog">
<div slot="title">
<div id="titleText">
[[i18n('clearAllHistoryDialogTitle')]]
</div>
</div>
<div slot="body">
<div id="confirmationText">
[[i18n('clearHistoryConfirmationText')]]
</div>
</div>
<div slot="button-container">
<cr-button id="cancelButton" on-click="onCancelButtonClick">
[[i18n('cancelButtonLabel')]]
</cr-button>
<cr-button class="action-button" on-click="onClearButtonClick"
disabled="[[shouldDisableClearButton]]">
[[i18n('clearButtonLabel')]]
</cr-button>
</div>
</cr-dialog>