[MD settings] Scale avatar icon.

chrome/browser/resources/settings/people_page/people_page.html

 <link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.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="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/html/icon.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-collapse/iron-collapse.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-button/paper-button.html">
@@ skipping 27 matching lines @@
     <style include="settings-shared">
       setting-box.middle {
         /* Per spec, middle text is indented 20px in this section. */
         -webkit-margin-start: 20px;
       }
 
       #profile-icon {
         background-position: center;
         background-repeat: no-repeat;
         background-size: cover;
-        border-radius: 20px;
+        clip-path: circle(19px at center);

[tommycli, 2017/03/21 22:29:53]

Looks like the root cause is that the data URL image is 38x31, and not quite
centered horizontally.

Since you actually need a square, I recommend changing the call to
GetAvatarIconForWebUI within ProfileInfoHandler to GetSizedAvatarIcon, and just
specify the 40x40 image you actually want.

I think that will fix this problem, as well as the image blurriness.

In fact -- I'm not entirely sure why we even do the image scaling within C++...
it seems entirely necessary. -- but that's a sidebar.

[dschuyler, 2017/03/21 23:27:15]

That's true, it's documented in the bug (in comment #9).
 
That appears to work too. Doing the scaling c++ is ok with me if you prefer.
 
It doesn't actually. It's about the same as patch #1.
With this new change I think we are now scaling the image -- i.e. I'm not sure
if I follow. We can chat about it off-line if it's not critical to this CL.

done.

         flex-shrink: 0;
         height: 40px;
         width: 40px;
       }
 
       #managed-by-domain-name {
         font-weight: bold;
       }
 
       iron-icon[icon='settings:sync'] {
@@ skipping 364 matching lines @@
 <if expr="chromeos">
     <template is="dom-if" if="[[showEasyUnlockTurnOffDialog_]]">
       <easy-unlock-turn-off-dialog id="easyUnlockTurnOffDialog"
           on-close="onEasyUnlockTurnOffDialogClose_">
       </easy-unlock-turn-off-dialog>
     </template>
 </if>
   </template>
   <script src="people_page.js"></script>
 </dom-module>