From 8e9dddde381014b20bb28062f0cfe5b4894c8562 Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Thu, 17 Mar 2016 09:42:57 -0400
Subject: [PATCH 1/8] Fixed a missing Source.

---
 bundles.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/bundles.json b/bundles.json
index 1d2f66a..28dd9a9 100644
--- a/bundles.json
+++ b/bundles.json
@@ -219,7 +219,7 @@
     {
       "id": 36,
       "name": "Eggplant",
-      "source": "",
+      "source": "Crops during Fall.",
       "bundles": [8]
     },
     {

From ce57976d858ed7fd264c288793985ac2e71c4e2a Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Fri, 18 Mar 2016 16:21:30 -0400
Subject: [PATCH 2/8] Added Skills and Seasons.

---
 bundles.json | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/bundles.json b/bundles.json
index 28dd9a9..9562272 100644
--- a/bundles.json
+++ b/bundles.json
@@ -502,5 +502,45 @@
       "name": "Vault",
       "reward": "Bus Repair"
     }
+  ],
+  "seasons": [
+    {
+      "id": 0,
+      "name": "Spring"
+    },
+    {
+      "id": 1,
+      "name": "Summer"
+    },
+    {
+      "id": 2,
+      "name": "Fall"
+    },
+    {
+      "id": 3,
+      "name": "Winter"
+    }
+  ],
+  "skills": [
+    {
+      "id": 0,
+      "name": "Farming"
+    },
+    {
+      "id": 1,
+      "name": "Mining" 
+    },
+    {
+      "id": 2,
+      "name": "Foraging"
+    },
+    {
+      "id": 3,
+      "name": "Fishing"
+    },
+    {
+      "id": 4,
+      "name": "Combat"
+    }
   ]
 }

From 87d8303cbdc18199d9356419d6785a8d24735969 Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Fri, 18 Mar 2016 16:38:49 -0400
Subject: [PATCH 3/8] Changed season and skill IDs to be more natural.

---
 bundles.json | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/bundles.json b/bundles.json
index 9562272..6d13551 100644
--- a/bundles.json
+++ b/bundles.json
@@ -505,41 +505,41 @@
   ],
   "seasons": [
     {
-      "id": 0,
+      "id": "spring",
       "name": "Spring"
     },
     {
-      "id": 1,
+      "id": "summer",
       "name": "Summer"
     },
     {
-      "id": 2,
+      "id": "fall",
       "name": "Fall"
     },
     {
-      "id": 3,
+      "id": "winter",
       "name": "Winter"
     }
   ],
   "skills": [
     {
-      "id": 0,
+      "id": "farming",
       "name": "Farming"
     },
     {
-      "id": 1,
+      "id": "mining",
       "name": "Mining" 
     },
     {
-      "id": 2,
+      "id": "foraging",
       "name": "Foraging"
     },
     {
-      "id": 3,
+      "id": "fishing",
       "name": "Fishing"
     },
     {
-      "id": 4,
+      "id": "combat",
       "name": "Combat"
     }
   ]

From bb29a3234c9086c71fcddcd61e0b371152a97dd1 Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Fri, 18 Mar 2016 17:43:50 -0400
Subject: [PATCH 4/8] Added Seasons and skills tabs.

---
 index.html | 51 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 51 insertions(+)

diff --git a/index.html b/index.html
index 8105a31..11d180e 100644
--- a/index.html
+++ b/index.html
@@ -14,6 +14,8 @@
         </li>
         <li role="presentation"><a href="#ab-list" aria-controls="ab-list" role="tab" data-toggle="tab">Alphabetical
             List</a></li>
+        <li role="presentation"><a href="#season-list" aria-controls="season-list" role="tab" data-toggle="tab">By Season</a></li>
+        <li role="presentation"><a href="#skill-list" aria-controls="skill-list" role="tab" data-toggle="tab">By Skill</a></li>
         <li role="presentation"><a href="#about" aria-controls="about" role="tab" data-toggle="tab">About</a></li>
 
     </ul>
@@ -64,8 +66,57 @@
                             <div class="checkbox"><label><input type="checkbox" v-model="user_data" id="{{ item.id }}"
                                                                 value="{{ item.id }}"/>{{ item.name }} — {{ item.source
                                 }}</label></div>
+            <div role="tabpanel" class="tab-pane" id="season-list">
+                <div class="list-group list-group-root well">
+
+                    <template v-for="season in static.seasons">
+                        <a href="#season-{{ season.id }}" class="list-group-item" data-toggle="collapse">
+                            <div class="checkbox">
+                                <i class="glyphicon glyphicon-chevron-right"></i>
+                                <label><input type="checkbox"/>{{ season.name }}</label>
+                            </div>
                         </a>
+                        <div class="list-group collapse" id="season-{{ season.id }}">
+                            <template v-for="item in static.items | filterBy season.id in 'seasons'">
+                                <a class="list-group-item">
+                                    <div class="checkbox">
+                                        <label>
+                                            <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
+                                            {{ item.name }} — {{ item.source }}
+                                        </label>
+                                    </div>
+                                </a>
+                            </template>
+                        </div>
                     </template>
+
+                </div>
+            </div>
+
+            <div role="tabpanel" class="tab-pane" id="skill-list">
+                <div class="list-group list-group-root well">
+
+                    <template v-for="skill in static.skills">
+                        <a href="#skill-{{ skill.id }}" class="list-group-item" data-toggle="collapse">
+                            <div class="checkbox">
+                                <i class="glyphicon glyphicon-chevron-right"></i>
+                                <label><input type="checkbox"/>{{ skill.name }}</label>
+                            </div>
+                        </a>
+                        <div class="list-group collapse" id="skill-{{ skill.id }}">
+                            <template v-for="item in static.items | filterBy skill.id in 'skills'">
+                                <a class="list-group-item">
+                                    <div class="checkbox">
+                                        <label>
+                                            <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
+                                            {{ item.name }} — {{ item.source }}
+                                        </label>
+                                    </div>
+                                </a>
+                            </template>
+                        </div>
+                    </template>
+
                 </div>
             </div>
 

From 7fc920647e0c1bd7f06f52980a1bb7e6eb6cf043 Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Fri, 18 Mar 2016 18:04:22 -0400
Subject: [PATCH 5/8] Fixed HTML formatting.

---
 index.html | 45 ++++++++++++++++++++++++++++-----------------
 1 file changed, 28 insertions(+), 17 deletions(-)

diff --git a/index.html b/index.html
index 11d180e..5a08a7f 100644
--- a/index.html
+++ b/index.html
@@ -10,14 +10,11 @@
 <div class="container">
     <h1>Stardew Valley Community Center Checklist</h1>
     <ul class="nav nav-tabs" role="tablist">
-        <li role="presentation" class="active"><a href="#bundles" aria-controls="bundles" role="tab" data-toggle="tab">Bundles</a>
-        </li>
-        <li role="presentation"><a href="#ab-list" aria-controls="ab-list" role="tab" data-toggle="tab">Alphabetical
-            List</a></li>
+        <li role="presentation" class="active"><a href="#bundles" aria-controls="bundles" role="tab" data-toggle="tab">By Bundle</a></li>
+        <li role="presentation"><a href="#ab-list" aria-controls="ab-list" role="tab" data-toggle="tab">Alphabetical List</a></li>
         <li role="presentation"><a href="#season-list" aria-controls="season-list" role="tab" data-toggle="tab">By Season</a></li>
         <li role="presentation"><a href="#skill-list" aria-controls="skill-list" role="tab" data-toggle="tab">By Skill</a></li>
         <li role="presentation"><a href="#about" aria-controls="about" role="tab" data-toggle="tab">About</a></li>
-
     </ul>
     <div id="app">
         <div class="just-padding tab-content">
@@ -34,19 +31,25 @@
 
                             <template v-for="bundle in static.bundles | filterBy room.id in 'room'">
                                 <a href="#bundle-{{ bundle.id }}" class="list-group-item" data-toggle="collapse">
-                                    <div class="checkbox"><i class="glyphicon glyphicon-chevron-right"></i><label><input
-                                            type="checkbox"/>{{ bundle.name }}</label></div>
+                                    <div class="checkbox">
+                                        <i class="glyphicon glyphicon-chevron-right"></i>
+                                        <label>
+                                            <input type="checkbox"/>
+                                            {{ bundle.name }}
+                                        </label>
+                                    </div>
                                 </a>
                                 <div class="list-group collapse" id="bundle-{{ bundle.id }}">
                                     <template v-for="item in static.items | filterBy bundle.id in 'bundles'">
                                         <a class="list-group-item">
-                                            <div class="checkbox"><label>
-                                                <template v-for="bundle in item.bundles"><input type="checkbox"
-                                                                                                v-model="user_data"
-                                                                                                id="{{ item.id }}"
-                                                                                                value="{{ item.id }}"/>
-                                                </template>
-                                                {{ item.name }} — {{ item.source }}</label></div>
+                                            <div class="checkbox">
+                                                <label>
+                                                    <template v-for="bundle in item.bundles">
+                                                        <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
+                                                    </template>
+                                                    {{ item.name }} — {{ item.source }}
+                                                </label>
+                                            </div>
                                         </a>
                                     </template>
                                 </div>
@@ -63,9 +66,17 @@
                 <div class="list-group">
                     <template v-for="item in static.items | orderBy 'name'">
                         <a class="list-group-item">
-                            <div class="checkbox"><label><input type="checkbox" v-model="user_data" id="{{ item.id }}"
-                                                                value="{{ item.id }}"/>{{ item.name }} — {{ item.source
-                                }}</label></div>
+                            <div class="checkbox">
+                                <label>
+                                    <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
+                                    {{ item.name }} — {{ item.source }}
+                                </label>
+                            </div>
+                        </a>
+                    </template>
+                </div>
+            </div>
+
             <div role="tabpanel" class="tab-pane" id="season-list">
                 <div class="list-group list-group-root well">
 

From 3d8d6e8ff21387b5ecb707fd71c3370238624db4 Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Sun, 20 Mar 2016 22:21:33 -0400
Subject: [PATCH 6/8] Added seasons to existing items.

---
 bundles.json | 86 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 86 insertions(+)

diff --git a/bundles.json b/bundles.json
index 6d13551..713a80d 100644
--- a/bundles.json
+++ b/bundles.json
@@ -4,258 +4,344 @@
       "id": 0,
       "name": "Wild Horseradish",
       "source": "Foraging during Spring.",
+      "seasons": ["spring"],
+      "skills": ["foraging"],
       "bundles": [0]
     },
     {
       "id": 1,
       "name": "Daffodil",
       "source": "Foraging during Spring. Buy from Pierre's Shop at the Flower Dance.",
+      "seasons": ["spring"],
+      "skills": ["foraging"],
       "bundles": [0]
     },
     {
       "id": 2,
       "name": "Leek",
       "source": "Foraging during Spring.",
+      "seasons": ["spring"],
+      "skills": ["foraging"],
       "bundles": [0]
     },
     {
       "id": 3,
       "name": "Dandelion",
       "source": "Foraging during Spring. Buy from Pierre's Shop at the Flower Dance.",
+      "seasons": ["spring"],
+      "skills": ["foraging"],
       "bundles": [0]
     },
     {
       "id": 4,
       "name": "Grape",
       "source": "Foraging during Summer.",
+      "seasons": ["summer", "fall"],
+      "skills": ["foraging", "farming"],
       "bundles": [1]
     },
     {
       "id": 5,
       "name": "Spice Berry",
       "source": "Foraging during Summer.",
+      "seasons": ["summer"],
+      "skills": ["foraging"],
       "bundles": [1]
     },
     {
       "id": 6,
       "name": "Sweet Pea",
       "source": "Foraging during Summer.",
+      "seasons": ["summer"],
+      "skills": ["foraging"],
       "bundles": [1]
     },
     {
       "id": 7,
       "name": "Common Mushroom",
       "source": "Foraging during Fall Or if you have the mushroom in your cave.",
+      "seasons": ["fall"],
+      "skills": ["foraging"],
       "bundles": [2]
     },
     {
       "id": 8,
       "name": "Wild Plum",
       "source": "Foraging during Fall.",
+      "seasons": ["fall"],
+      "skills": ["foraging"],
       "bundles": [2]
     },
     {
       "id": 9,
       "name": "Hazelnut",
       "source": "Foraging during Fall.",
+      "seasons": ["fall"],
+      "skills": ["foraging"],
       "bundles": [2]
     },
     {
       "id": 10,
       "name": "Blackberry",
       "source": "Foraging during Fall.",
+      "seasons": ["fall"],
+      "skills": ["foraging"],
       "bundles": [2]
     },
     {
       "id": 11,
       "name": "Winter Root",
       "source": "Foraging during Winter or dropped by slimes on 41-79 Mines levels.",
+      "seasons": ["winter", "spring", "summer", "fall"],
+      "skills": ["foraging", "combat"],
       "bundles": [3]
     },
     {
       "id": 12,
       "name": "Crystal Fruit",
       "source": "Foraging during Winter or dropped by coal sprites on 41-79 Mines levels.",
+      "seasons": ["winter", "spring", "summer", "fall"],
+      "skills": ["foraging", "combat"],
       "bundles": [3]
     },
     {
       "id": 13,
       "name": "Snow Yam",
       "source": "Foraging during Winter (Using a Hoe outside the farm).",
+      "seasons": ["winter"],
+      "skills": ["foraging"],
       "bundles": [3]
     },
     {
       "id": 14,
       "name": "Crocus",
       "source": "Foraging during Winter.",
+      "seasons": ["winter"],
+      "skills": ["foraging"],
       "bundles": [3]
     },
     {
       "id": 15,
       "name": "Wood (99)",
       "source": "Chopping trees or logs using an axe.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging"],
       "bundles": [4, 4]
     },
     {
       "id": 16,
       "name": "Stone (99)",
       "source": "Smashing stones with a pickaxe.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["mining"],
       "bundles": [4]
     },
     {
       "id": 17,
       "name": "Hardwood (10)",
       "source": "Chopping large stumps with an upgraded axe. Also in crates in the Mines",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging", "mining"],
       "bundles": [4]
     },
     {
       "id": 18,
       "name": "Coconut",
       "source": "Found in the desert.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging"],
       "bundles": [5]
     },
     {
       "id": 19,
       "name": "Cactus Fruit",
       "source": "Found in the desert.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging"],
       "bundles": [5]
     },
     {
       "id": 20,
       "name": "Cave Carrot",
       "source": "In boxes inside the mines or using the hoe on soil spots in the Mines.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["mining"],
       "bundles": [5]
     },
     {
       "id": 21,
       "name": "Red Mushroom",
       "source": "Can be found in the mines or in the farm cave if you selected the mushroom perk.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging", "mining"],
       "bundles": [5]
     },
     {
       "id": 22,
       "name": "Purple Mushroom",
       "source": "Can be found in the mines or in the farm cave if you selected the mushroom perk.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging", "mining"],
       "bundles": [5]
     },
     {
       "id": 23,
       "name": "Maple Syrup",
       "source": "Harvested from maple trees using a Tapper.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging"],
       "bundles": [5]
     },
     {
       "id": 24,
       "name": "Oak Resin",
       "source": "Harvested from oak trees using a Tapper.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging"],
       "bundles": [5]
     },
     {
       "id": 25,
       "name": "Pine Tar",
       "source": "Harvested from pine trees using a Tapper.",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging"],
       "bundles": [5]
     },
     {
       "id": 26,
       "name": "Morel",
       "source": "In the farm cave if you selected the mushroom perk",
+      "seasons": ["spring", "summer", "fall", "winter"],
+      "skills": ["foraging"],
       "bundles": [5]
     },
     {
       "id": 26,
       "name": "Parsnip",
       "source": "Crops during Spring.",
+      "seasons": ["spring"],
+      "skills": ["farming"],
       "bundles": [6]
     },
     {
       "id": 28,
       "name": "Green Bean",
       "source": "Crops during Spring.",
+      "seasons": ["spring"],
+      "skills": ["farming"],
       "bundles": [6]
     },
     {
       "id": 29,
       "name": "Cauliflower",
       "source": "Crops during Spring.",
+      "seasons": ["spring"],
+      "skills": ["farming"],
       "bundles": [6]
     },
     {
       "id": 30,
       "name": "Potato",
       "source": "Crops during Spring.",
+      "seasons": ["spring"],
+      "skills": ["farming"],
       "bundles": [6]
     },
     {
       "id": 31,
       "name": "Tomato",
       "source": "Crops during Summer.",
+      "seasons": ["summer"],
+      "skills": ["farming"],
       "bundles": [7]
     },
     {
       "id": 32,
       "name": "Hot Pepper",
       "source": "Crops during Summer.",
+      "seasons": ["summer"],
+      "skills": ["farming"],
       "bundles": [7]
     },
     {
       "id": 33,
       "name": "Blueberry",
       "source": "Crops during Summer.",
+      "seasons": ["summer"],
+      "skills": ["farming"],
       "bundles": [7]
     },
     {
       "id": 34,
       "name": "Melon",
       "source": "Crops during Summer.",
+      "seasons": ["summer"],
+      "skills": ["farming"],
       "bundles": [7]
     },
     {
       "id": 35,
       "name": "Corn",
       "source": "Crops during Summer and Fall.",
+      "seasons": ["summer", "fall"],
+      "skills": ["farming"],
       "bundles": [8]
     },
     {
       "id": 36,
       "name": "Eggplant",
       "source": "Crops during Fall.",
+      "seasons": ["fall"],
+      "skills": ["farming"],
       "bundles": [8]
     },
     {
       "id": 37,
       "name": "Pumpkin",
       "source": "Crops during Fall.",
+      "seasons": ["fall"],
+      "skills": ["farming"],
       "bundles": [8]
     },
     {
       "id": 38,
       "name": "Yam",
       "source": "Crops during Fall.",
+      "seasons": ["fall"],
+      "skills": ["farming"],
       "bundles": [8]
     },
     {
       "id": 39,
       "name": "Parsnip (Gold Star) (5)",
       "source": "Crops during Spring.",
+      "seasons": ["spring"],
+      "skills": ["farming"],
       "bundles": [9]
     },
     {
       "id": 40,
       "name": "Melon (Gold Star) (5)",
       "source": "Crops during Summer.",
+      "seasons": ["summer"],
+      "skills": ["farming"],
       "bundles": [9]
     },
     {
       "id": 41,
       "name": "Pumpkin (Gold Star) (5)",
       "source": "Crops during Fall.",
+      "seasons": ["fall"],
+      "skills": ["farming"],
       "bundles": [9]
     },
     {
       "id": 42,
       "name": "Corn (Gold Star) (5)",
       "source": "Crops during Summer and Fall.",
+      "seasons": ["summer", "fall"],
+      "skills": ["farming"],
       "bundles": [9]
     }
   ],

From a7a0d554b2cbe21224cd80ee67841d5ac53dac6f Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Sun, 20 Mar 2016 22:23:03 -0400
Subject: [PATCH 7/8] Switched from a list of items to a panel.

Each panel shows a button for each bundle it is in with a checkbox.
This will need to be hooked up to an onclick even in the future.
---
 index.html | 204 ++++++++++++++++++++++++++++++++++++++++++-----------
 main.css   |  64 +++++++++++++++++
 2 files changed, 226 insertions(+), 42 deletions(-)

diff --git a/index.html b/index.html
index 5a08a7f..ff83689 100644
--- a/index.html
+++ b/index.html
@@ -40,18 +40,47 @@
                                     </div>
                                 </a>
                                 <div class="list-group collapse" id="bundle-{{ bundle.id }}">
-                                    <template v-for="item in static.items | filterBy bundle.id in 'bundles'">
-                                        <a class="list-group-item">
-                                            <div class="checkbox">
-                                                <label>
-                                                    <template v-for="bundle in item.bundles">
-                                                        <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
-                                                    </template>
-                                                    {{ item.name }} — {{ item.source }}
-                                                </label>
-                                            </div>
-                                        </a>
-                                    </template>
+                                    <div class="container-fluid">
+                                        <div class="row row-eq-height">
+                                            <template v-for="item in static.items | filterBy bundle.id in 'bundles'">
+                                                <div class="col-md-3">
+                                                    <div class="panel panel-default">
+                                                        <div class="panel-heading">
+                                                            <h3 class="panel-title">{{ item.name }}</h3>
+                                                        </div>
+                                                        <div class="panel-body">
+                                                            <p>{{ item.source }}</p>
+                                                            <div class="button-area">
+                                                                <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                                            </div>
+                                                        </div>
+                                                        <div class="panel-footer">
+                                                            <div class="panel-footer-area">
+                                                                <span class="glyphicon glyphicon-calendar"></span>
+                                                                <span class="footer-text-area">
+                                                                    <template v-for="season_id in item.seasons">
+                                                                        <template v-for="season in static.seasons | filterBy season_id in 'id'">
+                                                                            <span class="footer-text">{{ season.name }}</span>
+                                                                        </template>
+                                                                    </template>
+                                                                </span>
+                                                            </div>
+                                                            <div class="panel-footer-area">
+                                                                <span class="glyphicon glyphicon-grain"></span>
+                                                                <div class="footer-text-area">
+                                                                    <template v-for="skill_id in item.skills">
+                                                                        <template v-for="skill in static.skills | filterBy skill_id in 'id'">
+                                                                            <div class="footer-text">{{ skill.name }}</div>
+                                                                        </template>
+                                                                    </template>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </template>
+                                        </div>
+                                    </div>
                                 </div>
 
                             </template>
@@ -63,17 +92,46 @@
             </div>
 
             <div role="tabpanel" class="tab-pane" id="ab-list">
-                <div class="list-group">
-                    <template v-for="item in static.items | orderBy 'name'">
-                        <a class="list-group-item">
-                            <div class="checkbox">
-                                <label>
-                                    <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
-                                    {{ item.name }} — {{ item.source }}
-                                </label>
+                <div class="container-fluid">
+                    <div class="row row-eq-height">
+                        <template v-for="item in static.items | orderBy 'name'">
+                            <div class="col-md-3">
+                                <div class="panel panel-default">
+                                    <div class="panel-heading">
+                                        <h3 class="panel-title">{{ item.name }}</h3>
+                                    </div>
+                                    <div class="panel-body">
+                                        <p>{{ item.source }}</p>
+                                        <div class="button-area">
+                                            <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                        </div>
+                                    </div>
+                                    <div class="panel-footer">
+                                        <div class="panel-footer-area">
+                                            <span class="glyphicon glyphicon-calendar"></span>
+                                                                <span class="footer-text-area">
+                                                                    <template v-for="season_id in item.seasons">
+                                                                        <template v-for="season in static.seasons | filterBy season_id in 'id'">
+                                                                            <span class="footer-text">{{ season.name }}</span>
+                                                                        </template>
+                                                                    </template>
+                                                                </span>
+                                        </div>
+                                        <div class="panel-footer-area">
+                                            <span class="glyphicon glyphicon-grain"></span>
+                                            <div class="footer-text-area">
+                                                <template v-for="skill_id in item.skills">
+                                                    <template v-for="skill in static.skills | filterBy skill_id in 'id'">
+                                                        <div class="footer-text">{{ skill.name }}</div>
+                                                    </template>
+                                                </template>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
                             </div>
-                        </a>
-                    </template>
+                        </template>
+                    </div>
                 </div>
             </div>
 
@@ -88,16 +146,47 @@
                             </div>
                         </a>
                         <div class="list-group collapse" id="season-{{ season.id }}">
-                            <template v-for="item in static.items | filterBy season.id in 'seasons'">
-                                <a class="list-group-item">
-                                    <div class="checkbox">
-                                        <label>
-                                            <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
-                                            {{ item.name }} — {{ item.source }}
-                                        </label>
-                                    </div>
-                                </a>
-                            </template>
+                            <div class="container-fluid">
+                                <div class="row row-eq-height">
+                                    <template v-for="item in static.items | filterBy season.id in 'seasons'">
+                                        <div class="col-md-3">
+                                            <div class="panel panel-default">
+                                                <div class="panel-heading">
+                                                    <h3 class="panel-title">{{ item.name }}</h3>
+                                                </div>
+                                                <div class="panel-body">
+                                                    <p>{{ item.source }}</p>
+                                                    <div class="button-area">
+                                                        <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                                    </div>
+                                                </div>
+                                                <div class="panel-footer">
+                                                    <div class="panel-footer-area">
+                                                        <span class="glyphicon glyphicon-calendar"></span>
+                                                                <span class="footer-text-area">
+                                                                    <template v-for="season_id in item.seasons">
+                                                                        <template v-for="season in static.seasons | filterBy season_id in 'id'">
+                                                                            <span class="footer-text">{{ season.name }}</span>
+                                                                        </template>
+                                                                    </template>
+                                                                </span>
+                                                    </div>
+                                                    <div class="panel-footer-area">
+                                                        <span class="glyphicon glyphicon-grain"></span>
+                                                        <div class="footer-text-area">
+                                                            <template v-for="skill_id in item.skills">
+                                                                <template v-for="skill in static.skills | filterBy skill_id in 'id'">
+                                                                    <div class="footer-text">{{ skill.name }}</div>
+                                                                </template>
+                                                            </template>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </template>
+                                </div>
+                            </div>
                         </div>
                     </template>
 
@@ -115,16 +204,47 @@
                             </div>
                         </a>
                         <div class="list-group collapse" id="skill-{{ skill.id }}">
-                            <template v-for="item in static.items | filterBy skill.id in 'skills'">
-                                <a class="list-group-item">
-                                    <div class="checkbox">
-                                        <label>
-                                            <input type="checkbox" v-model="user_data" id="{{ item.id }}" value="{{ item.id }}"/>
-                                            {{ item.name }} — {{ item.source }}
-                                        </label>
-                                    </div>
-                                </a>
-                            </template>
+                            <div class="container-fluid">
+                                <div class="row row-eq-height">
+                                    <template v-for="item in static.items | filterBy skill.id in 'skills'">
+                                        <div class="col-md-3">
+                                            <div class="panel panel-default">
+                                                <div class="panel-heading">
+                                                    <h3 class="panel-title">{{ item.name }}</h3>
+                                                </div>
+                                                <div class="panel-body">
+                                                    <p>{{ item.source }}</p>
+                                                    <div class="button-area">
+                                                        <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                                    </div>
+                                                </div>
+                                                <div class="panel-footer">
+                                                    <div class="panel-footer-area">
+                                                        <span class="glyphicon glyphicon-calendar"></span>
+                                                                <span class="footer-text-area">
+                                                                    <template v-for="season_id in item.seasons">
+                                                                        <template v-for="season in static.seasons | filterBy season_id in 'id'">
+                                                                            <span class="footer-text">{{ season.name }}</span>
+                                                                        </template>
+                                                                    </template>
+                                                                </span>
+                                                    </div>
+                                                    <div class="panel-footer-area">
+                                                        <span class="glyphicon glyphicon-grain"></span>
+                                                        <div class="footer-text-area">
+                                                            <template v-for="skill_id in item.skills">
+                                                                <template v-for="skill in static.skills | filterBy skill_id in 'id'">
+                                                                    <div class="footer-text">{{ skill.name }}</div>
+                                                                </template>
+                                                            </template>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </template>
+                                </div>
+                            </div>
                         </div>
                     </template>
 
diff --git a/main.css b/main.css
index 00850cb..b40e8c2 100644
--- a/main.css
+++ b/main.css
@@ -31,3 +31,67 @@
 .list-group-item .glyphicon {
     margin-right: 5px;
 }
+
+.row-eq-height, .row-eq-height > div[class*='col-']{
+    display: -webkit-box;
+    display: -moz-box;
+    display: -ms-flexbox;
+    display: -webkit-flex;
+    display: flex;
+    flex: 1 0 auto;
+    flex-wrap: wrap;
+}
+
+.panel {
+   display: flex;
+   flex-direction:column;
+   align-content:stretch;
+    flex-grow: 1;
+}
+
+.panel-body{
+    display:         flex;
+    flex-direction: column;
+    flex-grow: 1;
+}
+
+.panel-body > p{
+    flex-grow: 1;
+}
+
+.panel-body > .button-area{
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+
+.button-area > .btn{
+    flex: 1 0 auto;
+    margin-top: 1rem;
+}
+
+.panel-footer{
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+}
+
+.panel-footer-area{
+    display: flex;
+    flex-direction: row;
+    flex: 1 0 auto;
+    justify-content: space-around;
+}
+
+.footer-text-area{
+    margin-left: 1rem;
+    flex: 1 0 auto;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: space-around;
+}
+
+.footer-text{
+    flex-grow: 1;
+}

From 51b33b0ed31e4ee9ef21f2d81eda53f1bedc053c Mon Sep 17 00:00:00 2001
From: John Cleaver <cleaver.john.k@gmail.com>
Date: Sun, 20 Mar 2016 22:26:08 -0400
Subject: [PATCH 8/8] Removed bundle name hardcode.

---
 index.html | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index ff83689..9cbe7a9 100644
--- a/index.html
+++ b/index.html
@@ -51,7 +51,7 @@
                                                         <div class="panel-body">
                                                             <p>{{ item.source }}</p>
                                                             <div class="button-area">
-                                                                <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                                                <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>{{ static.bundles[bundle_id].name }}</button>
                                                             </div>
                                                         </div>
                                                         <div class="panel-footer">
@@ -103,7 +103,7 @@
                                     <div class="panel-body">
                                         <p>{{ item.source }}</p>
                                         <div class="button-area">
-                                            <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                            <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>{{ static.bundles[bundle_id].name }}</button>
                                         </div>
                                     </div>
                                     <div class="panel-footer">
@@ -157,7 +157,7 @@
                                                 <div class="panel-body">
                                                     <p>{{ item.source }}</p>
                                                     <div class="button-area">
-                                                        <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                                        <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>{{ static.bundles[bundle_id].name }}</button>
                                                     </div>
                                                 </div>
                                                 <div class="panel-footer">
@@ -215,7 +215,7 @@
                                                 <div class="panel-body">
                                                     <p>{{ item.source }}</p>
                                                     <div class="button-area">
-                                                        <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>Construction Bundle</button>
+                                                        <button v-for="bundle_id in item.bundles" class="btn btn-warning"><span class="glyphicon glyphicon-unchecked"></span>{{ static.bundles[bundle_id].name }}</button>
                                                     </div>
                                                 </div>
                                                 <div class="panel-footer">