Cleanup asset metadata management

[tobie]

This cleans-up asset metadata and extends it to article images.

The metadata includes alt, attribution, and caption info. This info is automatically integrated with both shortcode and markdown images. It can be overwritten locally. This is particularly useful for caption that tends to be context-dependent.

As a result:

• pretty much every image ends-up wrapped up in a <figure> element, the design should account for this and not treat figure elements differently
• attribution and caption are both presented inside of a <figcaption> element like so:

  <figcaption>caption goes here. (attribution goes here)<figcaption>

Still todo:

• [x] Remove any previous attribution-related CSS or markup accordingly.
• [x] Style figure and figcaption accordingly.

[netlify[bot]]

✅ Deploy Preview for unlockopen-com-v4 ready!

Name	Link
🔨 Latest commit	8aa367e33f6b350cc42da18daa6ae47276e46b56
🔍 Latest deploy log	https://app.netlify.com/sites/unlockopen-com-v4/deploys/65f07df0678c9c000935645f
😎 Deploy Preview	https://deploy-preview-29--unlockopen-com-v4.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[madrilene]

• Refactored getCaption to return null when both caption and credit text are absent, preventing empty (). In this case, <picture> is used again.

• created own CSS component for base <figure>, <picture> and <figcaption> styles to be applied universally.

I don't know whether you attach importance to this or prefer not to do it, but I would place image-attribution.js in _eleventy/utils according to the classification system, and also import embedTwitter via the plugins-folder.

[tobie]

I don't know whether you attach importance to this or prefer not to do it, but I would place image-attribution.js in _eleventy/utils according to the classification system

Makes sense!

and also import embedTwitter via the plugins-folder.

Sure thing. Want to push it in a separate PR, though?

[tobie]

So are you planning to do the refactoring for image-attribution here or elsewhere?

[madrilene]

Whatever you prefer! I found some other tiny issues, like outdated custom properties and an unused shortcode. Maybe I could collect them all in a separate PR?

[tobie]

That works