Baseline History
This story has no baseline yet. Accept this story to set the baseline.
Commenting is disabled because there's a newer build on this branch. Go to Build 2360 now
Pinned
Reony Tonneyck | The icon is not vertically centered here. I'm seeing extra margin at the top too? Was there a reason to not just align top-left and apply the padding to the colored background container? For example, in Figma I have: align-items: flex-start;
padding: 16px;
gap: 16px; That keeps the icon aligned top left if it goes to multiple lines but still centered (because of the padding) if it's a single-line. Maybe it works out differently in code? |
Unpinned
Nisha Yerunkar | Oh, good point. I'll fix the vertical alignment. As for the reason I didn't add 16px padding to the container is because I'd have to put negative margins on the dismiss button It messes up the logic of the padding between the text and the buttons when the banner has multiple lines. If the text is given a marginBottom, it adds extra space on top of the container padding, and then the single line banner has way more space at the bottom. If the buttons are given a marginTop, it also adds extra space on top of the container padding, and then the single line banner has way more space at the top. If I don't add margins to the label or the buttons so they look normal in a single line banner, they get squished together in the multiline banner. The best way to avoid this issue is to split the spacing for all components (8px margins on all elements) so they stay consistent. | Resolved |
