MD Settings: Update spell check section to spec

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

Index: chrome/browser/resources/settings/languages_page/languages_page.html
diff --git a/chrome/browser/resources/settings/languages_page/languages_page.html b/chrome/browser/resources/settings/languages_page/languages_page.html
index 6135b9301fad03a392b9d2a2fc36a0ce2afdff74..cfa626bf722788fda77207e1aa6e44eafe41eb73 100644
--- a/chrome/browser/resources/settings/languages_page/languages_page.html
+++ b/chrome/browser/resources/settings/languages_page/languages_page.html
@@ -5,6 +5,7 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/neon-animatable.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_expand_button/cr_expand_button.html">
 <link rel="import" href="chrome://resources/cr_elements/icons.html">
 <link rel="import" href="/icons.html">
@@ -124,18 +125,18 @@
         </div>
         <iron-collapse id="spellCheckCollapse" opened="[[spellCheckOpened_]]">
           <div class="list-frame vertical-list">
-            <template is="dom-repeat"
-                items="[[spellCheckLanguages_(languages.enabled.*)]]">
+            <template is="dom-repeat" items="[[languages.enabled]]">
               <div class="list-item">
-                <div class="start">
-                  <paper-checkbox
-                      checked="[[item.spellCheckEnabled]]"
-                      on-change="onSpellCheckChange_">
+                <label class="start">
+                  <span disabled$="[[!item.language.supportsSpellcheck]]">
                     [[item.language.displayName]]
-                  </paper-checkbox>
-                </div>
-                <paper-icon-button icon="cr:settings"
-                    on-tap="onShowLanguageDetailTap_"></paper-icon-button>
+                  </span>
+                  <paper-toggle-button
+                      checked="[[item.spellCheckEnabled]]"
+                      on-change="onSpellCheckChange_"
+                      disabled$="[[!item.language.supportsSpellcheck]]">
+                  </paper-toggle-button>
+                </label>

[dschuyler, 2016/06/10 21:49:46]

.start in the .settings-box is referring to the 
'stuff on the left' in LTR (or on the right in RTL).
I'm hoping to keep that in the lists.

To be more consistent with the settings-box .start
Please make the .start be expanding flex part and move
the toggle button outside of start. e.g.
<label class="start">
  <span ...
  </span>
</label>
<paper-toggle-button ...
</paper-toggle-button>

[michaelpg, 2016/06/20 19:55:37]

alright, i moved the paper-toggle-button outside the <label>. that required
dynamically setting the label ID.

               </div>
             </template>
             <div class="list-item list-button" on-tap="onEditDictionaryTap_">