MD Settings: replace paper-material with paper-material-shared-styles

chrome/browser/resources/settings/settings_page/settings_section_css.html

Index: chrome/browser/resources/settings/settings_page/settings_section_css.html
diff --git a/chrome/browser/resources/settings/settings_page/settings_section_css.html b/chrome/browser/resources/settings/settings_page/settings_section_css.html
new file mode 100644
index 0000000000000000000000000000000000000000..8ab32eb245a6735d8737aef01f4e700335c195ca
--- /dev/null
+++ b/chrome/browser/resources/settings/settings_page/settings_section_css.html
@@ -0,0 +1,49 @@
+<link rel="import" href="chrome://resources/html/polymer.html">
+
+<dom-module id="settings-section-styles">
+  <template>
+    <style>
+      :host {
+        display: flex;
+        flex-direction: column;
+        position: relative;
+      }
+
+      #header {
+        margin-bottom: 12px;
+      }
+
+      #header .title {
+        color: rgb(104, 113, 116);

[dschuyler, 2016/05/04 22:23:39]

Is this a paper or google color? Can we use
a var(--foo-color-000) here?

If it's a custom color that was requested by
Alan, please add a comment to that effect.

[michaelpg, 2016/05/04 22:25:22]

No idea, this is a copy-paste from a .css file.

[dschuyler, 2016/05/04 22:37:46]

Okay, yeah, it's a custom color. Please make comment
about it being a custom color requested by UX/Alan.

[michaelpg, 2016/05/05 13:36:49]

Done.

+        font-size: 13px;
+        font-weight: 500;
+      }
+
+      #card {
+        background-color: white;
+        overflow: hidden;
+      }
+
+      #card {
+        flex: 1;
+      }
+
+      :host(.expanded) {
+        margin-bottom: 0;
+      }
+
+      :host(.expanded) #header {
+        display: none;
+      }
+
+      :host(.frozen) #card {
+        position: fixed;
+        width: 100%;
+      }
+
+      :host(.expanded.frozen) #card {
+        position: relative;
+      }
+    </style>
+  </template>
+</dom-module>