Add unit price information into the bulk buy modal

- Pass a parameter to scope: showunitprice and display unit price information if it's true

app/assets/javascripts/darkswarm/directives/shop_variant_with_unit_price.js.coffee

@@ -4,4 +4,5 @@ Darkswarm.directive "shopVariantWithUnitPrice", ->
   templateUrl: 'shop_variant_with_unit_price.html'
   scope:
     variant: '='
+    show_unit_price: '=showunitprice'
   controller: 'ShopVariantCtrl'

app/assets/javascripts/templates/bulk_buy_modal.html.haml

@@ -2,12 +2,21 @@
   .columns.small-12
     %h3{"ng-bind" => "::variant.extended_name"}
 
-.row.variant-bulk-buy-price-summary
-  .columns.small-6
-    .variant-unit {{ ::variant.unit_to_display }}
-  .columns.small-6
+.flex.variant-bulk-buy-price-summary{style: "justify-content: space-around;"}
+  .variant-unit
+    {{ ::variant.unit_to_display }}
+  .div
     {{ variant.line_item.total_price | localizeCurrency }}
 
+  .unit-price{"ng-if": "show_unit_price"}
+    %question-mark-with-tooltip{"question-mark-with-tooltip": "_",
+    "question-mark-with-tooltip-append-to-body": "true",
+    "question-mark-with-tooltip-placement": "top",
+    "question-mark-with-tooltip-animation": true,
+    style: "margin-right: 5px",
+    key: "'js.shopfront.unit_price_tooltip'"} 
+    {{ variant.unit_price_price | localizeCurrency }} / {{ variant.unit_price_unit }}
+
 .row
   .columns.small-12.medium-6
     .variant-bulk-buy-quantity-label