Merge branch 'master' into dev

releases/0.13/examples/alerts/1.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>
+    <v-alert success value="true">
+      This is a success alert.
+    </v-alert>
+
+    <v-alert info value="true">
+      This is a info alert.
+    </v-alert>
+
+    <v-alert warning value="true">
+      This is a warning alert.
+    </v-alert>
+
+    <v-alert error value="true">
+      This is a error alert.
+    </v-alert>
+  </div>
+</template>

releases/0.13/examples/alerts/2.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <v-alert info dismissible v-model="alert">
+      This is a success alert that is closable.
+    </v-alert>
+
+    <div class="text-xs-center">
+      <v-btn primary dark v-if="!alert" v-on:click.native="alert = true">Reset</v-btn>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        alert: true
+      }
+    }
+  }
+</script>

releases/0.13/examples/alerts/3.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    <v-alert success icon="new_releases" v-bind:value="true">
+      This is a success alert with a custom icon.
+    </v-alert>
+
+    <v-alert error hide-icon v-bind:value="true">
+      This is an error alert with no icon.
+    </v-alert>
+  </div>
+</template>

releases/0.13/examples/alerts/4.vue

@@ -0,0 +1,22 @@
+<template>
+  <div>
+    <div class="text-xs-center">
+      <v-btn primary @click.native="alert = !alert">Toggle</v-btn>
+    </div>
+    <v-alert
+      success
+      :value="alert"
+      transition="scale-transition"
+    >
+      This is a success alert.
+    </v-alert>
+  </div>
+</template>
+
+<script>
+  export default {
+    data: () => ({
+      alert: true
+    })
+  }
+</script>

releases/0.13/examples/alerts/example.vue

@@ -0,0 +1,5 @@
+<template>
+  <v-card>
+    <v-card-text>Testing</v-card-text>
+  </v-card>
+</template>

releases/0.13/examples/alignment/1.vue

@@ -0,0 +1,11 @@
+<template>
+  <v-card>
+    <v-card-text>
+      <p class="text-lg-right">Right align on large viewport sizes</p>
+      <p class="text-md-center">Center align on medium viewport sizes</p>
+      <p class="text-sm-left">Left align on small viewport sizes</p>
+      <p class="text-xs-center">Center align on all viewport sizes</p>
+      <p class="text-xs-right">Right align on all viewport sizes</p>
+    </v-card-text>
+  </v-card>
+</template>

releases/0.13/examples/badges/1.vue

@@ -0,0 +1,7 @@
+<template>
+  <div class="text-xs-center">
+    <v-icon large v-badge="{ value: 6, left: true}" class="grey--text text--lighten-1">shopping_cart</v-icon>
+
+    <v-icon large v-badge="{ value: '!' }" class="grey--text red--after">mail</v-icon>
+  </div>
+</template>

releases/0.13/examples/badges/2.vue

@@ -0,0 +1,19 @@
+<template>
+  <div class="text-xs-center">
+    <v-icon 
+      large 
+      v-badge:done.overlap.icon.left 
+      class="grey--text text--lighten-1"
+    >
+      account_circle
+    </v-icon>
+
+    <v-icon 
+      large 
+      v-badge:notifications.icon.overlap
+      class="grey--text text--darken-1 orange--after"
+    >
+      account_box
+    </v-icon>
+  </div>
+</template>

releases/0.13/examples/badges/3.vue

@@ -0,0 +1,7 @@
+<template>
+  <div class="text-xs-center">
+    <span v-badge:2.left>Examples</span>
+    &nbsp;&nbsp;
+    <span v-badge:list.icon class="green--after">Lists</span>
+  </div>
+</template>

releases/0.13/examples/badges/4.vue

@@ -0,0 +1,29 @@
+<template>
+  <v-container fluid class="text-xs-center">
+    <v-layout flex wrap row justify-space-between>
+      <v-flex xs12>
+        <v-btn @click.native="show = !show">toggle</v-btn>
+      </v-flex>
+      <v-flex xs12 class="mt-5">
+        <v-icon large v-badge="{ value: 6, left: true, visible: show}" class="grey--text text--lighten-1">shopping_cart</v-icon>
+        <v-icon large v-badge="badge" class="grey--text red--after">mail</v-icon>
+      </v-flex>
+    </v-layout>
+  </v-container>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        show: true,
+        badgeData: { value: '!' }
+      }
+    },
+    computed: {
+      badge () {
+        return this.show ? this.badgeData : null
+      }
+    }
+  }
+</script>

releases/0.13/examples/bottom-navigation/1.vue

@@ -0,0 +1,28 @@
+<template>
+  <v-card height="200px">
+    <v-bottom-nav absolute value="true" class="transparent">
+      <v-btn flat light class="teal--text" @click.native="e1 = 1" :value="e1 === 1">
+        <span>Recents</span>
+        <v-icon>history</v-icon>
+      </v-btn>
+      <v-btn flat light class="teal--text" @click.native="e1 = 2" :value="e1 === 2">
+        <span>Favorites</span>
+        <v-icon>favorite</v-icon>
+      </v-btn>
+      <v-btn flat light class="teal--text" @click.native="e1 = 3" :value="e1 === 3">
+        <span>Nearby</span>
+        <v-icon>place</v-icon>
+      </v-btn>
+    </v-bottom-nav>
+  </v-card>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        e1: 2
+      }
+    }
+  }
+</script>

releases/0.13/examples/bottom-navigation/2.vue

@@ -0,0 +1,42 @@
+<template>
+  <v-card height="200px">
+    <v-bottom-nav
+      absolute
+      shift
+      value="true"
+      :class="{
+        'blue-grey': e2 === 1,
+        'teal': e2 === 2,
+        'brown': e2 === 3,
+        'brown lighten-1': e2 === 4
+      }"
+    >
+      <v-btn dark @click.native="e2 = 1" :value="e2 === 1">
+        <span>Video</span>
+        <v-icon>ondemand_video</v-icon>
+      </v-btn>
+      <v-btn dark @click.native="e2 = 2" :value="e2 === 2">
+        <span>Music</span>
+        <v-icon>music_note</v-icon>
+      </v-btn>
+      <v-btn dark @click.native="e2 = 3" :value="e2 === 3">
+        <span>Book</span>
+        <v-icon>book</v-icon>
+      </v-btn>
+      <v-btn dark @click.native="e2 = 4" :value="e2 === 4">
+        <span>Image</span>
+        <v-icon>image</v-icon>
+      </v-btn>
+    </v-bottom-nav>
+  </v-card>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        e2: 3
+      }
+    }
+  }
+</script>

releases/0.13/examples/bottom-navigation/3.vue

@@ -0,0 +1,32 @@
+<template>
+  <v-card height="200px" style="overflow: hidden;">
+    <v-card-text class="text-xs-center">
+      <v-btn flat primary @click.native="e31 = !e31">Toggle Nav</v-btn>
+    </v-card-text>
+    <v-bottom-nav absolute :value="e31" class="transparent">
+      <v-btn flat light class="teal--text" @click.native="e3 = 1" :value="e3 === 1">
+        <span>Recents</span>
+        <v-icon>history</v-icon>
+      </v-btn>
+      <v-btn flat light class="teal--text" @click.native="e3 = 2" :value="e3 === 2">
+        <span>Favorites</span>
+        <v-icon>favorite</v-icon>
+      </v-btn>
+      <v-btn flat light class="teal--text" @click.native="e3 = 3" :value="e3 === 3">
+        <span>Nearby</span>
+        <v-icon>place</v-icon>
+      </v-btn>
+    </v-bottom-nav>
+  </v-card>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        e3: 1,
+        e31: true
+      }
+    }
+  }
+</script>

releases/0.13/examples/breadcrumbs/1.vue

@@ -0,0 +1,44 @@
+<template>
+  <div>
+    <v-breadcrumbs divider="/">
+      <v-breadcrumbs-item 
+        v-for="item in items" :key="item"
+        :disabled="item.disabled"
+      >
+        {{ item.text }}
+      </v-breadcrumbs-item>
+    </v-breadcrumbs>
+
+    <v-breadcrumbs divider="-">
+      <v-breadcrumbs-item 
+        v-for="item in items" :key="item"
+        :disabled="item.disabled"
+      >
+        {{ item.text }}
+      </v-breadcrumbs-item>
+    </v-breadcrumbs>
+  </div>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        items: [
+          {
+            text: 'Dashboard',
+            disabled: false
+          },
+          {
+            text: 'Link 1',
+            disabled: false
+          },
+          {
+            text: 'Link 2',
+            disabled: true
+          }
+        ]
+      }
+    }
+  }
+</script>

releases/0.13/examples/breadcrumbs/2.vue

@@ -0,0 +1,44 @@
+<template>
+  <div>
+    <v-breadcrumbs icons divider="forward">
+      <v-breadcrumbs-item 
+        v-for="item in items" :key="item"
+        :disabled="item.disabled"
+      >
+        {{ item.text }}
+      </v-breadcrumbs-item>
+    </v-breadcrumbs>
+
+    <v-breadcrumbs icons divider="chevron_right">
+      <v-breadcrumbs-item 
+        v-for="item in items" :key="item"
+        :disabled="item.disabled"
+      >
+        {{ item.text }}
+      </v-breadcrumbs-item>
+    </v-breadcrumbs>
+  </div>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        items: [
+          {
+            text: 'Dashboard',
+            disabled: false
+          },
+          {
+            text: 'Link 1',
+            disabled: false
+          },
+          {
+            text: 'Link 2',
+            disabled: true
+          }
+        ]
+      }
+    }
+  }
+</script>