Target inline and block code separately in Tailwind Typography

[imochoa]

trafficstars

Before

After

Tailwind Typography cannot currently distinguish between inline and block code.

There is also a PR open to get this plugin into upstream typography, so adding it like will probably not required at some point

What is kind of annoying is that in astro Class-based modifiers do not work with @apply directives

That means that you cannot just add @apply prose-inline-code:p-[.2em_.4em] to the src/styles/components.scss, but have to put the styles inline. That's what the astro documentation recommends anyway, but it does not look great

Can you think of a better solution here?

[netlify[bot]]

✅ Deploy Preview for astroplate ready!

Name	Link
🔨 Latest commit	6074cd525f7456eb123df74faefcbd86d9442574
🔍 Latest deploy log	https://app.netlify.com/sites/astroplate/deploys/66c9a11bb2d28a0008bfaf2f
😎 Deploy Preview	https://deploy-preview-45--astroplate.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.