sl-design-system
Improve line height: dialog component
Provide a general summary of the issue here
The heading text is cut off in a strange way, visually it seems like there should be enough space to place the word 'blokkeren' before it jumps to the next line. In Figma this is the case. Not sure where the issue lies, but this leads to discrepancies between designs and development.
Screenshot developed dialog:
Screenshot same Figma dialog (also width 400):
🤔 Expected Behavior?
Same behaviour in both Figma and storybook component
😯 Current Behavior
Not the same behaviour
💁 Possible Solution
Make it the same behaviour :)
🖥️ Steps to Reproduce
In Magister zentest environment, go to Cijfers - (2nd) Beheer tab - Select a course (e.g. Nederlands) from a study (e.g. L BRUG 1) and select two columns via bulk select - Click 'Blokkeren' bulk action
What browsers are you seeing the problem on? (only for bugs in code)
Other
If other, please specify.
No response
What operating system are you using?
MacOS
👤 Your name
Floor Kuipers
🧢 Your product/team
Magister
🎨 Your Theme(s)
Magister
- [ ] https://developer.chrome.com/blog/css-text-wrap-pretty
- [ ] use CSS text-wrap: pretty
@ftakuipers we used CSS text-wrap: balance to prefend an orpahn on the second line, but I agree we can improve the line-height here.
