fix up template

2 files changed, 113 insertions, 103 deletions

diff --git a/app.py b/app.py
index 3b6b83e..de3035a 100644
--- a/app.py
+++ b/app.py
@@ -89,7 +89,7 @@ def get_beer_details(brewery_id, beer_id):
                 attr_beer_objects.append(BeerInfo(item[0], item_brewer, item_result))
             return render_template('beerpage.jinja2', beer_data=beerinfo,
                     attrs=ATTRS, similar_beers=similar_beer_objects, attr=attr,
-                    direction=direction, attr_beers=attr_beer_objects, style_preds=similar_beer,
+                    direction=direction, attr_beers=attr_beer_objects, style_preds=similar_beers,
                     style_map=style_map)
         if style != None:
             style_beers = translate_to_style(full_id, style)
diff --git a/templates/beerpage.jinja2 b/templates/beerpage.jinja2
index 6c523b4..303f629 100644
--- a/templates/beerpage.jinja2
+++ b/templates/beerpage.jinja2
@@ -73,23 +73,22 @@ function drawAnnotations() {
         </table>
     </div>
     <div id="chart_div"></div>
-    <h5>Beers like {{ beer_data.name }}</h5>
-    <ul>
 
-        <table>
-        <tr><td>Beer</td> 
-        <td>Style</td>
-        <td>ABV</td> </tr>
+    <h5>Beers like {{ beer_data.name }}</h5>
+    <table class="table">
+      <tr>
+        <th>Beer</th> 
+        <th>Style</th>
+        <th>ABV</th>
+      </tr>
       {% for similar_beer in similar_beers %}
       <tr>
         <td><a href="{{ similar_beer.link }}" >{{ similar_beer.brewer }} - {{ similar_beer.name }}</a></td>
         <td>{{similar_beer.base_style}}</td>
         <td>{{similar_beer.abv}}</td>
-    </tr>
+      </tr>
       {% endfor %}
     </table>
-    
-    </ul>
 
     <div class="row">
       <div class="col">
@@ -115,117 +114,117 @@ function drawAnnotations() {
         <form action="" method="post" class="alert alert-secondary form-inline">
           Show me similar beers in the style of
           <select name="style" class="form-control">
-            <option>German Bock</option>
-            <option>German Doppelbock</option>
-            <option>German Eisbock</option>
-            <option>German Maibock</option>
-            <option>German Weizenbock</option>
-            <option>American Brown Ale</option>
-            <option>English Brown Ale</option>
-            <option>English Dark Mild Ale</option>
-            <option>German Altbier</option>
-            <option>American Black Ale</option>
-            <option>Belgian Dark Ale</option>
-            <option>Belgian Dubbel</option>
-            <option>German Roggenbier</option>
-            <option>Scottish Ale</option>
-            <option>Winter Warmer</option>
+            <option>American Adjunct Lager</option>
+            <option>American Amber / Red Ale</option>
             <option>American Amber / Red Lager</option>
-            <option>European Dark Lager</option>
-            <option>German Märzen / Oktoberfest</option>
-            <option>German Rauchbier</option>
-            <option>German Schwarzbier</option>
-            <option>Munich Dunkel Lager</option>
-            <option>Vienna Lager</option>
-            <option>American Cream Ale</option>
-            <option>Bière de Champagne / Bière Brut</option>
-            <option>Braggot</option>
-            <option>California Common / Steam Beer</option>
+            <option>American Barleywine</option>
+            <option>American Black Ale</option>
+            <option>American Blonde Ale</option>
+            <option>American Brett</option>
+            <option>American Brown Ale</option>
             <option>American Brut IPA</option>
-            <option>American Imperial IPA</option>
+            <option>American Cream Ale</option>
+            <option>American Dark Wheat Ale</option>
             <option>American IPA</option>
-            <option>Belgian IPA</option>
-            <option>English India Pale Ale (IPA)</option>
-            <option>New England IPA</option>
-            <option>American Amber / Red Ale</option>
-            <option>American Blonde Ale</option>
+            <option>American Imperial IPA</option>
+            <option>American Imperial Pilsner</option>
+            <option>American Imperial Porter</option>
+            <option>American Imperial Red Ale</option>
+            <option>American Imperial Stout</option>
+            <option>American Lager</option>
+            <option>American Light Lager</option>
+            <option>American Malt Liquor</option>
             <option>American Pale Ale (APA)</option>
+            <option>American Pale Wheat Ale</option>
+            <option>American Porter</option>
+            <option>American Stout</option>
+            <option>American Strong Ale</option>
+            <option>American Wheatwine Ale</option>
+            <option>American Wild Ale</option>
+            <option>Baltic Porter</option>
             <option>Belgian Blonde Ale </option>
+            <option>Belgian Dark Ale</option>
+            <option>Belgian Dubbel</option>
+            <option>Belgian Faro</option>
+            <option>Belgian Fruit Lambic</option>
+            <option>Belgian Gueuze</option>
+            <option>Belgian IPA</option>
+            <option>Belgian Lambic</option>
             <option>Belgian Pale Ale</option>
+            <option>Belgian Quadrupel (Quad)</option>
             <option>Belgian Saison</option>
+            <option>Belgian Strong Dark Ale</option>
+            <option>Belgian Strong Pale Ale</option>
+            <option>Belgian Tripel</option>
+            <option>Belgian Witbier</option>
+            <option>Berliner Weisse</option>
+            <option>Bière de Champagne / Bière Brut</option>
+            <option>Bohemian Pilsener</option>
+            <option>Braggot</option>
+            <option>British Barleywine</option>
+            <option>California Common / Steam Beer</option>
+            <option>Chile Beer</option>
             <option>English Bitter</option>
+            <option>English Brown Ale</option>
+            <option>English Dark Mild Ale</option>
             <option>English Extra Special / Strong Bitter (ESB)</option>
+            <option>English India Pale Ale (IPA)</option>
+            <option>English Oatmeal Stout</option>
+            <option>English Old Ale</option>
             <option>English Pale Ale</option>
             <option>English Pale Mild Ale</option>
-            <option>French Bière de Garde</option>
-            <option>German Kölsch</option>
-            <option>Irish Red Ale</option>
-            <option>American Adjunct Lager</option>
-            <option>American Imperial Pilsner</option>
-            <option>American Lager</option>
-            <option>American Light Lager</option>
-            <option>American Malt Liquor</option>
-            <option>Bohemian Pilsener</option>
+            <option>English Porter</option>
+            <option>English Stout</option>
+            <option>English Strong Ale</option>
+            <option>English Sweet / Milk Stout</option>
+            <option>European Dark Lager</option>
             <option>European Export / Dortmunder</option>
             <option>European Pale Lager</option>
             <option>European Strong Lager</option>
+            <option>Finnish Sahti</option>
+            <option>Flanders Oud Bruin</option>
+            <option>Flanders Red Ale</option>
+            <option>Foreign / Export Stout</option>
+            <option>French Bière de Garde</option>
+            <option>Fruit and Field Beer</option>
+            <option>German Altbier</option>
+            <option>German Bock</option>
+            <option>German Doppelbock</option>
+            <option>German Dunkelweizen</option>
+            <option>German Eisbock</option>
+            <option>German Hefeweizen</option>
             <option>German Helles</option>
             <option>German Kellerbier / Zwickelbier</option>
+            <option>German Kristalweizen</option>
+            <option>German Kölsch</option>
+            <option>German Maibock</option>
+            <option>German Märzen / Oktoberfest</option>
             <option>German Pilsner</option>
-            <option>American Imperial Porter</option>
-            <option>American Porter</option>
-            <option>Baltic Porter</option>
-            <option>English Porter</option>
-            <option>Robust Porter </option>
-            <option>Smoke Porter</option>
-            <option>Chile Beer</option>
-            <option>Finnish Sahti</option>
-            <option>Fruit and Field Beer</option>
+            <option>German Rauchbier</option>
+            <option>German Roggenbier</option>
+            <option>German Schwarzbier</option>
+            <option>German Weizenbock</option>
             <option>Herb and Spice Beer</option>
+            <option>Irish Dry Stout</option>
+            <option>Irish Red Ale</option>
             <option>Japanese Happoshu</option>
             <option>Japanese Rice Lager</option>
+            <option>Leipzig Gose</option>
             <option>Low Alcohol Beer</option>
+            <option>Munich Dunkel Lager</option>
+            <option>New England IPA</option>
             <option>Pumpkin Beer</option>
+            <option>Robust Porter </option>
+            <option>Russian Imperial Stout</option>
             <option>Russian Kvass</option>
             <option>Rye Beer</option>
+            <option>Scotch Ale / Wee Heavy</option>
+            <option>Scottish Ale</option>
             <option>Scottish Gruit / Ancient Herbed Ale</option>
             <option>Smoke Beer</option>
-            <option>American Imperial Stout</option>
-            <option>American Stout</option>
-            <option>English Oatmeal Stout</option>
-            <option>English Stout</option>
-            <option>English Sweet / Milk Stout</option>
-            <option>Foreign / Export Stout</option>
-            <option>Irish Dry Stout</option>
-            <option>Russian Imperial Stout</option>
-            <option>American Barleywine</option>
-            <option>American Imperial Red Ale</option>
-            <option>American Strong Ale</option>
-            <option>American Wheatwine Ale</option>
-            <option>Belgian Quadrupel (Quad)</option>
-            <option>Belgian Strong Dark Ale</option>
-            <option>Belgian Strong Pale Ale</option>
-            <option>Belgian Tripel</option>
-            <option>British Barleywine</option>
-            <option>English Old Ale</option>
-            <option>English Strong Ale</option>
-            <option>Scotch Ale / Wee Heavy</option>
-            <option>American Dark Wheat Ale</option>
-            <option>American Pale Wheat Ale</option>
-            <option>Belgian Witbier</option>
-            <option>Berliner Weisse</option>
-            <option>German Dunkelweizen</option>
-            <option>German Hefeweizen</option>
-            <option>German Kristalweizen</option>
-            <option>American Brett",
-            <option>American Wild Ale",
-            <option>Belgian Faro",
-            <option>Belgian Fruit Lambic",
-            <option>Belgian Gueuze",
-            <option>Belgian Lambic",
-            <option>Flanders Oud Bruin",
-            <option>Flanders Red Ale",
-            <option>Leipzig Gose",
+            <option>Smoke Porter</option>
+            <option>Vienna Lager</option>
+            <option>Winter Warmer</option>
           </select>
           <input type="submit" value="Go" class="btn btn-outline-primary">
         </form>
@@ -234,27 +233,38 @@ function drawAnnotations() {
 
     {% if attr_beers %}
     <h5>Beers like {{ beer_data.name }} but {{ direction }} {{ attr }}</h5>
-    <table>
-        <tr><td>Beer</td> 
-        <td>Style</td>
-        <td>ABV</td> </tr>
+    <table class="table">
+      <tr>
+        <th>Beer</th>
+        <th>Style</th>
+        <th>ABV</th>
+      </tr>
       {% for attr_beer in attr_beers %}
       <tr>
         <td><a href="{{ attr_beer.link }}" >{{ attr_beer.brewer }} - {{ attr_beer.name }}</a></td>
         <td>{{attr_beer.base_style}}</td>
         <td>{{attr_beer.abv}}</td>
-    </tr>
+      </tr>
       {% endfor %}
     </table>
     {% endif %}
 
     {% if style_beers %}
     <h5>Beers like {{ beer_data.name }} but in the {{ style }} style</h5>
-    <ul>
+    <table class="table">
+      <tr>
+        <th>Beer</th>
+        <th>Style</th>
+        <th>ABV</th>
+      </tr>
       {% for style_beer in style_beers %}
-      <li><a href="{{ style_beer.link }}" >{{ style_beer.name }}</a></li>
+      <tr>
+        <td><a href="{{ style_beer.link }}" >{{ style_beer.brewer }} - {{ style_beer.name }}</a></td>
+        <td>{{style_beer.base_style}}</td>
+        <td>{{style_beer.abv}}</td>
+      </tr>
       {% endfor %}
-    </ul>
+    </table>
     {% endif %}
 
 {% endblock %}