From c141ca43af698c5c8c9631102870e7f4c8afb5f3 Mon Sep 17 00:00:00 2001 From: Matthew Holloway Date: Wed, 16 Apr 2025 19:16:07 +1200 Subject: [PATCH 1/2] Fix `text-pretty` description --- src/docs/text-wrap.mdx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/docs/text-wrap.mdx b/src/docs/text-wrap.mdx index 868a3fd8b..bd3fb6954 100644 --- a/src/docs/text-wrap.mdx +++ b/src/docs/text-wrap.mdx @@ -111,7 +111,7 @@ For performance reasons browsers limit text balancing to blocks that are ~6 line ### Pretty text wrapping -Use the `text-pretty` utility to prevent orphans (a single word on its own line) at the end of a text block: +Use the `text-pretty` utility to optimimise for wrapping prettiness rather than browser speed. Behaviour varies by browser but often involves more complicated text wrapping approaches such as preventing orphans (a single word on its own line) at the end of a text block:
@@ -139,6 +139,8 @@ Use the `text-pretty` utility to prevent orphans (a single word on its own line)
+Browsers vary in their interpretation of prettiness but may include advanced typographic concepts such as: reducing the variation in length between lines; avoiding typographic rivers; prioritizing different classes of soft wrap opportunities, hyphenation opportunities, or justification opportunities; avoiding hyphenation on too many consecutive lines. + ### Responsive design From 0483a4fb8bdd5ff25f21e7b5547d1a1944eeca6c Mon Sep 17 00:00:00 2001 From: Matthew Holloway Date: Wed, 16 Apr 2025 19:22:26 +1200 Subject: [PATCH 2/2] Add CSS Text spec credit to `text-pretty` description --- src/docs/text-wrap.mdx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/docs/text-wrap.mdx b/src/docs/text-wrap.mdx index bd3fb6954..fea9ae1fc 100644 --- a/src/docs/text-wrap.mdx +++ b/src/docs/text-wrap.mdx @@ -139,7 +139,9 @@ Use the `text-pretty` utility to optimimise for wrapping prettiness rather than -Browsers vary in their interpretation of prettiness but may include advanced typographic concepts such as: reducing the variation in length between lines; avoiding typographic rivers; prioritizing different classes of soft wrap opportunities, hyphenation opportunities, or justification opportunities; avoiding hyphenation on too many consecutive lines. +Browsers vary in their interpretation of prettiness but may include advanced typographic concepts such as: + +> reducing the variation in length between lines; avoiding typographic rivers; prioritizing different classes of soft wrap opportunities, hyphenation opportunities, or justification opportunities; avoiding hyphenation on too many consecutive lines - [CSS Text Level 4 specification](https://drafts.csswg.org/css-text-4/#text-wrap-style) ### Responsive design