add payment description to checkout

app/serializers/api/payment_method_serializer.rb

@@ -1,3 +1,3 @@
 class Api::PaymentMethodSerializer < ActiveModel::Serializer
-  attributes :name, :id, :method_type
+  attributes :name, :description, :id, :method_type
 end

app/views/checkout/_payment.html.haml

@@ -17,6 +17,7 @@
             %em
               %small
                 {{ Checkout.paymentMethod().name }}
+            %small
           .small-4.medium-2.columns.text-right
             %span.accordion-up
               %em
@@ -29,16 +30,20 @@
 
       -# TODO render this in Angular instead of server-side
       -# The problem being how to render the partials
-      - current_order.available_payment_methods.each do |method|
-        .row
-          .small-12.columns
-            %label
-              = radio_button_tag "order[payments_attributes][][payment_method_id]", method.id, false,
-                required: true,
-                "ng-model" => "order.payment_method_id"
-              = method.name
+      .row
+        .small-6.columns
+          - current_order.available_payment_methods.each do |method|
+            .row
+              .small-12.columns
+                %label
+                  = radio_button_tag "order[payments_attributes][][payment_method_id]", method.id, false,
+                    required: true,
+                    "ng-model" => "order.payment_method_id"
+                  = method.name
 
-        .row{"ng-if" => "order.payment_method_id == #{method.id}"}
-          .small-12.columns
-            = render partial: "spree/checkout/payment/#{method.method_type}", :locals => { :payment_method => method }
+            .row{"ng-if" => "order.payment_method_id == #{method.id}"}
+              .small-12.columns
+                = render partial: "spree/checkout/payment/#{method.method_type}", :locals => { :payment_method => method }
+        .small-6.columns
+          %small {{ Checkout.paymentMethod().description }}