Icons

sebs · sebs · commit 96353ba840ba · 2019-09-18T19:37:09.000+02:00
diff --git a/packages/test-app/src/test-app-app/svg-sample-icons.js b/packages/test-app/src/test-app-app/svg-sample-icons.js
@@ -0,0 +1,32 @@
+import '@polymer/iron-icon/iron-icon.js';
+import '@polymer/iron-iconset-svg/iron-iconset-svg.js';
+const $_documentContainer = document.createElement('div');
+$_documentContainer.setAttribute('style', 'display: none;');
+
+$_documentContainer.innerHTML = `<iron-iconset-svg name="svg-sample-icons" size="100">
+  <svg>
+    <defs>
+			<g id="cap">
+				<svg style="width:24px;height:24px" viewBox="0 0 24 24">
+					<path fill="#000000" d="M15,14V8H17.17L12,2.83L6.83,8H9V14H15M12,0L22,10H17V16H7V10H2L12,0M7,18H17V24H7V18M15,20H9V22H15V20Z" />
+				</svg>
+			</g>
+			<g id="volume">
+			<svg style="width:24px;height:24px" viewBox="0 0 24 24">
+    <path fill="#000000" d="M6,13H18V11H6M3,6V8H21V6M10,18H14V16H10V18Z" />
+</svg>
+			</g>
+    </defs>
+  </svg>
+</iron-iconset-svg><iron-iconset-svg name="inline" size="24">
+  <svg>
+    <defs>
+      <g id="shape">
+        <rect x="12" y="0" width="12" height="24"></rect>
+        <circle cx="12" cy="12" r="12"></circle>
+      </g>
+    </defs>
+  </svg>
+</iron-iconset-svg>`;
+
+document.head.appendChild($_documentContainer);
diff --git a/packages/test-app/src/test-app-app/test-app-app.js b/packages/test-app/src/test-app-app/test-app-app.js
@@ -12,6 +12,7 @@ import '@polymer/paper-slider/paper-slider.js'
 import '@polymer/iron-icon/iron-icon.js';
 import '@polymer/iron-icons/iron-icons.js';
 import '@polymer/paper-icon-button/paper-icon-button.js'
+import './svg-sample-icons.js'
 /**
  * @customElement
  * @polymer
@@ -48,19 +49,18 @@ class TestAppApp extends PolymerElement {
           <app-header-layout>
             <app-header fixed condenses effects="waterfall" slot="header">
             <app-toolbar>
-                <paper-icon-button icon="close"></paper-icon-button>
-                <div main-title>App name</div>
+            <div main-title>Token Explorer</div>
+              
+            </app-toolbar>
+           
+            <app-toolbar>
+                <div main-title>[[name]]</div>
+                [[_durationForIndex(duration)]] <paper-slider min="0", max="5" value="{{duration}}"></paper-slider>
                 <paper-listbox selected="{{dataset}}">
                 <template is="dom-repeat" items="{{datasets}}">
                   <paper-icon-button icon="{{_symbolForIndex(index)}}">foo</paper-icon-button>
                 </template> 
               </paper-listbox>
-           
-              </app-toolbar>
-              <app-toolbar>
-                <div main-title>[[name]] SUPPLY </div>
-                [[_durationForIndex(duration)]]
-                <paper-slider min="0", max="5" value="{{duration}}"></paper-slider>
               </app-toolbar>
               <paper-tabs selected="{{selectedToken}}" sticky>
                 <template is="dom-repeat" items="{{tokens}}">
@@ -174,7 +174,7 @@ class TestAppApp extends PolymerElement {
       datasetsIcons: {
         type: Array, 
         value: [
-          'euro-symbol', 'forward', 'fingerprint'
+          'euro-symbol', 'svg-sample-icons:cap', 'svg-sample-icons:volume'
         ]
       },
       datasets: {
