[Libreoffice-commits] online.git: loleaflet/css

[Libreoffice Gerrit user]

 loleaflet/css/leaflet.css   |    2 +-
 loleaflet/css/loleaflet.css |    2 +-
 loleaflet/css/menubar.css   |   22 +++++++++++++++++++++-
 3 files changed, 23 insertions(+), 3 deletions(-)

New commits:
commit 25e4bb1c5116fae92e6d1c30d5858effaa3fedba
Author:     Henry Castro <hcastro at collabora.com>
AuthorDate: Wed Oct 3 21:49:31 2018 -0400
Commit:     Henry Castro <hcastro at collabora.com>
CommitDate: Tue Oct 9 15:54:50 2018 -0400

    loleaflet: mobile: use max-device-height media query
    
    max-height it is used for window size, max-device-height
    it is the device screen dimensions, so when a tablet
    rotate to landscape we keep the mobile layout
    
    Change-Id: I921007014a63374114ec7563144f3532a53fd021
    Reviewed-on: https://gerrit.libreoffice.org/61339
    Reviewed-by: Jan Holesovsky <kendy at collabora.com>
    Tested-by: Jan Holesovsky <kendy at collabora.com>

diff --git a/loleaflet/css/leaflet.css b/loleaflet/css/leaflet.css
index 332490ed5..3dde4a01a 100644
--- a/loleaflet/css/leaflet.css
+++ b/loleaflet/css/leaflet.css
@@ -788,7 +788,7 @@ input.clipboard {
 	}
 }
 
- at media (max-width: 768px),(max-height: 768px) {
+ at media (max-width: 768px),(max-device-height: 768px) {
 	.loleaflet-ruler {
 		height: 0px;
 		display: none;
diff --git a/loleaflet/css/loleaflet.css b/loleaflet/css/loleaflet.css
index f0cabadca..5fb1d9a0a 100644
--- a/loleaflet/css/loleaflet.css
+++ b/loleaflet/css/loleaflet.css
@@ -81,7 +81,7 @@ body {
     width: 0;
 }
 
- at media (max-width: 768px),(max-height: 768px) {
+ at media (max-width: 768px), (max-device-height: 768px) {
     /* Show slidesorter beyond 768px only */
     #presentation-controls-wrapper {
 	display: none;
diff --git a/loleaflet/css/menubar.css b/loleaflet/css/menubar.css
index 7af9d31b6..f248ec4e0 100644
--- a/loleaflet/css/menubar.css
+++ b/loleaflet/css/menubar.css
@@ -191,7 +191,7 @@
 }
 
 /* desktop mode */
- at media (min-width: 769px) and (orientation: portrait),(min-height: 769px) and (orientation: landscape) {
+ at media (min-width: 769px) {
     /* hide the button in desktop view */
     .main-menu-btn {
 	position: absolute;
@@ -220,6 +220,26 @@
     }
 }
 
+ at media (max-device-height: 768px) {
+    .main-menu-btn {
+	position: relative;
+	top: 5px;
+    }
+
+    #main-menu-state:not(:checked) ~ #main-menu {
+	display: none;
+    }
+
+    #main-menu {
+	top: 39px !important;
+    }
+
+    .main-nav {
+	position: absolute;
+	width: 100%;
+    }
+}
+
 /* Some more lo-menu specific customizations */
 
 /* The smartmenus plugin doesn't seem to have support for icons, so implement our own pseudo-elements */