chrome/browser/resources/print_preview/new/more_settings.html

<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/cr_elements/hidden_style_css.html">
<link rel="import" href="chrome://resources/html/i18n_behavior.html">
<link rel="import" href="../metrics.html">
<link rel="import" href="strings.html">

<dom-module id="print-preview-more-settings">
  <template>
    <style include="cr-hidden-style">
      :host {
        display: block;
        margin: 10px auto 0;
      }

      :host button {
        align-items: center;
        background-color: #f6f6f6;
        background-image: none;
        --border: 1px solid #e1e1e1;
        border-bottom: var(--border);
        border-left: none;
        border-right: none;
        border-top: var(--border);
        box-shadow: none;
        cursor: pointer;
        display: flex;
        margin: auto;
        min-height: 51px;
        outline: none;
        padding: 5px 20px;
        /* sidebar width - 2px */
        width: 308px;
      }

      :host-context(.focus-outline-visible) button:focus {
        outline: -webkit-focus-ring-color auto 5px;
      }

      :host([hidden]) {
        display: none;
      }

      :host #label {
        color: var(--google-blue-700);
        flex: 1;
        text-align: left;
      }

      :host-context([dir=rtl]) #label {
        text-align: right;
      }

      :host([disabled]) #label {
        color: var(--paper-grey-600);
        opacity: .65;
      }

      :host #label:hover,
      :host #label:active {
        text-decoration: underline;
      }

      :host #icon {
        height: 25px;
        width: 25px;
      }

      :host .minus-icon {
        background-image: url(chrome://resources/images/icon_expand_less.svg);
      }

      :host .plus-icon {
        background-image: url(chrome://resources/images/icon_expand_more.svg);
      }
    </style>
    <button disabled="[[disabled]]" on-click="onMoreSettingsClick_"
        aria-expanded$="[[getAriaExpanded_(settingsExpandedByUser)]]"
        aria-label$="[[i18n('moreOptionsLabel')]]">
      <span id="label">[[getLabelText_(settingsExpandedByUser)]]</span>
      <div id="icon" class$="[[getIconClass_(settingsExpandedByUser)]]"></div>
    </button>
  </template>
  <script src="more_settings.js"></script>
</dom-module>