All client code is wrapped in a closure, and all of Lanes applications are created under the
window.Lanes object. This prevents conflicts with other code that may be defined on the page.
All syles are defined using SCSS, and is scoped under the
lanes css class. This class is automatically added to the element that Lanes is attached to. While this can lead to deeply nested css rules, it’s a tradeoff that Lanes makes in order to ensure that rules do not apply to elements outside it’s rendering area.
Lanes uses a “onscroll” jquery plugin that’s based off of the css-element-queries polyfill. The plugin alerts Lanes whenever it’s parent DOM element changes dimensions. Lanes then sets either a
lg css class on the parent view.
A lightly modified copy of the Bootstrap css framework then observes these css classes instead of using media-queries. This allows lanes to size it’s elements appropriately even if it’s rendered to a div that is set to only occupy a portion of the screen width.