<div class="page-approval-container">
	<div class="approval-status-badge
		{{#isPageApproved}}approved-badge{{/isPageApproved}}
		{{^isPageApproved}}unapproved-badge{{/isPageApproved}}
		{{#canApprove}}cursor-pointer{{/canApprove}}">
		<div class="status-icon"></div>
		<div class="approved-status-text {{^isPageApproved}}display-none{{/isPageApproved}}">{{statusApproved}}</div>
		<div class="approved-status-text {{#isPageApproved}}display-none{{/isPageApproved}}">{{statusNotApproved}}</div>
		{{#canApprove}}
			<div class="approval-dropdown display-none">
				<button id="unapproveButton" class="dropdown-item {{^isPageApproved}}display-none{{/isPageApproved}}">
					<span class="unapprove-icon"></span>
					{{unapproveButtonText}}
				</button>
				<button id="approveButton" class="dropdown-item {{#isPageApproved}}display-none{{/isPageApproved}}">
					<span class="checkmark-icon"></span>
					{{approveButtonText}}
				</button>
			</div>
			<span class="dropdown-icon {{#isPageApproved}}approved{{/isPageApproved}}">
			</span>
		{{/canApprove}}
		<div class="approval-status-tooltip {{^isPageApproved}}display-none{{/isPageApproved}}">
			<small class="approver-details {{^isPageApproved}}display-none{{/isPageApproved}}">
				{{approvedPageText}}
			</small>
		</div>
	</div>
	<div class="approver-details {{^isPageApproved}}display-none{{/isPageApproved}}">
		<small class="convert-timestamp page-approval-text-muted">
			{{approvalTimestamp}}
		</small>
	</div>
</div>
