Document remark/rehype

[kevinzunigacuellar]

What kind of changes does this PR include?

• Closes Height and width of Embed element are not correct. #937

Description

• Only applies height: auto to elements (iframe, img, ...) when height its not set.
• Added height: auto to showcase card

[changeset-bot]

⚠️ No Changeset found

Latest commit: bb822f9

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[netlify]

✅ Deploy Preview for astro-starlight ready!

Name	Link
🔨 Latest commit	bb822f9
🔍 Latest deploy log	https://app.netlify.com/sites/astro-starlight/deploys/653bf5e5f10c0e0008b11465
😎 Deploy Preview	https://deploy-preview-938--astro-starlight.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 100 (no change from production) Accessibility: 100 (no change from production) Best Practices: 100 (no change from production) SEO: 100 (no change from production) PWA: - View the detailed breakdown and full score reports

---

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

[astrobot-houston]

size-limit report 📦

Path	Size
/index.html	5.13 KB (0%)
/_astro/*.js	19.27 KB (0%)
/_astro/*.css	9.68 KB (0%)

[delucis]

Thanks @kevinzunigacuellar!

Not 100% sure if this approach will work or not. For example, not super obvious with the test example of 100px, but shrink the viewport narrow enough and you’ll see this distortion:

This would be more obvious for larger image sizes.

[kevinzunigacuellar]

I am not very happy with this solution either 😓

[HiDeoo]

I am not very happy with this solution either 😓

Could we move this to a rehype plugin?

[delucis]

Could we move this to a rehype plugin?

Yeah I also considered this. I’d honestly love it if Starlight added zero custom rehype plugins to give users a clean slate for their own customisations. Maybe a good opportunity for a third-party plugin that we could recommend?

Similar to gatsby-remark-responsive-iframe maybe?

Edit: Definitely not exactly that — it’s using cheerio to parse stuff???

[HiDeoo]

I’d honestly love it if Starlight added zero custom rehype plugins to give users a clean slate for their own customisations. Maybe a good opportunity for a third-party plugin that we could recommend?

I think that is a valid point and wise idea 👍

Tried quickly right now to see if something like that already existed, I'm a bit surprised it is not (or I did not find it easily) but would be fairly easy to setup and publish for someone (and yeah, definitely without cheerio).

[kevinzunigacuellar]

I think a rehype plugin it's a good idea but what about the support for markdoc files?

[HiDeoo]

I think a rehype plugin it's a good idea but what about the support for markdoc files?

Does Markdoc even allow HTML in markup? I think users would need a custom Markdoc tag for an iframe so the tag could also handle this case at the same time I guess?

[kevinzunigacuellar]

To get the ball rolling I added a small section to the end of the authoring content page about plugins.

[delucis]

I think this looks good to me! Do you want to do anything else in this PR @kevinzunigacuellar?

[ElianCodes]

Love it! Thanks for adding this @kevinzunigacuellar!

[kevinzunigacuellar]

(Pressing the green big button...)