From 0a300d18020eaf53a6eb8a07b9ac15c3766429ae Mon Sep 17 00:00:00 2001
From: Rob Harrington <oeoeaio@gmail.com>
Date: Fri, 6 Mar 2015 19:03:46 +1100
Subject: [PATCH] Rewriting small cart, so that it doesn't break all of the
 dropdowns on the page (can't use .row within li elements it seems...)

---
 .../darkswarm/shopping-cart.css.sass          | 34 ++++++++------
 app/views/shared/menu/_cart.html.haml         | 47 +++++++++----------
 2 files changed, 43 insertions(+), 38 deletions(-)

diff --git a/app/assets/stylesheets/darkswarm/shopping-cart.css.sass b/app/assets/stylesheets/darkswarm/shopping-cart.css.sass
index 72856eba72..0cd0f20fac 100644
--- a/app/assets/stylesheets/darkswarm/shopping-cart.css.sass
+++ b/app/assets/stylesheets/darkswarm/shopping-cart.css.sass
@@ -20,21 +20,27 @@
       right: 22px !important
       left: auto
 
-    ul, li
-      list-style: none
-      margin-left: 0
+    table
+      width: 100%
+      border: none
+      border-spacing: 0px
+      margin-bottom: 5px
 
-    li
-      float: none
-
-      .row .columns
-        padding-left: 0.25rem
-        padding-right: 0.25rem
-
-    li.total-cart
-      background-color: #424242
-    li.product-cart
-      border-top: 1px solid #424242
+      tr.total-cart
+        color: #fff
+        background-color: #424242
+        td
+          color: #fff
+      tr.product-cart
+        background-color: #333333
+        border-top: 1px solid #424242
+        td
+          padding: 4px 12px
+          color: #fff
+    .buttons
+      .button
+        height: auto
+        top: 0px
 
 #cart-detail
   .cart-item-delete
diff --git a/app/views/shared/menu/_cart.html.haml b/app/views/shared/menu/_cart.html.haml
index 646bd33425..aa7f7940c9 100644
--- a/app/views/shared/menu/_cart.html.haml
+++ b/app/views/shared/menu/_cart.html.haml
@@ -10,34 +10,33 @@
     %span.joyride-nub.top
     .joyride-content-wrapper
       %h5 Your shopping cart
-      %ul
-        %li.product-cart{"ng-repeat" => "line_item in Cart.line_items_present()",
+      %table
+        %tr.product-cart{"ng-repeat" => "line_item in Cart.line_items_present()",
         "ng-controller" => "LineItemCtrl", "id" => "cart-variant-{{ line_item.variant.id }}"}
-          .row
-            .columns.small-7
-              %small
-                %strong {{ line_item.variant.name_to_display }}
-                %em {{ line_item.variant.unit_to_display }}
-            .columns.small-3.text-right
-              %small
-                %span.quantity {{ line_item.quantity }}
-                %i.ofn-i_009-close
-                %span.price {{ line_item.variant.price_with_fees | localizeCurrency }}
+          %td
+            %small
+              %strong {{ line_item.variant.name_to_display }}
+              %em {{ line_item.variant.unit_to_display }}
+          %td.text-right
+            %small
+              %span.quantity {{ line_item.quantity }}
+              %i.ofn-i_009-close
+              %span.price {{ line_item.variant.price_with_fees | localizeCurrency }}
 
-            .columns.small-2
-              %small
-                \=
-                %strong
-                  .total-price.right {{ line_item.variant.totalPrice() | localizeCurrency }}
+          %td
+            %small
+              \=
+              %strong
+                .total-price.right {{ line_item.variant.totalPrice() | localizeCurrency }}
 
-        %li.total-cart{"ng-show" => "Cart.line_items_present().length > 0"}
-          .row
-            .columns.small-6
-              %em Total:
-            .columns.small-6.text-right
-              %strong {{ Cart.total()  | localizeCurrency }}
+      %table{"ng-show" => "Cart.line_items_present().length > 0"}
+        %tr.total-cart
+          %td
+            %em Total:
+          %td.text-right
+            %strong {{ Cart.total()  | localizeCurrency }}
 
-      .text-right
+      .buttons.text-right
         %a.button.secondary.tiny.add_to_cart{ href: cart_path, type: :submit, "ng-disabled" => "Cart.dirty || Cart.empty()", "ng-class" => "{ dirty: Cart.dirty }" }
           {{ Cart.dirty ? 'Updating cart...' : (Cart.empty() ? 'Cart empty' : 'Edit your cart' ) }}
         %a.button.primary.tiny{href: checkout_path, "ng-disabled" => "Cart.dirty || Cart.empty()"}  Checkout now