Merge pull request #137 from PolymerElements/polish

iron-component-page polish of the day

README.md

@@ -79,6 +79,17 @@ server mount point (e.g. `/api/docs` or *empty string* for the root path). Note
 that this requires a host that serves the application from all paths that
 should be handled by the doc viewer.
 
+### Styling
+
+`iron-component-page` uses the default theme from
+[`iron-doc-viewer`](https://github.com/PolymerElements/iron-doc-viewer). See
+its documentation for styling. The following custom properties and mixins are
+also available:
+
+Custom property | Description | Default
+----------------|-------------|----------
+`--iron-component-page-header-color` | Background color of main header. | `paper-pink-600`
+
 ### Previous versions
 
 The 3.x `iron-component-page` described here has major breaking changes versus

iron-component-page.html

@@ -39,6 +39,7 @@
         @apply --paper-font-headline;
         color: white;
         background-color: #5a5a5a;
+        background-color: var(--iron-component-page-header-color, var(--iron-doc-accent-color1));
       }
 
       [drawer-toggle] {
@@ -51,8 +52,9 @@
 
       app-drawer {
         --app-drawer-content-container: {
-          background-color: #f9f9f9;
+          background-color: #fbfbfb;
         }
+        box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
       }
 
       iron-doc-nav {