RCFilters: Fix saved filter name truncation for Firefox
Firefox seem to have a bit of trouble with variable-width flexbox
div that need to be truncated with an ellipses.
This fix includes a couple of changes:
* Split the three elements of the title into three separate divs,
and define the flex divs properly for a variable-width one in
the middle.
* Taking advantage of #1, clean up the class names too (move to
under '-top-xxx' classes for better organization in the LESS
file too.
* Add a max-width: 100% rule to the label that gets
truncated; this seems to force Firefox to recalculate its proper
width while in flexbox and actually add the ellipses.
Bug: T197835
Change-Id: Ibe2002a5fe9006f262b2256cae222fed9e9a8fd0