Skip to content

Instantly share code, notes, and snippets.

@alump
Created December 21, 2017 13:40
Show Gist options
  • Save alump/cfa7b08a0973a53303a6be8cc83d1e16 to your computer and use it in GitHub Desktop.
Save alump/cfa7b08a0973a53303a6be8cc83d1e16 to your computer and use it in GitHub Desktop.
Way we did this on our px-data-grid wrapper
ready() {
super.ready();
this._vaadinGrid = this.shadowRoot.querySelector('vaadin-grid');
// ...
// Attach scroll listener for styling
this._boundedScrollListener = this._scrollListener.bind(this);
this._vaadinGrid.$.outerscroller.addEventListener('scroll', this._boundedScrollListener);
// ...
}
_scrollListener(e) {
if (e.target.scrollLeft != 0) {
this._vaadinGrid.setAttribute('horizontal-offset', 'true');
} else {
this._vaadinGrid.removeAttribute('horizontal-offset');
}
}
// and in theme
[part~="cell"][last-frozen] {
border-right: 0px solid transparent;
transition: border 0.3s ease-out;
}
:host([horizontal-offset]) [part~="cell"][last-frozen] {
border-right: 1px solid var(--px-data-grid-separator-color);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment