RCFilters: Fix saved filter name truncation for Firefox

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