This change adds a component to handle the layout of labels so that
values are lined up.
The process for doing this is as follows:
- Compute all of the label values and sort them.
- For each label, determine a number of placeholder elements needed so
that the first label is in the position determined by the sorted list
of labels
ex: sorted values = [-2, -1, 0, 1, 2]
particular lable values = [0, 1, 2]
requires 2 placeholders
Placeholders are used rather than padding so that items wrapping to
the next line works as expected. An array of empty items is computed.
There is also a placeholder after the values used for centering
content on small screens.
- In each of the iron selectors, There are two dom-repeats. First, the
computed blank items, and then the actual label values.
Note: there is a new media query value of max-width: 25em that is not
currently used on the app. This is intentional, as using a 50em
breakpoint does not make sense here. The goal is to keep all labels
on the same line without increasing vertical space when unnecessary.
Bug: Issue 5757
Change-Id: I99564cff7a3e49252dd695f189f2654e97c86fbe
a499e3d938