diff --git a/Playground/src/pg-sidebar.html b/Playground/src/pg-sidebar.html
index fd37284..534c83e 100644
--- a/Playground/src/pg-sidebar.html
+++ b/Playground/src/pg-sidebar.html
@@ -31,7 +31,7 @@
             </polymer-ui-submenu-item>
           </template>
         </polymer-ui-menu>
-        <polymer-ui-nav-arrow item="{{$.sampleMenu.selectedItem}}"></polymer-ui-nav-arrow>
+        <polymer-ui-nav-arrow target="{{$.sampleMenu.selectedItem}}"></polymer-ui-nav-arrow>
       </div>
       
       <polymer-ui-splitter direction="up"></polymer-ui-splitter>
diff --git a/Sandbox/lib/css/tk-app.css b/Sandbox/lib/css/tk-app.css
index 2aa6a2e..4906bbc 100644
--- a/Sandbox/lib/css/tk-app.css
+++ b/Sandbox/lib/css/tk-app.css
@@ -84,7 +84,8 @@ input[type=checkbox] {
 }
 
 #not-ide {
-  background: lightyellow;
+  background: #333;
+  color: white;
   box-sizing: border-box;
   height: 40px;
   line-height: 40px;
@@ -93,6 +94,10 @@ input[type=checkbox] {
   border-bottom: 1px solid lightgray;
 }
 
+#not-ide a {
+  color: lightblue;
+}
+
 #modeSelector > * {
   margin: 0 10px;
 }
diff --git a/Sandbox/lib/tk-app.html b/Sandbox/lib/tk-app.html
index 0bf72cd..f745af8 100755
--- a/Sandbox/lib/tk-app.html
+++ b/Sandbox/lib/tk-app.html
@@ -9,8 +9,8 @@
     <!-- <div id="not-ide"><b>Wait, is this an IDE or something?</b> Nope, Sandbox just makes it easy to get a feel for Polymer. It’s more of a convenience and not required to make apps using Polymer. <a href="http://polymer-project.org/faq.html" target="_blank">Read More</a></div> -->
     <g-toolbar>
       <g-selector id="modeSelector" selected="{{selectedMode}}">
-        <g-icon-button name="designer" src="assets/design.png"></g-icon-button>
-        <g-icon-button name="source" src="assets/code.png"></g-icon-button>
+        <g-icon-button id="designerIcon" name="designer"></g-icon-button>
+        <g-icon-button id="sourceIcon" name="source"></g-icon-button>
       </g-selector>
       <g-icon-button id="toggle" on-pointerdown="toggleSize" src="assets/fullscreen.png"></g-icon-button>
       <g-icon-button src="assets/ic_refresh_darkreg.png" on-tap="clearElement"></g-icon-button>
@@ -80,13 +80,10 @@
             this.$[this.selectedMode].asyncMethod('shown');
           }
           // update mode icons
-          this.$.modeSelector.items.forEach(function(mode) {
-            mode.src = mode.getAttribute('src');
-          });
-          var s = this.$.modeSelector.selection;
-          var src = s.getAttribute('src');
-          var i = src.lastIndexOf('.');
-          s.src = src.substring(0, i) + '_selected' + src.substring(i);
+          this.$.designerIcon.src = this.resolvePath('assets/design' + 
+              (this.selectedMode == 'designer' ? '_selected' : '') + '.png');
+          this.$.sourceIcon.src = this.resolvePath('assets/code' + 
+            (this.selectedMode == 'source' ? '_selected' : '') + '.png');
         });
       },
       designChanged: function() {
diff --git a/Sandbox/metadata.html b/Sandbox/metadata.html
index 3337511..b4934e6 100755
--- a/Sandbox/metadata.html
+++ b/Sandbox/metadata.html
@@ -1,8 +1,8 @@
-<tk-meta id="div" label="Caption" isContainer>
+<tk-meta id="g-icon-button" label="Icon Button">
   <template>
-    <div style="border: 1px dotted silver; padding: 6px;">A Caption</div>
+    <g-icon-button src="images/mail.png"></g-icon-button>
   </template>
-  <property name="textContent" kind="speech"></property>
+  <property name="src" kind="select" options="images/mail.png,images/add.png,images/comment.png,images/menu.png"></property>
 </tk-meta>
 
 <tk-meta id="g-toolbar" label="Toolbar" isContainer>
@@ -24,19 +24,23 @@
   </template>
 </tk-meta>
 
-<tk-meta id="tk-toolbar" label="Themed Toolbar" isContainer>
+<tk-meta id="div" label="Caption" isContainer>
   <template>
-    <tk-toolbar theme="toolbar-bg-0" style="height: 60px; right: 0px; left: 0px;"></tk-toolbar>
+    <div style="border: 1px dotted silver; padding: 6px;">A Caption</div>
   </template>
-  <property name="theme" kind="select" options=" ,toolbar-bg-0,toolbar-bg-1,toolbar-bg-2,toolbar-bg-3,toolbar-bg-4"></property>
+  <property name="textContent" kind="speech"></property>
 </tk-meta>
 
-<tk-meta id="g-icon-button" label="Icon Button">
+
+<!--
+<tk-meta id="tk-toolbar" label="Themed Toolbar" isContainer>
   <template>
-    <g-icon-button src="images/mail.png"></g-icon-button>
+    <tk-toolbar theme="toolbar-bg-0" style="height: 60px; right: 0px; left: 0px;"></tk-toolbar>
   </template>
-  <property name="src" kind="select" options="images/mail.png,images/add.png,images/comment.png,images/menu.png"></property>
+  <property name="theme" kind="select" options=" ,toolbar-bg-0,toolbar-bg-1,toolbar-bg-2,toolbar-bg-3,toolbar-bg-4"></property>
 </tk-meta>
+-->
+
 
 <tk-meta id="g-tabs" label="Tabs" isContainer>
   <template>
@@ -162,6 +166,15 @@
   </template>
 </tk-meta>
 
+<tk-meta id="humane-js" label="Notification">
+  <template>
+    <humane-js onclick="log()" style="border: 2px dotted gray; background-color: whitesmoke; padding: 12px;">Notification</humane-js>
+  </template>
+  <property name="theme" kind="select" options="jackedup,bigbox,boldlight,libnotify,original"></property>
+  <property name="textContent" kind="text"></property>
+</tk-meta>
+
+<!--
 <tk-meta id="ace-element" label="Ace Editor">
   <template>
     <ace-element style="border: 1px dotted silver; width: 300px; height: 200px;"></ace-element>
@@ -173,6 +186,13 @@
     <section style="background-color: whitesmoke; border: 1px solid silver; min-width: 300px; min-height: 300px;"></section>
   </template>
 </tk-meta>
+-->
+<tk-meta id="marked-js" label="Markdown Renderer">
+  <template>
+    <marked-js text="## Markdown is Awesome\n\n* List\n* Of\n* Items\n\nExample:\n        exampleCode();\n\n__Nifty__ is a _word_."></marked-js>
+  </template>
+  <property name="text" kind="text"></property>
+</tk-meta>
 
 <tk-meta id="tk-color-editor" label="Color Editor">
   <template>
@@ -193,6 +213,8 @@
   <property name="select"></property>
 </tk-meta> -->
 
+<tk-meta id="cool-clock" label="CoolClock"></tk-meta>
+
 <tk-meta id="polymer-stock" label="Stock">
   <template>
     <polymer-stock symbol="GOOG" style="background-color: #fff"></polymer-stock>
@@ -205,8 +227,6 @@
   </template>
 </tk-meta>
 
-<tk-meta id="cool-clock" label="CoolClock"></tk-meta>
-
 <tk-meta id="g-ajax" label="Ajax">
   <template>
     <g-ajax style="border: 1px dotted silver; padding: 8px;">Ajax</g-ajax>
@@ -220,23 +240,10 @@
   </template>
 </tk-meta>
 
-<tk-meta id="humane-js" label="Notification">
-  <template>
-    <humane-js onclick="log()" style="border: 2px dotted gray; background-color: whitesmoke; padding: 12px;">Notification</humane-js>
-  </template>
-  <property name="theme" kind="select" options="jackedup,bigbox,boldlight,libnotify,original"></property>
-  <property name="textContent" kind="text"></property>
-</tk-meta>
 
+<!--
 <tk-meta id="smoothie-chart" label="Smoothie Chart"></tk-meta>
 
-<tk-meta id="marked-js" label="Markdown Renderer">
-  <template>
-    <marked-js text="## Markdown is Awesome\n\n* List\n* Of\n* Items\n\nExample:\n        exampleCode();\n\n__Nifty__ is a _word_."></marked-js>
-  </template>
-  <property name="text" kind="text"></property>
-</tk-meta>
-
 <tk-meta id="pixi-js" label="Pixi-js">
   <template>
     <pixi-js style="width: 300px; height: 200px; border: 2px solid orange;"></pixi-js>
@@ -248,7 +255,7 @@
     <iframe style="width: 400px; height: 300px;" src="http://www.goodboydigital.com/runpixierun/"></iframe>
   </template>
 </tk-meta>
-
+-->
 <!-- <tk-meta id="pi-app" label="Pica">
   <template>
     <pi-app></pi-app>
@@ -265,7 +272,7 @@
 </tk-meta>
 
 <!-- x-tags -->
-
+<!--
 <tk-meta id="x-switch" label="X-Switch" hideSubtree="true">
   <template>
     <x-switch onText="✔" offText=" "></x-switch>
@@ -309,7 +316,7 @@
   <property name="name"></property>
   <property name="label"></property>
 </tk-meta>
-
+-->
 <!-- 
 <tk-meta id="polymer-ui-icon" label="Polymer Icon">
   <template>