From 20cd73887899820f1f550edc2d898d50590737f7 Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Mon, 26 Feb 2018 23:23:12 -0500
Subject: [PATCH] Add season tag with season icons.

---
 src/components/item_card/SeasonTag.vue | 48 ++++++++++++++++++++++++--
 1 file changed, 45 insertions(+), 3 deletions(-)

diff --git a/src/components/item_card/SeasonTag.vue b/src/components/item_card/SeasonTag.vue
index bff3c56..6ce2e15 100644
--- a/src/components/item_card/SeasonTag.vue
+++ b/src/components/item_card/SeasonTag.vue
@@ -1,11 +1,53 @@
 <template>
-
+  <span class="tag" v-bind:class="seasonColor">
+    <span class="icon">
+        <spring-icon v-if="season === 'spring'"/>
+        <summer-icon v-if="season === 'summer'"/>
+        <fall-icon v-if="season === 'fall'"/>
+        <winter-icon v-if="season === 'winter'"/>
+    </span>
+  </span>
 </template>
 
 <script>
-    export default {
-        name: "season-tag"
+import Seasons from '@/assets/game_data/seasons.json'
+import SpringIcon from 'mdi-vue/FlowerIcon'
+import SummerIcon from 'mdi-vue/WhiteBalanceSunnyIcon'
+import FallIcon from 'mdi-vue/LeafIcon'
+import WinterIcon from 'mdi-vue/SnowflakeIcon'
+export default {
+  name: 'season-tag',
+  props: {
+    season: {
+      type: String,
+      required: true,
+      default: 'spring',
+      validator: function (value) {
+        return value.toLowerCase() in Seasons
+      }
     }
+  },
+  computed: {
+    seasonColor: function () {
+      switch (this.season) {
+        case 'spring':
+          return 'is-success'
+        case 'summer':
+          return 'is-warning'
+        case 'fall':
+          return 'is-danger'
+        case 'winter':
+          return 'is-info'
+      }
+    }
+  },
+  components: {
+    SpringIcon,
+    SummerIcon,
+    FallIcon,
+    WinterIcon
+  }
+}
 </script>
 
 <style scoped>