chrome/browser/resources/print_preview/ui/header.html

<link rel="import" href="chrome://resources/html/polymer.html">

<link rel="import" href="chrome://resources/cr_elements/cr_button/cr_button.html">
<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
<link rel="import" href="chrome://resources/html/cr.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
<link rel="import" href="../data/destination.html">
<link rel="import" href="../data/state.html">
<link rel="import" href="../icons.html">
<link rel="import" href="settings_behavior.html">
<link rel="import" href="print_preview_vars_css.html">
<link rel="import" href="strings.html">

<dom-module id="print-preview-header">
  <template>
    <style>
      :host {
        border-bottom: var(--print-preview-settings-border);
        display: block;
        padding: 20px var(--print-preview-sidebar-margin) 8px;
      }

      @media (prefers-color-scheme: light) {
        :host {
          background-color: white;
        }
      }

      .title-container {
        display: flex;
        padding-bottom: 12px;
      }

      .title {
        color: var(--cr-primary-text-color);
        font-size: calc(16/13 * 1em);
        font-weight: 400;
        line-height: 1.54em;
        margin: 0;
      }

      .summary {
        color: var(--cr-primary-text-color);
        display: block;
        height: 1em;
        min-height: 20px;
      }

      .summary b {
        font-weight: 500;
      }

      #button-strip {
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        padding-top: 16px;
      }

      #button-strip cr-button:first-child {
        margin-inline-end: 8px;
      }

      #button-strip cr-button:last-child {
        margin-inline-end: 0;
      }

      iron-icon {
        align-self: center;
        fill: var(--cr-secondary-text-color);
        height: 16px;
        margin-inline-start: 8px;
        width: 16px;
      }
    </style>
    <div class="title-container">
      <h1 class="title">$i18n{title}</h1>
      <iron-icon hidden$="[[!managed]]" icon="print-preview:business"
           alt="" title="$i18n{managedSettings}">
      </iron-icon>
    </div>
    <span class="summary" aria-label$="[[summaryLabel_]]"
        inner-h-t-m-l="[[summary_]]">
    </span>
    <div id="button-strip">
<if expr="not is_win">
      <cr-button class="cancel-button" on-click="onCancelClick_">
        $i18n{cancel}
      </cr-button>
</if>
      <cr-button class="action-button" on-click="onPrintClick_"
          disabled$="[[!printButtonEnabled_]]">
        [[printButtonLabel_]]
      </cr-button>
<if expr="is_win">
      <cr-button class="cancel-button" on-click="onCancelClick_">
        $i18n{cancel}
      </cr-button>
</if>
    </div>
  </template>
  <script src="header.js"></script>
</dom-module>