Positions the order_cycle according to shop-tabs

- Move from `enterprises/shop.html.haml` to `shopping_shared/_tabs.html.haml` to handle its position correctly
 - Remove marginTop and height to order cycle component and display it relative to parent's bottom (ie. the columns in `tab-buttons`)
- Adjust z-index to display the entire component

app/assets/stylesheets/darkswarm/_shop-navigation.scss

@@ -181,11 +181,10 @@ shop ordercycle {
   }
 }
 
-shop navigation ordercycle {
-  margin-top: 3.4em;
+shop .tab-buttons ordercycle {
   padding: 1em;
-  height: 7.6em;
   position: absolute;
+  bottom: 0;
   right: 1em;
 }
 

app/assets/stylesheets/darkswarm/shop_tabs.scss

@@ -9,7 +9,7 @@
     color: $dark-grey;
     box-shadow: $distributor-header-shadow;
     position: relative;
-    z-index: 10;
+    z-index: 21; // +1 from .darkswarm navigation
 
     .columns {
       display: flex;

app/views/enterprises/shop.html.haml

@@ -20,10 +20,6 @@
   - content_for :order_cycle_form do
     = render partial: "change_order_cycle"
 
-  - content_for :ordercycle_sidebar do
-    .show-for-large-up.large-4.columns
-      = render partial: "shopping_shared/order_cycles"
-
   = render partial: "shopping_shared/header"
   = render partial: "shopping_shared/tabs"
 

app/views/shopping_shared/_tabs.html.haml

@@ -5,10 +5,11 @@
 
   #shop-tabs{ ng: { controller: "PageSelectionCtrl", init: "whitelistPages(#{shop_tab_names.to_json})", cloak: true } }
     .tab-buttons
-      .row
+      .flex.row
         .columns.small-12.large-8
           - shop_tabs.each do |tab|
             .page{ "ng-class" => "{ selected: selectedPage() == '#{tab[:name]}' }" }
               %a{ href: "##{tab[:name]}" }=tab[:title]
-
+        .columns.large-4.show-for-large-up
+          = render partial: "shopping_shared/order_cycles"
     .page-view{ ng: {include: "'shop/' + selectedPage() + '.html'" } }