Display unit price on /cart page

- Use a new class to specify css customization
 - Add to `line_item.rb` a fake method: `unit_price_price_and_unit` @andrewpbrett will change it with real values.
 - Add a new variable: $text-xs to specify small font-size


squash "Display unit price on /cart page"

app/assets/stylesheets/darkswarm/cart-page.scss

@@ -44,6 +44,12 @@
     }
   }
 
+  .unit-price {
+    color: $grey-500;
+    font-size: $text-xs;
+  }
+
+
   input {
     &.ng-invalid-stock,
     &.ng-invalid-number {

app/assets/stylesheets/darkswarm/variables.scss

@@ -45,3 +45,5 @@ $shop-sidebar-overlay: rgba(0, 0, 0, 0.5);
 $transition-sidebar: 250ms ease-in-out 0s;
 
 $padding-small: 0.5rem;
+
+$text-xs: 0.75rem;

app/models/spree/line_item.rb

@@ -219,6 +219,12 @@ module Spree
       final_weight_volume / quantity
     end
 
+    def unit_price_price_and_unit
+      price = Spree::Money.new((rand * 10).round(2), currency: currency)
+      unit = ["item", "kg"].sample
+      price.to_html + " / " + unit
+    end
+
     def scoper
       @scoper ||= OpenFoodNetwork::ScopeVariantToHub.new(order.distributor)
     end

app/views/spree/orders/_line_item.html.haml

@@ -18,6 +18,10 @@
 
   %td.text-right.cart-item-price{"data-hook" => "cart_item_price"}
     = line_item.single_display_amount_with_adjustments.to_html
+    - if feature? :unit_price, spree_current_user
+      %br
+      %span.unit-price
+        = line_item.unit_price_price_and_unit
   %td.text-center.cart-item-quantity{"data-hook" => "cart_item_quantity"}
     - finalized_quantity = @order.completed? ? line_item.quantity : 0
     = item_form.number_field :quantity,