use iron-demo-helpers

Zecat · Zecat · commit b7b968782f13 · 2016-01-15T02:24:25.000+01:00
diff --git a/bower.json b/bower.json
@@ -25,6 +25,7 @@
   },
   "devDependencies": {
     "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
-    "web-component-tester": "*"
+    "web-component-tester": "*",
+    "iron-demo-helpers": "PolymerElements/iron-demo-helpers#~1.0.3"
   }
 }
diff --git a/demo/index.html b/demo/index.html
@@ -14,18 +14,28 @@
     <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
     <title>paper-input-image Demo</title>
     <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+    <link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
+    <link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
+
     <link rel="import" href="../paper-input-image.html">
   </head>
   <body unresolved>
 
-    <style>
-      paper-input-image {
-        width: 300px;
-        height: 300px;
-      }
+    <style is="custom-style" include="demo-pages-shared-styles">
     </style>
-  
-    <paper-input-image></paper-input-image>
 
+    <div class="vertical-section-container centered">
+      <demo-snippet class="centered-demo">
+        <template>
+          <style>
+            paper-input-image {
+              width: 300px;
+              height: 300px;
+            }
+          </style>
+          <paper-input-image></paper-input-image>
+        </template>
+      </demo-snippet>
+    </div>
   </body>
 </html>

Original file line number	Diff line number	Diff line change
`@@ -25,6 +25,7 @@`
`25`	`25`	`},`
`26`	`26`	`"devDependencies": {`
`27`	`27`	`"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",`
`28`		`- "web-component-tester": "*"`
	`28`	`+ "web-component-tester": "*",`
	`29`	`+ "iron-demo-helpers": "PolymerElements/iron-demo-helpers#~1.0.3"`
`29`	`30`	`}`
`30`	`31`	`}`