From c0c0a58c447089612133f123a141cb224775f865 Mon Sep 17 00:00:00 2001
From: maartenkling <maarten@fourdigits.nl>
Date: Wed, 22 Mar 2017 16:04:48 +0100
Subject: [PATCH] Change buttons for mobile #2780

---
 CHANGELOG.txt                                          |  1 +
 CONTRIBUTORS.rst                                       |  1 +
 docs/releases/1.10.rst                                 |  1 +
 .../static_src/wagtailadmin/scss/core.scss             | 10 ++++++++++
 .../wagtailadmin/scss/layouts/page-editor.scss         |  9 ++++++++-
 5 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.txt b/CHANGELOG.txt
index 7007efec55..4dd674d25e 100644
--- a/CHANGELOG.txt
+++ b/CHANGELOG.txt
@@ -37,6 +37,7 @@ Changelog
  * Fix: Ensure that number localisation is not applied to object IDs within admin templates (Tom Hendrikx)
  * Fix: Paginating with a search present was always returning the 1st page in Internet Explorer 10 & 11 (Ralph Jacobs)
  * Fix: RoutablePageMixin and wagtailforms previews now set the `request.is_preview` flag (Wietze Helmantel)
+ * Fix: The save and preview buttons in the page editor are now mobile-friendly (Maarten Kling)
 
 
 1.9 (16.02.2017)
diff --git a/CONTRIBUTORS.rst b/CONTRIBUTORS.rst
index c24f647693..bc096317b6 100644
--- a/CONTRIBUTORS.rst
+++ b/CONTRIBUTORS.rst
@@ -223,6 +223,7 @@ Contributors
 * Wietze Helmantel
 * Patrick Gerken
 * Will Giddens
+* Maarten Kling
 
 Translators
 ===========
diff --git a/docs/releases/1.10.rst b/docs/releases/1.10.rst
index d65b484885..89fb379791 100644
--- a/docs/releases/1.10.rst
+++ b/docs/releases/1.10.rst
@@ -49,6 +49,7 @@ Bug fixes
  * Ensure that number localisation is not applied to object IDs within admin templates (Tom Hendrikx)
  * Paginating with a search present was always returning the 1st page in Internet Explorer 10 & 11 (Ralph Jacobs)
  * RoutablePageMixin and wagtailforms previews now set the ``request.is_preview`` flag (Wietze Helmantel)
+ * The save and preview buttons in the page editor are now mobile-friendly (Maarten Kling)
 
 
 Upgrade considerations
diff --git a/wagtail/wagtailadmin/static_src/wagtailadmin/scss/core.scss b/wagtail/wagtailadmin/static_src/wagtailadmin/scss/core.scss
index 45cde94349..6ab611a223 100644
--- a/wagtail/wagtailadmin/static_src/wagtailadmin/scss/core.scss
+++ b/wagtail/wagtailadmin/static_src/wagtailadmin/scss/core.scss
@@ -179,6 +179,16 @@ footer {
             }
         }
     }
+
+    @media screen and (max-width: $breakpoint-mobile) {
+        .actions {
+            width: 100%;
+        }
+
+        .meta p {
+            white-space: normal;
+        }
+    }
 }
 
 ::-webkit-scrollbar {
diff --git a/wagtail/wagtailadmin/static_src/wagtailadmin/scss/layouts/page-editor.scss b/wagtail/wagtailadmin/static_src/wagtailadmin/scss/layouts/page-editor.scss
index 8b2c38db68..8c676bdb70 100644
--- a/wagtail/wagtailadmin/static_src/wagtailadmin/scss/layouts/page-editor.scss
+++ b/wagtail/wagtailadmin/static_src/wagtailadmin/scss/layouts/page-editor.scss
@@ -351,6 +351,13 @@
 footer .preview {
     button,
     .button {
+        @media screen and (max-width: $breakpoint-mobile) {
+            width: 100%;
+            margin-top: 2px;
+            margin-bottom: 2px;
+            height: 3em;
+        }
+
         background-color: lighten($color-grey-2, 10%);
         border-color: lighten($color-grey-2, 10%);
 
@@ -424,7 +431,7 @@ footer .preview {
                 width: 100%;
                 padding-left: 6.4em;
             }
-            
+
             &:hover .object-help {
                 opacity: 1;
             }