[Libreoffice-commits] online.git: loleaflet/css loleaflet/src
Tor Lillqvist
tml at collabora.com
Wed Jul 4 13:48:44 UTC 2018
loleaflet/css/leaflet.css | 10 +++++++---
loleaflet/src/map/Map.js | 6 +-----
2 files changed, 8 insertions(+), 8 deletions(-)
New commits:
commit 26b5a3745e79bd1c5a0142591de0e6b0a921fa94
Author: Tor Lillqvist <tml at collabora.com>
Date: Wed Jul 4 16:42:15 2018 +0300
Better and more dynamic way to show ruler conditionally
Use conditional CSS, setting the ruler height to zero if it would be
too high. Now the ruler even shows up and disappears dynamically as
the window height changes, for instance when turning a mobile device
between landscape and portrait orientation. No JS conditional needed
after all.
Change-Id: Iebfbd182d1675f4d6abd2f252389fdcdf46ed4d3
diff --git a/loleaflet/css/leaflet.css b/loleaflet/css/leaflet.css
index 6cee86cf2..d42802bef 100644
--- a/loleaflet/css/leaflet.css
+++ b/loleaflet/css/leaflet.css
@@ -775,14 +775,18 @@ input.clipboard {
.loleaflet-ruler {
background-color: #efefef;
- /* If you change the below 20px, also change the window height limit
- * in the doclayerinit thing in Map.js.
- */
height: 20px;
width: 100vw;
margin: 0px;
}
+/* The 20px above is 5% of the 400px below. */
+ at media screen and (max-height: 400px) {
+ .loleaflet-ruler {
+ height: 0px;
+ }
+}
+
.loleaflet-ruler-breakcontainer {
height: 100%;
position: absolute;
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index ed864093c..609153900 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -118,11 +118,7 @@ L.Map = L.Evented.extend({
if (!this.initComplete) {
this._fireInitComplete('doclayerinit');
}
- // Don't show the ruler if the window is small. Use 5% of window height as
- // the fairly arbitrary limit how high the ruler can be. We "know" (from
- // leaflet.css, .loleaflet-ruler, height) that the ruler height is 20px.
- // That makes the limit 400px.
- if ($(window).height() >= 400 && this._docLayer._docType == 'text') {
+ if (this._docLayer._docType == 'text') {
var interactiveRuler = this._permission === 'edit' ? true : false;
L.control.ruler({position:'topleft', interactive:interactiveRuler}).addTo(this);
}
More information about the Libreoffice-commits
mailing list