[MD settings] converting settings_dialog.css to style-module

This CL moves code around without changing the user UI
experience.  This removes a deprecated method importing
css.

BUG=589630

Review URL: https://codereview.chromium.org/1738313002

Cr-Commit-Position: refs/heads/master@{#378075}

7 files changed, 93 insertions, 83 deletions

diff --git a/chrome/browser/resources/settings/on_startup_page/startup_urls_page.html b/chrome/browser/resources/settings/on_startup_page/startup_urls_page.html
index 8b1b380..9cee7d9 100644
--- a/chrome/browser/resources/settings/on_startup_page/startup_urls_page.html
+++ b/chrome/browser/resources/settings/on_startup_page/startup_urls_page.html
@@ -1,12 +1,13 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog/paper-dialog.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
+<link rel="import" href="chrome://md-settings/settings_dialog_css.html">
 <link rel="import" href="chrome://md-settings/settings_shared_css.html">
 
 <dom-module id="settings-startup-urls-page">
-  <link rel="import" type="css" href="chrome://md-settings/settings_dialog.css">
   <link rel="import" type="css" href="on_startup_shared.css">
   <template>
+    <style include="settings-dialog"></style>
     <style include="settings-shared"></style>
     <div class="list-frame vertical-list">
       <template is="dom-repeat" items="[[startupPages_]]">
diff --git a/chrome/browser/resources/settings/reset_page/powerwash_dialog.html b/chrome/browser/resources/settings/reset_page/powerwash_dialog.html
index 82b07e5..ef43287 100644
--- a/chrome/browser/resources/settings/reset_page/powerwash_dialog.html
+++ b/chrome/browser/resources/settings/reset_page/powerwash_dialog.html
@@ -4,11 +4,12 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-checkbox.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog/paper-dialog.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
+<link rel="import" href="chrome://md-settings/settings_dialog_css.html">
 
 <dom-module id="settings-powerwash-dialog">
-  <link rel="import" type="css" href="chrome://md-settings/settings_dialog.css">
   <link rel="import" type="css" href="reset_page_dialog.css">
   <template>
+    <style include="settings-dialog"></style>
     <paper-dialog modal id="dialog">
       <div id="dialog-content">
         <div class="top-row">
diff --git a/chrome/browser/resources/settings/reset_page/reset_profile_dialog.html b/chrome/browser/resources/settings/reset_page/reset_profile_dialog.html
index 9be9d87..23abc23 100644
--- a/chrome/browser/resources/settings/reset_page/reset_profile_dialog.html
+++ b/chrome/browser/resources/settings/reset_page/reset_profile_dialog.html
@@ -5,12 +5,13 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog/paper-dialog.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-spinner/paper-spinner.html">
+<link rel="import" href="chrome://md-settings/settings_dialog_css.html">
 
 <dom-module id="settings-reset-profile-dialog">
-  <link rel="import" type="css" href="chrome://md-settings/settings_dialog.css">
   <link rel="import" type="css" href="reset_page_dialog.css">
   <link rel="import" type="css" href="reset_profile_dialog.css">
   <template>
+    <style include="settings-dialog"></style>
     <paper-dialog modal id="dialog">
       <div id="dialog-content">
         <div class="top-row">
diff --git a/chrome/browser/resources/settings/search_engines_page/search_engine_dialog.html b/chrome/browser/resources/settings/search_engines_page/search_engine_dialog.html
index cc5ff00..f49c543 100644
--- a/chrome/browser/resources/settings/search_engines_page/search_engine_dialog.html
+++ b/chrome/browser/resources/settings/search_engines_page/search_engine_dialog.html
@@ -6,10 +6,11 @@
 <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-input/paper-input.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
+<link rel="import" href="chrome://md-settings/settings_dialog_css.html">
 
 <dom-module id="settings-search-engine-dialog">
-  <link rel="import" type="css" href="chrome://md-settings/settings_dialog.css">
   <template>
+    <style include="settings-dialog"></style>
     <paper-dialog modal id="dialog">
       <div id="dialog-content">
         <div class="top-row">
diff --git a/chrome/browser/resources/settings/settings_dialog.css b/chrome/browser/resources/settings/settings_dialog.css
deleted file mode 100644
index 4d72f16..0000000
--- a/chrome/browser/resources/settings/settings_dialog.css
+++ /dev/null
@@ -1,77 +0,0 @@
-/* Copyright 2015 The Chromium Authors. All rights reserved.
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file. */
-
-/**
- * @fileoverview
- * Common dialog styles for Material Design settings.
- */
-
-paper-dialog {
-  min-width: 500px;
-  max-width: 800px;
-}
-
-#dialog-content {
-  -webkit-padding-end: 0;
-  -webkit-padding-start: 0;
-  margin-bottom: 0;
-  margin-top: 0;
-}
-
-paper-dialog .top-row {
-  align-items: center;
-  border-bottom: 1px solid gainsboro;
-  display: flex;
-  padding-bottom: 5px;
-  padding-top: 5px;
-}
-
-paper-dialog .title {
-  flex: 1;
-  font-size: 1.13em;
-}
-
-paper-dialog .body {
-  font-size: 1em;
-  margin: 20px 0;
-}
-
-paper-dialog .title,
-paper-dialog .body {
-  -webkit-padding-end: 24px;
-  -webkit-padding-start: 24px;
-}
-
-paper-dialog .action-button {
-  -webkit-margin-start: 10px;
-  font-weight: 500;
-}
-
-paper-dialog .action-button:not([disabled]) {
-  background-color: rgb(66, 133, 244);
-  color: white;
-}
-
-paper-dialog .cancel-button {
-  color: rgb(109, 109, 109);
-  font-weight: 500;
-}
-
-paper-dialog .explanation {
-  margin-bottom: 35px;
-}
-
-paper-dialog .button-container {
-  display: flex;
-  justify-content: flex-end;
-}
-
-paper-dialog paper-button {
-  margin: 0;
-  min-width: auto;
-}
-
-paper-dialog paper-button[toggles][active] {
-  background-color: LightGray;
-}
diff --git a/chrome/browser/resources/settings/settings_dialog_css.html b/chrome/browser/resources/settings/settings_dialog_css.html
new file mode 100644
index 0000000..5c34203
--- /dev/null
+++ b/chrome/browser/resources/settings/settings_dialog_css.html
@@ -0,0 +1,83 @@
+/* Copyright 2016 The Chromium Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file. */
+
+/**
+ * @fileoverview
+ * Common dialog styles for Material Design settings.
+ */
+
+<dom-module id="settings-dialog">
+  <template>
+    <style>
+      paper-dialog {
+        max-width: 800px;
+        min-width: 500px;
+      }
+
+      #dialog-content {
+        -webkit-padding-end: 0;
+        -webkit-padding-start: 0;
+        margin-bottom: 0;
+        margin-top: 0;
+      }
+
+      paper-dialog .top-row {
+        align-items: center;
+        border-bottom: 1px solid gainsboro;
+        display: flex;
+        padding-bottom: 5px;
+        padding-top: 5px;
+      }
+
+      paper-dialog .title {
+        flex: 1;
+        font-size: 1.13em;
+      }
+
+      paper-dialog .body {
+        font-size: 1em;
+        margin: 20px 0;
+      }
+
+      paper-dialog .title,
+      paper-dialog .body {
+        -webkit-padding-end: 24px;
+        -webkit-padding-start: 24px;
+      }
+
+      paper-dialog .action-button {
+        -webkit-margin-start: 10px;
+        font-weight: 500;
+      }
+
+      paper-dialog .action-button:not([disabled]) {
+        background-color: rgb(66, 133, 244);
+        color: white;
+      }
+
+      paper-dialog .cancel-button {
+        color: rgb(109, 109, 109);
+        font-weight: 500;
+      }
+
+      paper-dialog .explanation {
+        margin-bottom: 35px;
+      }
+
+      paper-dialog .button-container {
+        display: flex;
+        justify-content: flex-end;
+      }
+
+      paper-dialog paper-button {
+        margin: 0;
+        min-width: auto;
+      }
+
+      paper-dialog paper-button[toggles][active] {
+        background-color: LightGray;
+      }
+    </style>
+  </template>
+</dom-module>
diff --git a/chrome/browser/resources/settings/settings_resources.grd b/chrome/browser/resources/settings/settings_resources.grd
index c0e74f7..201ade7 100644
--- a/chrome/browser/resources/settings/settings_resources.grd
+++ b/chrome/browser/resources/settings/settings_resources.grd
@@ -130,8 +130,8 @@
       <structure name="IDR_SETTINGS_CR_SETTINGS_SUBHEADER_JS"
                  file="settings_page/settings_subheader.js"
                  type="chrome_html" />
-      <structure name="IDR_SETTINGS_CR_SETTINGS_DIALOG_CSS"
-                 file="settings_dialog.css"
+      <structure name="IDR_SETTINGS_CR_SETTINGS_DIALOG_CSS_HTML"
+                 file="settings_dialog_css.html"
                  type="chrome_html" />
       <structure name="IDR_SETTINGS_CR_SETTINGS_PAGE_CSS"
                  file="settings_page.css"