Fix chart tooltips and make popovers comply with design specs
After the removal of application.css
, we noticed some visual regressions in chart legends and tooltips in Storybook.
The legends were fixed in a separate MR. This MR focuses on fixing styles in the tooltips.
Here's what we've done here:
- Converted utility classes to utility mixins
- Dropped unnecessary
float: right;
rule (via the the.pull-right
utility) on series values since it was redundant with theflex-grow: 1;
rule on series labels - Adjusted the
line-height
andfont-weight
to improve compliance with the design specs
Before (w/o application.css) | Before (w/ application.css) | After |
---|---|---|
While working on the fixes above, we noticed that popovers weren't exactly complying with our design specs. Since chart tooltips and popovers are closely tied, we fixed popovers' styling, they should now comply with Pajamas and have been marked as such with the followsDesignSpecs
flag.
Closes #457 (closed)
Edited by Paul Gascou-Vaillancourt