Merge "Fix range comment popup positioning"

This commit is contained in:
Kasper Nilsson 2017-06-29 20:31:42 +00:00 committed by Gerrit Code Review
commit 8a2cd86f68
4 changed files with 14 additions and 5 deletions

View File

@ -21,7 +21,7 @@ limitations under the License.
<dom-module id="gr-diff-highlight">
<template>
<style include="shared-styles">
.contentWrapper ::content {
:host {
position: relative;
}
.contentWrapper ::content .range {
@ -32,6 +32,13 @@ limitations under the License.
background-color: rgba(255,255,0,0.5);
display: inline;
}
gr-selection-action-box {
/**
* Needs z-index to apear above wrapped content, since it's inseted
* into DOM before it.
*/
z-index: 10;
}
</style>
<div class="contentWrapper">
<content></content>

View File

@ -267,7 +267,8 @@
// TODO (viktard): Drop empty first and last lines from selection.
const actionBox = document.createElement('gr-selection-action-box');
Polymer.dom(this.root).appendChild(actionBox);
const root = Polymer.dom(this.root);
root.insertBefore(actionBox, root.firstElementChild);
actionBox.range = {
startLine: start.line,
startChar: start.column,

View File

@ -56,11 +56,12 @@
},
placeAbove(el) {
Polymer.dom.flush();
const rect = this._getTargetBoundingRect(el);
const boxRect = this.getBoundingClientRect();
const parentRect = this.parentElement.getBoundingClientRect();
this.style.top =
rect.top - parentRect.top - boxRect.height - 4 + 'px';
rect.top - parentRect.top - boxRect.height - 6 + 'px';
this.style.left =
rect.left - parentRect.left + (rect.width - boxRect.width) / 2 + 'px';
},

View File

@ -123,13 +123,13 @@ limitations under the License.
test('placeAbove for Element argument', () => {
element.placeAbove(target);
assert.equal(element.style.top, '27px');
assert.equal(element.style.top, '25px');
assert.equal(element.style.left, '72px');
});
test('placeAbove for Text Node argument', () => {
element.placeAbove(target.firstChild);
assert.equal(element.style.top, '27px');
assert.equal(element.style.top, '25px');
assert.equal(element.style.left, '72px');
});