Within DashboardItem component, if the training title is too long, it is not truncated so the component overflows. The best option seems to use a line clamp to allow the title to go on two lines but truncate it if it exceeds this limit.
Before
After
P.S: Even if the -webkit prefix let's believe that related CSS property are only supported by webkit browsers, line clamp is currently working with this prefix on Firefox, Safari, Chromium.https://caniuse.com/css-line-clamp
Purpose
Within DashboardItem component, if the training title is too long, it is not truncated so the component overflows. The best option seems to use a line clamp to allow the title to go on two lines but truncate it if it exceeds this limit.
P.S: Even if the
-webkitprefix let's believe that related CSS property are only supported by webkit browsers, line clamp is currently working with this prefix on Firefox, Safari, Chromium. https://caniuse.com/css-line-clamp