From 01913b9dc00c8196fe471800f4c90cff2513d6a6 Mon Sep 17 00:00:00 2001
From: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Date: Mon, 17 Sep 2018 10:05:18 +0200
Subject: [PATCH] FIX: improves themes/components UI on mobile

---
 .../stylesheets/common/admin/customize.scss      |  5 -----
 app/assets/stylesheets/desktop.scss              |  1 +
 .../stylesheets/desktop/admin_customize.scss     | 16 ++++++++++++++++
 app/assets/stylesheets/mobile.scss               |  1 +
 .../stylesheets/mobile/admin_customize.scss      | 15 +++++++++++++++
 5 files changed, 33 insertions(+), 5 deletions(-)
 create mode 100644 app/assets/stylesheets/desktop/admin_customize.scss
 create mode 100644 app/assets/stylesheets/mobile/admin_customize.scss

diff --git a/app/assets/stylesheets/common/admin/customize.scss b/app/assets/stylesheets/common/admin/customize.scss
index 667393f66c8..2e4f9ffff72 100644
--- a/app/assets/stylesheets/common/admin/customize.scss
+++ b/app/assets/stylesheets/common/admin/customize.scss
@@ -63,7 +63,6 @@
     border-bottom: 1px solid $primary-low;
     padding-bottom: 8px;
     display: flex;
-    align-items: center;
 
     .title {
       color: $primary-medium;
@@ -134,10 +133,7 @@
     }
   }
   .show-current-style {
-    padding-left: 10px;
-    padding-top: 10px;
     display: inline-block;
-    width: 70%;
     vertical-align: top;
 
     .url {
@@ -205,7 +201,6 @@
     border-right: 1px solid $primary-low;
     border-bottom: 1px solid $primary-low;
     display: inline-block;
-    width: 28%;
     overflow: hidden;
   }
 
diff --git a/app/assets/stylesheets/desktop.scss b/app/assets/stylesheets/desktop.scss
index b1a6d6b8495..566ff7a51e2 100644
--- a/app/assets/stylesheets/desktop.scss
+++ b/app/assets/stylesheets/desktop.scss
@@ -21,6 +21,7 @@
 @import "desktop/queued-posts";
 @import "desktop/group";
 @import "desktop/groups";
+@import "desktop/admin_customize";
 
 // Import all component-specific files
 @import "desktop/components/*";
diff --git a/app/assets/stylesheets/desktop/admin_customize.scss b/app/assets/stylesheets/desktop/admin_customize.scss
new file mode 100644
index 00000000000..73ef095ec10
--- /dev/null
+++ b/app/assets/stylesheets/desktop/admin_customize.scss
@@ -0,0 +1,16 @@
+.admin-customize {
+  .show-current-style {
+    padding-left: 10px;
+    padding-top: 10px;
+    width: 70%;
+  }
+
+  .themes-list {
+    width: 28%;
+  }
+
+  .customize-themes-header {
+    flex-direction: row;
+    align-items: center;
+  }
+}
diff --git a/app/assets/stylesheets/mobile.scss b/app/assets/stylesheets/mobile.scss
index a6932013799..138123ecbbf 100644
--- a/app/assets/stylesheets/mobile.scss
+++ b/app/assets/stylesheets/mobile.scss
@@ -24,6 +24,7 @@
 @import "mobile/group";
 @import "mobile/groups";
 @import "mobile/dashboard_next";
+@import "mobile/admin_customize";
 @import "mobile/admin_reports";
 @import "mobile/admin_report";
 @import "mobile/admin_report_table";
diff --git a/app/assets/stylesheets/mobile/admin_customize.scss b/app/assets/stylesheets/mobile/admin_customize.scss
new file mode 100644
index 00000000000..76676e67448
--- /dev/null
+++ b/app/assets/stylesheets/mobile/admin_customize.scss
@@ -0,0 +1,15 @@
+.admin-customize {
+  .show-current-style {
+    padding: 0;
+    width: 100%;
+  }
+
+  .themes-list {
+    width: 100%;
+  }
+
+  .customize-themes-header {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+}