Datahub: Fix cutoff expanded abstract

[tkohr]

Description

This PR replaces a margin with a padding in the max-lines ng-content to prevent cutoffs on expanded abstracts that may occur with markup since margins are not taken into account when calculating the expanded max height via getBoundingClientRect.

The bug was detected on camptocamp/mel-dataplatform#102

Screenshots

Quality Assurance Checklist

• Commit history is devoid of any merge commits and readable to facilitate reviews
• If new logic ⚙️ is introduced: unit tests were added
• If new user stories 🤏 are introduced: E2E tests were added
• If new UI components 🕹️ are introduced: corresponding stories in Storybook were created
• If breaking changes 🪚 are introduced: add the breaking change label
• If bugs 🐞 are fixed: add the backport <release branch> label
• The documentation website 📚 has received the love it deserves

---

This work is sponsored by MEL.

[github-actions]

Affected libs: ui-elements, feature-notifications, feature-editor, feature-search, feature-router, feature-map, feature-dataviz, feature-record, feature-catalog, ui-catalog, ui-search,
Affected apps: metadata-editor, datahub, demo, webcomponents, search, datafeeder, map-viewer,

• 🚀 Build and deploy storybook and demo on GitHub Pages
• 📦 Build and push affected docker images

[github-actions]

📷 Screenshots are here!

[coveralls]

coverage: 83.629% (+2.2%) from 81.448%
when pulling f4dd051 on fix-abstract-cutoff
into 8b395cf on main.

[jahow]

I'm not sure this is the right approach: adding padding to the block will make the "read more" button appear without a need for it.

On main:

On this PR:

[tkohr]

Oh thanks, I completely missed that. I'll have a look how to handle this.

[jahow]

Is it possible that the size computation is incorrect because of fonts loading or something like that?

[tkohr]

So as it turned out it was the margin-top from the first markdown heading that caused the issue calculating the height via getBoundingClientRect. Thanks @jahow !