Add bootstrap popover for cover/vinyl condition

diff --git a/diggersdigest/templates/shop/product.html b/diggersdigest/templates/shop/product.html
index 4f2e8831e6a5dcccf3f7ab29b31880f6efbdb6cd..4d4000251242661e963ac94ed694a2706a63d3de 100644 (file)
--- a/diggersdigest/templates/shop/product.html
+++ b/diggersdigest/templates/shop/product.html
@@ -34,6 +34,12 @@ $(document).ready(function() {
     });
 });
 </script>
+<script>
+$(function () {
+  $('[data-toggle="popover"]').popover()
+})
+</script>
+
 {% endblock %}
 
 {% block extra_head %}
@@ -104,11 +110,20 @@ $(document).ready(function() {
   {% endif %}
   <li>
     {% trans "Cover:" %}
-    {{ product.records.first.cover_condition }} </li>
+    <a class="badge" tabindex="0" role="button" data-toggle="popover" data-trigger="hover focus"
+      title="{{ product.records.first.cover_condition.name }}"
+    data-content="{{ product.records.first.cover_condition.description }}">
+    {{ product.records.first.cover_condition.abbr }}
+  </a>
+  </li>
   <li>
     {% trans " Vinyl:" %}
-    {{ product.records.first.vinyl_condition }} </li>
-
+    <a class="badge" tabindex="0" role="button" data-toggle="popover" data-trigger="hover focus"
+      title="{{ product.records.first.vinyl_condition.name }}"
+    data-content="{{ product.records.first.cover_condition.description }}">
+    {{ product.records.first.vinyl_condition.abbr }}
+  </a>
+  </li>
 </ul>