From a04c2ccd6e5bdc5ca6f519443963d21c69c2d9a3 Mon Sep 17 00:00:00 2001
From: Matt-Yorkley <9029026+Matt-Yorkley@users.noreply.github.com>
Date: Tue, 6 Oct 2020 14:16:18 +0100
Subject: [PATCH] Make producers and groups pages usable on mobile

---
 app/assets/stylesheets/darkswarm/producer_node.scss | 5 +++++
 app/views/producers/_fat.html.haml                  | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/darkswarm/producer_node.scss b/app/assets/stylesheets/darkswarm/producer_node.scss
index 707c5d903b..93a9d4ae58 100644
--- a/app/assets/stylesheets/darkswarm/producer_node.scss
+++ b/app/assets/stylesheets/darkswarm/producer_node.scss
@@ -5,6 +5,11 @@
   .active_table .active_table_node {
     // Header row
     @include breakpoint(phablet) {
+      .active_table_row {
+        display: inline-block;
+        width: 100%;
+      }
+
       .skinny-head {
         background-color: $clr-turquoise-light;
 
diff --git a/app/views/producers/_fat.html.haml b/app/views/producers/_fat.html.haml
index 35156e3c51..227e5dca39 100644
--- a/app/views/producers/_fat.html.haml
+++ b/app/views/producers/_fat.html.haml
@@ -1,6 +1,6 @@
 .row.active_table_row{"ng-if" => "open()", "ng-click" => "toggle($event)", "ng-class" => "{'open' : open()}"}
   .columns.small-12.fat.text-center{"ng-show" => "open() && shopfront_loading"}
-    %p
+    %p.fullwidth
       %img.spinner.text-center{ src: image_path("spinning-circles.svg") }
 
   .columns.small-12.medium-7.large-7.fat{"ng-show" => "open() && !shopfront_loading"}