The design for the Australis theme refresh calls for tab text that needs to be
truncated to be faded out instead of using an ellipsis. This fade should be a
fixed width (say 2em) regardless of the width of the tab, and apparently needs
to work over non-solid color backgrounds (so a right-aligned <div> over the top
with a fading out gradient won't work).
Unfortunately we don't seem to have a good way to do that right now. Using an
SVG mask containing a rect with a gradient fill you can kind of get close, but
the width of the fade will vary with the width of the object to which the mask
is being applied. (Extending SVG length attributes to support CSS calc() would
help, but that's far from trivial.)
One way to cater for this use case is perhaps to extend the 'text-overflow'
property to take a value |fade <length>| or |fade(<length>)| or something.
Another more general solution might be to extend the 'overflow' property to take
a value |fade-rect(<length>, <length>, <length>, <length>)| or something like that.
Thoughts?
http://dev.w3.org/csswg/css-ui/#text-overflow0
http://dev.w3.org/csswg/css-overflow/#overflow
_______________________________________________
dev-platform mailing list
dev-platform@lists.mozilla.org
https://lists.mozilla.org/listinfo/dev-platform
