add better examples to list page vuematerial#457

Author: marcosmoura

docs/src/pages/components/List.vue

@@ -848,9 +848,81 @@
           </div>
         </example-box>
 
-        <example-box card-title="Expansion Lists">
+        <example-box card-title="Controls">
           <div slot="demo">
             <div class="phone-viewport">
+              <md-toolbar md-theme="white">
+                <span class="md-title">Multiple options</span>
+              </md-toolbar>
+
+              <md-list>
+                <md-list-item>Plain Text</md-list-item>
+                <md-list-item target="_blank" href="https://google.com">Link</md-list-item>
+                <md-list-item @click.native="openAlert">Button</md-list-item>
+                <md-list-item>
+                  <router-link to="/components/list">Router View</router-link>
+                </md-list-item>
+              </md-list>
+            </div>
+
+            <div class="phone-viewport">
+              <md-toolbar md-theme="white">
+                <span class="md-title">Single Expand</span>
+              </md-toolbar>
+
+              <md-list>
+                <md-list-item>
+                  <md-icon>whatshot</md-icon>
+                  <span>News</span>
+
+                  <md-list-expand>
+                    <md-list>
+                      <md-list-item class="md-inset">World</md-list-item>
+                      <md-list-item class="md-inset">Americas</md-list-item>
+                      <md-list-item class="md-inset">Europe</md-list-item>
+                    </md-list>
+                  </md-list-expand>
+                </md-list-item>
+
+                <md-list-item>
+                  <md-icon>videogame_asset</md-icon>
+                  <span>Games</span>
+
+                  <md-list-expand>
+                    <md-list>
+                      <md-list-item class="md-inset">Console</md-list-item>
+                      <md-list-item class="md-inset">PC</md-list-item>
+                      <md-list-item class="md-inset">Phone</md-list-item>
+                    </md-list>
+                  </md-list-expand>
+                </md-list-item>
+
+                <md-list-item>
+                  <md-icon>video_library</md-icon>
+                  <span>Video</span>
+
+                  <md-list-expand>
+                    <md-list>
+                      <md-list-item class="md-inset">Humor</md-list-item>
+                      <md-list-item class="md-inset">Music</md-list-item>
+                      <md-list-item class="md-inset">Movies</md-list-item>
+                      <md-list-item class="md-inset">TV Shows</md-list-item>
+                    </md-list>
+                  </md-list-expand>
+                </md-list-item>
+
+                <md-list-item>
+                  <md-icon>shopping_basket</md-icon>
+                  <span>Shop</span>
+                </md-list-item>
+              </md-list>
+            </div>
+
+            <div class="phone-viewport">
+              <md-toolbar md-theme="white">
+                <span class="md-title">Multiple Expand</span>
+              </md-toolbar>
+
               <md-list>
                 <md-list-item md-expand-multiple>
                   <md-icon>whatshot</md-icon>
@@ -960,7 +1032,7 @@
 
 <style lang="sass" scoped>
   .phone-viewport {
-    height: 400px;
+    height: 480px;
   }
 
   .custom-list {
@@ -969,3 +1041,13 @@
     }
   }
 </style>
+
+<script>
+  export default {
+    methods: {
+      openAlert() {
+        window.alert('...');
+      }
+    }
+  };
+</script>

src/components/mdList/mdListItemLink.vue

@@ -13,7 +13,7 @@
     name: 'md-list-item',
     props: {
       href: String,
-      target: Boolean,
+      target: String,
       disabled: Boolean
     },
     computed: {