In the OpenLMIS-UI, we have the need to support really, really, really large tables. The HTML DOM has trouble supporting anything with that many elements. We need to support tables from 1,000 cells to around 50,000 cells.
To do this, we will create a new Angular Directive, called the OpenLMIS Table Page.
The OpenLMIS Table Page will implement virtual scrolling on the table, so that the minimum amount of table cells are rendered on the table at any given time. The page will fit in the browser window such that only the table scrolls, no other items on the page will scroll.
Implement cluster.js Angular Material Virtual Repeat
Use perfect-scrollbar to keep scrollbar always visible to users
Make styleguide page documenting the page and layout
Implement the OpenLMIS Table Page on the batch requisition screens
Window doesn't scroll - table vertically scrolls
Actions toolbar will no longer move, or overlap with table at all
Page header will always be visible
Removed border line below breadcrumbs
Table footer is black to be more defined
Better defined borders for "sticky" elements
A shadow that was visible when sticky elements "got stuck" is now always visible