Vue

HTML

<script src="https://unpkg.com/vue@2.6.10/dist/vue.min.js"></script>
<script src="//unpkg.com/vuetify@1.5.14/dist/vuetify.js"></script>


<div id="app">
<v-app>

<f-form>
  <v-menu offset-y>
    <template v-slot:activator="{on}">
      <v-btn color="primary" v-on=on dark>Dropdown</v-btn>
    </template>
    <p>
    Here's the default slot content.
    </p>
    <v-list>
      <v-list-tile v-for="(item, index) in todos" :key="index">
        <v-list-tile-title>{{ item.text }}</v-list-tile-title>
      </v-list-tile>
    </v-list>
  </v-menu>
</f-form>


</v-app>

</div>

CSS

@import "https://unpkg.com/vuetify@1.5.14/dist/vuetify.css";

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
}

li {
  margin: 8px 0;
}

h2 {
  font-weight: bold;
  margin-bottom: 15px;
}

del {
  color: rgba(0, 0, 0, 0.3);
}

JavaScript

new Vue({
  el: "#app",
  data: {
    todos: [
      { text: "Learn JavaScript", done: false },
      { text: "Learn Vue", done: false },
      { text: "Play around in JSFiddle", done: true },
      { text: "Build something awesome", done: true }
    ]
  },
  methods: {
  	toggle: function(todo){
    	todo.done = !todo.done
    }
  }
})
/* Vue.use(Vuetify, {
  iconfont: 'md',
})
 */