[MD settings] hide scrollbar during animation to subpage

chrome/browser/resources/settings/basic_page/basic_page.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="../appearance_page/appearance_page.html">
 <link rel="import" href="../controls/settings_idle_render.html">
 <link rel="import" href="../lazy_load.html">
 <link rel="import" href="../on_startup_page/on_startup_page.html">
 <link rel="import" href="../people_page/people_page.html">
 <link rel="import" href="../reset_page/reset_profile_banner.html">
 <link rel="import" href="../search_page/search_page.html">
 <link rel="import" href="../settings_page/main_page_behavior.html">
 <link rel="import" href="../settings_page/settings_page_visibility.html">
@@ skipping 10 matching lines @@
 
 <if expr="not chromeos">
 <link rel="import" href="../default_browser_page/default_browser_page.html">
 </if>
 
 <!-- TODO(michaelpg): Rename to something better than "basic" now that this page
      includes both the basic and advanced settings. -->
 <dom-module id="settings-basic-page">
   <template>
     <style include="settings-page-styles">
+      :host([is-subpage-animating]) {
+        /* Prevent an unwanted horizontal scrollbar when transitioning back from
+         * a sub-page. */
+        overflow: hidden;
+      }
+
       #advancedToggle {
         --paper-button: {
           text-transform: none;
         }
         @apply(--settings-actionable);
         align-items: center;
         display: flex;
         margin-bottom: 3px;
         margin-top: 12px;  /* Part of a 48px spacer (33px + 12px + 3px). */
         min-height: 32px;
@@ skipping 219 matching lines @@
                 section="reset">
               <settings-reset-page></settings-reset-page>
             </settings-section>
           </template>
         </div>
       </template>
     </template>
   </template>
   <script src="basic_page.js"></script>
 </dom-module>