chromium/chrome/browser/resources/settings/languages_page/translate_page.html

<style include="cr-shared-style settings-shared md-select iron-flex"></style>
<settings-toggle-button id="offerTranslateOtherLanguages"
    pref="{{prefs.translate.enabled}}"
    label="$i18n{offerToEnableTranslate}"
    sub-label="$i18n{offerToEnableTranslateSublabel}"
    on-settings-boolean-control-change="onTranslateToggleChange_">
</settings-toggle-button>
<cr-collapse opened="[[prefs.translate.enabled.value]]">
  <div class="cr-row continuation">
    <div id="targetLanguageLabel" class="flex cr-padded-text"
        aria-hidden="true">
      $i18n{targetLanguageLabel}
    </div>
    <select id="targetLanguage" class="md-select"
        aria-labelledby="targetLanguageLabel"
        on-change="onTargetLanguageChange_">
      <template is="dom-repeat" items="[[languages.supported]]"
          filter="isTranslateSupported_">
        <option value="[[item.code]]"
            selected="[[translateLanguageEqual_(
                item.code, languages.translateTarget)]]">
          [[getTargetLanguageDisplayOption_(item)]]
        </option>
      </template>
    </select>
  </div>
  <div class="cr-row continuation">
    <h2 class="flex">$i18n{automaticallyTranslateLanguages}</h2>
    <cr-button id="addAlwaysTranslate" class="header-aligned-button"
        aria-label="$i18n{addAutomaticallyTranslateLanguagesAriaLabel}"
        on-click="onAddAlwaysTranslateLanguagesClick_">
      $i18n{addLanguages}
    </cr-button>
  </div>
  <div class="list-frame">
    <div id="alwaysTranslateList" class="vertical-list" role="list">
      <template is="dom-repeat" items="[[languages.alwaysTranslate]]"
          sort="alphabeticalSort_" filter="hasDisplayName_">
        <div class="list-item" role="listitem">
          <div class="start cr-padded-text">[[item.displayName]]</div>
          <cr-icon-button class="icon-delete-gray"
              aria-label="[[i18n('removeAutomaticLanguageAriaLabel',
                            item.displayName)]]"
              on-click="onRemoveAlwaysTranslateLanguageClick_"
              title="$i18n{delete}">
          </cr-icon-button>
        </div>
      </template>
    </div>
    <div id="noAlwaysTranslateLabel" class="list-item" role="listitem"
        hidden$="[[hasSome_(languages.alwaysTranslate)]]">
      $i18n{noLanguagesAdded}
    </div>
  </div>
  <div class="cr-row continuation">
    <h2 class="flex">$i18n{neverTranslateLanguages}</h2>
    <cr-button id="addNeverTranslate" class="header-aligned-button"
        aria-label="$i18n{addNeverTranslateLanguagesAriaLabel}"
        on-click="onAddNeverTranslateLanguagesClick_">
      $i18n{addLanguages}
    </cr-button>
  </div>
  <div class="list-frame">
    <div id="neverTranslateList" class="vertical-list" role="list">
      <template is="dom-repeat" items="[[languages.neverTranslate]]"
          sort="alphabeticalSort_" filter="hasDisplayName_">
        <div class="list-item" role="listitem">
          <div class="start cr-padded-text">[[item.displayName]]</div>
          <cr-icon-button class="icon-delete-gray" value="[[item.code]]"
              disabled="[[hasLength_(languages.neverTranslate, 1)]]"
              aria-label="[[i18n('removeNeverLanguageAriaLabel',
                            item.displayName)]]"
              on-click="onRemoveNeverTranslateLanguageClick_"
              title="$i18n{delete}">
          </cr-icon-button>
        </div>
      </template>
    </div>
    <div id="noNeverTranslateLabel" class="list-item" role="listitem"
        hidden$="[[hasSome_(languages.neverTranslate)]]">
      $i18n{noLanguagesAdded}
    </div>
  </div>
</cr-collapse>
<template is="dom-if" if="[[showAddAlwaysTranslateDialog_]]" restamp>
  <settings-add-languages-dialog languages="[[addLanguagesDialogLanguages_]]"
      language-helper="[[languageHelper]]" id="alwaysTranslateDialog"
      on-close="onAlwaysTranslateDialogClose_"
      on-languages-added="onAlwaysTranslateLanguagesAdded_">
  </settings-add-languages-dialog>
</template>
<template is="dom-if" if="[[showAddNeverTranslateDialog_]]" restamp>
  <settings-add-languages-dialog languages="[[addLanguagesDialogLanguages_]]"
      language-helper="[[languageHelper]]" id="neverTranslateDialog"
      on-close="onNeverTranslateDialogClose_"
      on-languages-added="onNeverTranslateLanguagesAdded_">
  </settings-add-languages-dialog>
</template>