From 7c680af36862d7346654c63493ab3bf6116c45da Mon Sep 17 00:00:00 2001
From: Andre Casey <me@andrecasey.com>
Date: Fri, 7 Jun 2013 08:04:25 -0700
Subject: [PATCH] Fixes #1028: weird inventory item spacing for eggs and
 potions.

My test instance would only generate 1 dropped potion (after so much clicking!), so perfect alignment of dropped potions is not guaranteed with this commit.
---
 styles/app/inventory.styl | 17 +++++++++++++++--
 views/app/game-pane.html  |  2 +-
 views/app/pets.html       |  4 ++--
 3 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/styles/app/inventory.styl b/styles/app/inventory.styl
index 789d2d42d9..1cedbb12a7 100644
--- a/styles/app/inventory.styl
+++ b/styles/app/inventory.styl
@@ -20,13 +20,20 @@
     width: 100%
   td
     padding: 0.5em
-    width: 25%
+    //width: 25%
     &.active-pet
       background-color: $bad
       outline: 1px solid rgba(0,0,0,0.1)
       outline-offset: -1px
     &:hover, &:focus
       background-color: darken($better, 10%)
+    > div
+      margin:auto
+      margin-bottom:.5em
+  p
+    text-align:center
+    width:6.5em
+    height:2.5em
 
 .current-pet
     left: 0px
@@ -54,8 +61,14 @@
     clear:both
 .pets-menu > div
     float:left
-.hatchingPotions-menu > div
+    padding:.3em
+    p
+      text-align:center
+.hatchingPotion-menu > div
     float:left
+    padding:.3em
+    p
+      text-align:center
 
 .pet-button
     border: none
diff --git a/views/app/game-pane.html b/views/app/game-pane.html
index fb568f859c..5f148db398 100644
--- a/views/app/game-pane.html
+++ b/views/app/game-pane.html
@@ -111,7 +111,7 @@
         {/}
         <h4>Hatching Potions</h4>
         {#with _items.hatchingPotions as :hatchingPotion}
-        <table>
+        <table class="tab-pane pet-grid">
             <tr>
                 {#with :hatchingPotion[0]}<app:pets:hatchingPotion />{/}
                 {#with :hatchingPotion[1]}<app:pets:hatchingPotion />{/}
diff --git a/views/app/pets.html b/views/app/pets.html
index 59bef36f0a..494518f545 100644
--- a/views/app/pets.html
+++ b/views/app/pets.html
@@ -33,13 +33,13 @@
 <hatchingPotion:>
     <td class="active-hatchingPotion" x-bind="click:buyHatchingPotion" data-hatchingPotion='{.name}'>
         <div class="Pet_HatchingPotion_{.name}"></div>
-        {.text}<br/><small>{.value} Gems<small>
+        <p>{.text}<br/><small>{.value} Gems<small></p>
     </td>
 
 <egg:>
     <td class="active-egg" x-bind="click:buyEgg" data-egg='{.name}'>
         <div rel=tooltip class="Pet_Egg_{.name}"></div>
-        {.text}<br/><small>{.value} Gems<small>
+        <p>{.text}<br/><small>{.value} Gems<small></p>
     </td>
 
 <inventory:>