Tooltips: improve upon PR #513, plus add rule-only css

Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I2a6868e25ceddc9a6f5d383e6ecf41836ecdfc28
CollaboraOnline · Nov 9, 2020 · 46446f2 · 46446f2
1 parent 9973736
commit 46446f2
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/loleaflet/css/loleaflet.css b/loleaflet/css/loleaflet.css
@@ -511,6 +511,11 @@ body {
 	border-color: #2a2a2a;
 	visibility: hidden;
 }
+.loleaflet-ruler-left[data-title]:after,
+.loleaflet-ruler-right[data-title]:after {
+	bottom: -2.8em;
+	left: auto;
+}
 [data-title] {
 	position: relative;
 }

diff --git a/loleaflet/src/control/Ruler.js b/loleaflet/src/control/Ruler.js
@@ -366,8 +366,13 @@ L.Control.Ruler = L.Control.extend({
 			this._lToolTip = L.DomUtil.create('div', 'loleaflet-ruler-ltooltip', this._lMarginDrag);
 			this._rMarginDrag = L.DomUtil.create('div', 'loleaflet-ruler-drag loleaflet-ruler-right', this._rMarginWrapper);
 			this._rToolTip = L.DomUtil.create('div', 'loleaflet-ruler-rtooltip', this._rMarginDrag);
-			this._lMarginDrag.title = _('Left Margin');
-			this._rMarginDrag.title = _('Right Margin');
+			var rulerLeftMargin = _('Left Margin');
+			var rulerRightMargin = _('Right Margin');
+
+			this._lMarginDrag.dataset.title = rulerLeftMargin;
+			this._lMarginDrag.setAttribute('aria-label', rulerLeftMargin);
+			this._rMarginDrag.dataset.title = rulerRightMargin;
+			this._rMarginDrag.setAttribute('aria-label', rulerRightMargin);
 
 			if (window.ThisIsTheiOSApp) {
 				this.options.interactive = true;