Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

prose-p:text-justify makes recipe less usable #8357

Closed
jackwatters45 opened this issue May 20, 2024 · 1 comment
Closed

prose-p:text-justify makes recipe less usable #8357

jackwatters45 opened this issue May 20, 2024 · 1 comment
Labels
improve documentation Enhance existing documentation (e.g. add an example, improve description)

Comments

@jackwatters45
Copy link

📚 Subject area/topic

Style rendered Markdown with Tailwind Typography recipe

📋 Page(s) affected (or suggested, for new content)

https://docs.astro.build/en/recipes/tailwind-rendered-markdown/

📋 Description of content that is out-of-date or incorrect

Tailwind class prose-p:text-justify is not wrong, but I would suggest it is better off omitted. I copied the recipe's prose component directly into my blog and did not notice the text-justification. It was quite annoying to debug and the recipe would result in a better experience if it was omitted.

---
// src/components/Prose.astro
---
<div
  class="prose dark:prose-invert
  prose-h1:font-bold prose-h1:text-xl
  prose-a:text-blue-600 
- prose-p:text-justify
  prose-img:rounded-xl
  prose-headings:underline">
  <slot />
</div>

Permalink

🖥️ Reproduction in StackBlitz (if reporting incorrect content or code samples)

No response

@jackwatters45 jackwatters45 added the improve documentation Enhance existing documentation (e.g. add an example, improve description) label May 20, 2024
@at-the-vr
Copy link
Member

at-the-vr commented May 26, 2024

Hey Jack 👋 I saw your Blog and adjusted the letter spacing - here's the commit && the deployment which looks much better to me.

clearly text-justify works well when paired with letter-spacing. I also tried the same recipe on Astro Blog template without letter-spacing and it went smooth as well.
edit: text-wrap helps with some overflows found in mobile devices

tldr: Gotta say no to removing the prose-p:text-justify because of an edge case. Hope you understand, thanks for testing the recipe a lot 🙌

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
improve documentation Enhance existing documentation (e.g. add an example, improve description)
Projects
None yet
Development

No branches or pull requests

3 participants