DEBUG dependance

components/Footer.vue

@@ -0,0 +1,7 @@
+<template>
+  <v-footer color="grey darken-3" padless>
+    <v-col class="text-center white--text py-4">
+      © {{ new Date().getFullYear() }} — Made by Le J
+    </v-col>
+  </v-footer>
+</template>

components/GenerationFilter.vue

@@ -0,0 +1,27 @@
+<template>
+  <v-select
+    :items="generations"
+    v-model="internalSelected"
+    label="Filtrer par génération"
+  />
+</template>
+
+<script>
+export default {
+  props: ['selected'],
+  data() {
+    return {
+      generations: [1, 2, 3, 4, 5, 6, 7, 8, 9],
+      internalSelected: this.selected
+    }
+  },
+  watch: {
+    selected(newVal) {
+      this.internalSelected = newVal
+    },
+    internalSelected(newVal) {
+      this.$emit('change', newVal)
+    }
+  }
+}
+</script>

components/Header.vue

@@ -0,0 +1,5 @@
+<template>
+  <v-app-bar color="deep-purple accent-4" dark>
+    <v-toolbar-title class="text-white">Tyradex Pokédex</v-toolbar-title>
+  </v-app-bar>
+</template>

components/PokemonCard.vue

@@ -0,0 +1,14 @@
+<template>
+  <v-col cols="12" sm="4" md="3">
+    <v-card class="hover:scale-105 transition" @click="$router.push('/pokemon/' + pokemon.id)">
+      <v-img :src="pokemon.sprites.regular" height="200px" />
+      <v-card-title>{{ pokemon.name.fr }}</v-card-title>
+    </v-card>
+  </v-col>
+</template>
+
+<script>
+export default {
+  props: ['pokemon']
+}
+</script>