Replace Manage Languages with dialog and dropdown item

chrome/browser/resources/settings/languages_page/add_languages_dialog.html

Index: chrome/browser/resources/settings/languages_page/add_languages_dialog.html
diff --git a/chrome/browser/resources/settings/languages_page/add_languages_dialog.html b/chrome/browser/resources/settings/languages_page/add_languages_dialog.html
new file mode 100644
index 0000000000000000000000000000000000000000..1d52ea16af7396681d63ba57c73066766bb8c898
--- /dev/null
+++ b/chrome/browser/resources/settings/languages_page/add_languages_dialog.html
@@ -0,0 +1,59 @@
+<link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html">
+<link rel="import" href="chrome://resources/html/polymer.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-checkbox.html">
+<link rel="import" href="/languages_page/languages.html">
+<link rel="import" href="/settings_shared_css.html">
+
+<dom-module id="settings-add-languages-dialog">

[michaelpg, 2016/08/22 20:33:17]

Largely a copy of manage_languages_page.html, if you're wondering where these
styles come from.

+  <template>
+    <style include="settings-shared">
+      dialog {
+        display: flex;
+        flex-direction: column;
+      }
+
+      .body {
+        display: flex;
+        flex-direction: column;
+        max-height: 250px;
+        overflow: auto;
+      }
+
+      .ripple-padding {
+        /* Create a little extra space for checkbox ink ripple to flow into. */
+        padding-left: 20px;
+      }
+    </style>
+    <dialog is="cr-dialog" id="dialog">
+      <div class="title">$i18n{addLanguagesDialogTitle}</div>
+      <div class="body">
+        <!-- TODO(michaelpg): Dynamic language search/filtering. -->
+        <iron-list class="ripple-padding" scroll-target="[[$$('.body')]]"
+            items="[[getAvailableLanguages_(
+                languages.supported, languages.enabled.*)]]">
+          <template>
+            <paper-checkbox class="list-item" checked="[[willAdd_(item.code)]]"
+                title$="[[item.nativeDisplayName]]"
+                on-change="onLanguageCheckboxChange_">
+              [[item.displayName]]
+            </paper-checkbox>
+          </template>
+        </iron-list>
+      </div>
+      <div class="button-container">
+        <div class="action-buttons">
+          <paper-button class="cancel-button" on-tap="onCancelButtonTap_">
+            $i18n{cancel}
+          </paper-button>
+          <paper-button class="action-button" on-tap="onActionButtonTap_"
+              disabled="[[disableActionButton_]]">
+            $i18n{add}
+          </paper-button>
+        </div>
+      </div>
+    </dialog>
+  </template>
+  <script src="add_languages_dialog.js"></script>
+</dom-module>