Skip to content

fix(end-page): align thank-you paragraph typography with other admin content#9756

Open
tutntut wants to merge 2 commits into
developfrom
fix-thank-you-page-bullet-styling
Open

fix(end-page): align thank-you paragraph typography with other admin content#9756
tutntut wants to merge 2 commits into
developfrom
fix-thank-you-page-bullet-styling

Conversation

@tutntut

@tutntut tutntut commented Jul 14, 2026

Copy link
Copy Markdown
Contributor

Closes #9434

Problem

Markdown bullet points added to the thank-you page paragraph render with visibly different styling from the surrounding text — the paragraph text appears bolded while the bullets do not. Closes #9434.

Solution

The bolded bullets were a symptom, not the bug: the end page styled its admin-authored paragraph with subhead-1 (weight 500, secondary.500), while every other renderer of primary admin-authored paragraph content — FormInstructions, SectionField, ParagraphField — uses body-1 (weight 400, secondary.700). A survey of all 15 useMdComponents consumers confirmed the end page was the sole outlier. Switching EndPageBlock to the shared baseline fixes both plain paragraphs and bullet lists in one move. A Storybook story with a bulleted paragraph was added as a repro.

Alternatives considered

  • We first tried adding a list-style fallback inside the shared useMdComponents hook so ul elements would pick up the caller's text style, but dropped it — it only patched bullets, leaving plain end-page paragraphs still rendered at weight 500, and it added complexity to a shared hook to work around one caller's styling choice.
  • We tried to trace why the end page originally used subhead-1, but the git history is flattened at the monorepo migration, so the original intent is unrecoverable. It likely aimed to make the thank-you message read as a subtitle under the h2 title — fine for one-liners, but it breaks down for multi-paragraph admin content with lists.

Screenshots

Story Before After
End page with bullets before after
End page default before after

Breaking Changes

No - backwards compatible. Note the visual change applies to every form's thank-you page (paragraph weight 500 → 400, colour secondary.500secondary.700) — worth a design sanity-check.

Tests

TC1: bulleted thank-you paragraph

  • Create a form; in the thank-you page settings, set a paragraph containing markdown bullets (* item)
  • Submit the form
  • Verify the intro text and the bullet items render at the same weight/colour, matching a paragraph field's styling

TC2: existing plain thank-you paragraphs

  • Open any form with a plain (non-bulleted) thank-you paragraph and submit
  • Verify the paragraph renders like other admin-authored body text (no bolding), and the title/Response ID area is unchanged

Clean-up

🤖 Generated with Claude Code

tutntut and others added 2 commits July 14, 2026 14:29
Reproduces #9434 — markdown bullets in the thank-you page paragraph
render differently from the surrounding text. Added ahead of the fix
so before/after can be compared on the same story.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…content

The end page styled its admin-authored paragraph with subhead-1
(weight 500, secondary.500) while every other renderer of primary
admin-authored paragraph content (FormInstructions, SectionField,
ParagraphField) uses body-1 (weight 400, secondary.700). This made
the whole thank-you paragraph read as bolded, and markdown bullets
inside it visibly inconsistent with the rest of the platform.

Use the shared body-1/secondary.700 baseline so both plain paragraphs
and bullet lists on the thank-you page match admin content elsewhere.

Closes #9434

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@@ -56,8 +56,8 @@ export const EndPageBlock = ({
const mdComponents = useMdComponents({
styles: {
text: {

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why the fix is here rather than in the shared useMdComponents hook: the reported "bolded bullets" were a symptom, not the bug. EndPageBlock styled its admin-authored paragraph with subhead-1 (weight 500, secondary.500), while every other renderer of primary admin-authored paragraph content — FormInstructions, SectionField, ParagraphField — uses body-1 (weight 400, secondary.700). A survey of all 15 useMdComponents consumers confirmed EndPageBlock was the sole outlier among primary-paragraph renderers (ImageField and FormLabel deviate deliberately, as smaller supporting text). Changing the end-page text style to the shared baseline fixes bullets and plain paragraphs in one move.

Alternatives tried and rejected:

  • A listStyles fallback in useMdComponents so ul picks up styles.text — only patched bullets, left plain paragraphs at weight 500, and added complexity to a shared hook to work around one caller. This was the first implementation attempt and was reverted.
  • Passing explicit list styles from EndPageBlock only — same partial-fix problem.

@tutntut
tutntut marked this pull request as ready for review July 14, 2026 15:29
@tutntut
tutntut requested a review from a team July 14, 2026 15:29
@tutntut tutntut added the ready-for-human Needs a human to act; not suitable for AFK agents label Jul 19, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ready-for-human Needs a human to act; not suitable for AFK agents

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Styling in thank you page for bullet points are different

1 participant