From 4139972f721aaa01577afa4af12212fdaf93f7e2 Mon Sep 17 00:00:00 2001 From: Simon Busborg Date: Thu, 7 Jan 2016 11:20:13 +0100 Subject: [PATCH] Fixes: U4-7564 "Save and publish" button menu skewed [7.4.0-beta] So I tested it on a Surface and got the same result as you. We get this "bug" because of how bootstrap handles dropdowns on mobile/tablets. Bootstrap detect Suface as a tablet, and therefor pushed an element to the DOM called `dropdown-backdrop`. Disabling this will fix the "bug". But we need to be aware of this taken from http://getbootstrap.com/javascript/ >''"On mobile devices, opening a dropdown adds a `.dropdown-backdrop` as a tap area for closing dropdown menus when tapping outside the menu, a requirement for proper iOS support. This means that switching from an open dropdown menu to a different dropdown menu requires an extra tap on mobile."'' Since it's a very old Bootstrap we're using I took the liberty to just add `.btn-group .dropdown-backdrop` `display: none` so that the element wouldn't appear in the DOM anymore. --- src/Umbraco.Web.UI.Client/src/less/hacks.less | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/Umbraco.Web.UI.Client/src/less/hacks.less b/src/Umbraco.Web.UI.Client/src/less/hacks.less index 549f65d668..10f2df3fbb 100644 --- a/src/Umbraco.Web.UI.Client/src/less/hacks.less +++ b/src/Umbraco.Web.UI.Client/src/less/hacks.less @@ -31,6 +31,10 @@ max-width: none !important; } +.btn-group .dropdown-backdrop { + display: none; +} + /* loading animation for iframes and content pages */ iframe, .content-column-body { background: center center url(../img/loader.gif) no-repeat;