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-rightutility) on series values since it was redundant with theflex-grow: 1;rule on series labels - Adjusted the
line-heightandfont-weightto 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


