Skip to content

Conversation

@OpenStaxClaude
Copy link
Contributor

Summary

Fixes the blog CTA button text not displaying issue reported in CORE-1410.

Changes

  • Added @include body-font(2rem) to the .blog-cta .btn selector in article.scss
  • This matches the styling used in flex-page CTA blocks and ensures button text is visible

Issue

The blog CTA button was rendering correctly (orange button with proper dimensions) but the text inside was not visible, even though the JSON data contained the correct button_text value.

Root Cause

The button was missing an explicit font-size declaration. While the @include button() mixin includes @include set-font(body-regular), adding the explicit @include body-font(2rem) ensures the text renders properly, matching the approach used in other CTA implementations (flex-page CTAs).

Testing

  • Verify that blog CTA buttons now display text correctly
  • Check that the styling matches flex-page CTA buttons

Related to: CORE-1410

OpenStaxClaude and others added 2 commits January 8, 2026 12:06
Add explicit font-size to blog CTA buttons to match flex-page CTA styling.
The button mixin includes a font style, but adding body-font(2rem) ensures
the text is visible and matches the styling used in other CTA blocks.

Fixes CORE-1410

Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
The CMS API automatically converts snake_case field names to camelCase
when the frontend loads the data. Updated the CTA component to use
buttonHref and buttonText (camelCase) instead of button_href and
button_text (snake_case) to match the transformed API data.

This fixes both the button text and href not displaying properly.

Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
@TomWoodward TomWoodward marked this pull request as ready for review January 8, 2026 13:42
OpenStaxClaude and others added 2 commits January 8, 2026 13:57
The CTA component was updated to use camelCase field names (buttonText,
buttonHref) to match the API response format. This updates the test to
use the same field names.

Fixes test failures in body-units.test.tsx

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
Fix test data in article-page-data.js to use buttonText and buttonHref
instead of button_text and button_href to match the component changes.

Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
@RoyEJohnson RoyEJohnson merged commit 2488888 into main Jan 8, 2026
1 check passed
@RoyEJohnson RoyEJohnson deleted the core-1410-fix-cta-button-text branch January 8, 2026 15:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants