URL preview for some web sites is very long

[radix]

Here's an example using http://xion.io/drafts/rust-unit-test-placement.html (which I'm not sure will be there permanently). Somehow riot decided that the whole content of the post should be in the preview.

[richvdh]

matrix-org/synapse#1430, but I couldn't find an issue open to track it from the riot side, so keeping this open too

[uhoreg]

An easy fix to this may be to add some styles to limit the height of the preview. For example,

.mx_LinkPreviewWidget_description {
  max-height: 10em;
  overflow-y: auto;
}

[lukebarnard1]

Having a scrollbar (using overflow-y: auto) seems odd as you end up with something like

I think I'd prefer using text-overflow: ellipsis somehow to add a "..." automatically, rather than relying on the "..." being done server-side.

[uhoreg]

Yup, using text-overflow instead of overflow-y seems fine to me.

[t3chguy]

Should be fixed by matrix-org/synapse/pull/2243

[t3chguy]

Though comments have been made that Riot should handle this too, so reopening for that discussion

[nukeop]

Still occurs, can it be solved in frontend somehow? Like limiting the height of the preview box and adding ellipsis?

[MadLittleMods]

It looks like this has some webkit specific styles to accomplish this nowadays ⏩ and it even seems like that vendor prefixed property is also supported in everything else except Internet explorer, https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp#browser_compatibility

display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;

The preview is cut off after 3 lines of text:

vs the full description in the DOM which you can see on wider screens: