[MD settings] set pref to valid slider value

chrome/browser/resources/settings/appearance_page/appearance_fonts_page.html

Index: chrome/browser/resources/settings/appearance_page/appearance_fonts_page.html
diff --git a/chrome/browser/resources/settings/appearance_page/appearance_fonts_page.html b/chrome/browser/resources/settings/appearance_page/appearance_fonts_page.html
index 53654b05069e6e44bf1a3c9ee8ebdead5643cc57..4b86188cb7ff511196b2a08bbe0d67f171da42e9 100644
--- a/chrome/browser/resources/settings/appearance_page/appearance_fonts_page.html
+++ b/chrome/browser/resources/settings/appearance_page/appearance_fonts_page.html
@@ -22,10 +22,14 @@
     <div class="settings-box">
       <div class="start">$i18n{minimumFont}</div>
       <div class="list-item"
-          style$="[[computeStyle_(
-              prefs.webkit.webprefs.minimum_font_size.value,
-              prefs.webkit.webprefs.fonts.standard.Zyyy.value)]]">
-        <span>[[prefs.webkit.webprefs.minimum_font_size.value]]</span>
+          style="
+              font-size:[[computeMinimumFontSize_(
+                  prefs.webkit.webprefs.minimum_font_size.value)]]px;
+              font-family:
+                  '[[prefs.webkit.webprefs.fonts.standard.Zyyy.value]];"

[Dan Beam, 2017/03/14 18:59:35]

only 1 single quote, does this handle font names with ' in them?

[dschuyler, 2017/03/14 19:13:12]

This is a typo, here and each font-family below. I added the closing quote. Iirc
the quotes address an issue for Windows fonts which may have a space in the name
(err, and the CSS spec calls for either quoting or escaping the font name;
quoting is simpler -- I meant that where we've seen an issue in the wild is with
Windows fonts).

Trivia: with just the leading quote, it doesn't recognize the font name and uses
the default font.

Done.

[Dan Beam, 2017/03/14 19:19:02]

i'm asking, what if the font name is

  Doesn't Work

it results in

  style="font-family: 'Doesn't Work';"

which... doesn't work ;) (I believe)

[dschuyler, 2017/03/14 20:39:33]

Good question. Since it's a change from what we were doing previously and I'd
like to separate the topics of the minimum font size and the font-family names,
I've made a new CL about the quoting at
https://codereview.chromium.org/2749873003/

+        <span>[[
+            computeMinimumFontSize_(
+                prefs.webkit.webprefs.minimum_font_size.value)]]</span>
         : $i18n{quickBrownFox}
       </div>
       <cr-slider id="minimumSizeSlider"
@@ -45,9 +49,10 @@
             </settings-dropdown-menu>
           </div>
           <div class="list-item underbar"
-              style$="[[computeStyle_(
-                  prefs.webkit.webprefs.default_font_size.value,
-                  prefs.webkit.webprefs.fonts.standard.Zyyy.value)]]">
+              style="
+                  font-size:[[prefs.webkit.webprefs.default_font_size.value]]px;
+                  font-family:
+                      '[[prefs.webkit.webprefs.fonts.standard.Zyyy.value]];"
             <span>
               [[prefs.webkit.webprefs.default_font_size.value]]:
               $i18n{quickBrownFox}
@@ -63,9 +68,10 @@
             </settings-dropdown-menu>
           </div>
           <div class="list-item underbar"
-              style$="[[computeStyle_(
-                  prefs.webkit.webprefs.default_font_size.value,
-                  prefs.webkit.webprefs.fonts.serif.Zyyy.value)]]">
+              style="
+                  font-size:[[prefs.webkit.webprefs.default_font_size.value]]px;
+                  font-family:
+                      '[[prefs.webkit.webprefs.fonts.serif.Zyyy.value]];"
             <span>
               [[prefs.webkit.webprefs.default_font_size.value]]:
               $i18n{quickBrownFox}
@@ -81,9 +87,10 @@
             </settings-dropdown-menu>
           </div>
           <div class="list-item underbar"
-              style$="{{computeStyle_(
-                  prefs.webkit.webprefs.default_font_size.value,
-                  prefs.webkit.webprefs.fonts.sansserif.Zyyy.value)}}">
+              style="
+                  font-size:[[prefs.webkit.webprefs.default_font_size.value]]px;
+                  font-family:
+                      '[[prefs.webkit.webprefs.fonts.sansserif.Zyyy.value]];"
             <span>
               [[prefs.webkit.webprefs.default_font_size.value]]:
               $i18n{quickBrownFox}
@@ -97,11 +104,12 @@
                 pref="{{prefs.webkit.webprefs.fonts.fixed.Zyyy}}"
                 menu-options="[[fontOptions_]]">
             </settings-dropdown-menu>
-           </div>
+          </div>
           <div class="list-item"
-              style$="[[computeStyle_(
-                  prefs.webkit.webprefs.default_fixed_font_size.value,
-                  prefs.webkit.webprefs.fonts.fixed.Zyyy.value)]]">
+              style="
+                  font-size:[[prefs.webkit.webprefs.default_font_size.value]]px;
+                  font-family:
+                      '[[prefs.webkit.webprefs.fonts.fixed.Zyyy.value]];"
             <span>
               [[prefs.webkit.webprefs.default_font_size.value]]:
               $i18n{quickBrownFox}