Change 430357 had a related patch set uploaded (by Santhosh; owner: Santhosh):
[mediawiki/extensions/ContentTranslation@master] WIP: CX2: Adjust the design for link cards

https://gerrit.wikimedia.org/r/430357

There is a known issue when double clicking user created link: two cards are shown

Change 430357 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] CX2: Adjust the design for link cards - Part 1

https://gerrit.wikimedia.org/r/430357

Before closing this task T168290#4204530 should either be fixed or filed as a separate task.

In T168290#4204610, @Nikerabbit wrote:

Before closing this task T168290#4204530 should either be fixed or filed as a separate task.

I created a follow-up ticket for this: T194677: CX2: Avoid multiple cards to be shown when double clicking a link

The mockup below provides more details about the layout and styling:

I assume the intention here was to be descriptive, not to re-implement the VE link inspector, as this is essentially the same layout, and there's no need for duplication...

Change 448109 had a related patch set uploaded (by Esanders; owner: Esanders):
[mediawiki/extensions/ContentTranslation@master] De-duplicate link inspector code

https://gerrit.wikimedia.org/r/448109

In T168290#4454180, @Esanders wrote:

I assume the intention here was to be descriptive, not to re-implement the VE link inspector, as this is essentially the same layout, and there's no need for duplication...

You are right. I was trying to capture the general anatomy of these cards based on the VE inspectors (I found no visual specification of such inspectors so I measured things in the browser). Note that in addition to the standard UI there are some customizations such as the access to the source version of the linked article at the bottom of the card, and the special card for marking an unadapted link as a red link. If a refactoring is proposed, a before/after compared screenshots would be very helpful.

In T168290#4455543, @Pginer-WMF wrote:

You are right. I was trying to capture the general anatomy of these cards based on the VE inspectors (I found no visual specification of such inspectors so I measured things in the browser).

Cool, my above patch removes some of the CSS duplication. I noticed also you changed the clear circle icon for 'trash' icon (and removed the red). Was this deliberate? I think we were discussing something like that on another ticket, but it should probably be handled upstream for consistency.

Note that in addition to the standard UI there are some customizations such as the access to the source version of the linked article at the bottom of the card, and the special card for marking an unadapted link as a red link. If a refactoring is proposed, a before/after compared screenshots would be very helpful.

The bottom bar is similar to the 'label' bar you designed for the upstream inspector. Is it deliberate that that bar is not present in CX (I think we should keep it)? If not we could share those styles too.

See also T198064

In T168290#4455960, @Esanders wrote:

Before	After	VE

Thanks @Esanders. The change looks good.

@Volker_E may be interested on exploring whether to use Base30 (#72777d) or Base20 (#54595d) for secondary grey text. But in any case, having the code unified will be useful to propagate any change in that regard if needed.

Change 448109 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] De-duplicate link inspector code

https://gerrit.wikimedia.org/r/448109

@Pginer-WMF Base30 is sufficient in VE's case. It's non-necessary text to understand the link. Where does the extended paragraph originate from? In the CX link cards it needs Base20 to be conforming to level AA with Base90 background.