Skip to content

fix: change description text color to body medium for better contrast on enterprise page#15773

Merged
wackerow merged 1 commit into
devfrom
claude/issue-15772-20250701_110411
Jul 15, 2025
Merged

fix: change description text color to body medium for better contrast on enterprise page#15773
wackerow merged 1 commit into
devfrom
claude/issue-15772-20250701_110411

Conversation

@konopkja
Copy link
Copy Markdown
Contributor

@konopkja konopkja commented Jul 1, 2025

Fixes #15772

Changes the description text color from body to body medium on the 4 top feature boxes of the enterprise page for better visual contrast and readability.

Changes

  • Updated FeatureCard component to use text-body-medium class
  • Affects feature descriptions on /en/enterprise/ page
  • Improves visual hierarchy while maintaining accessibility

Generated with Claude Code

… on enterprise page

- Updated FeatureCard component to use text-body-medium class for description text
- Affects the 4 top feature boxes on /enterprise page
- Improves visual hierarchy and readability as requested in issue #15772

Co-authored-by: Jakub <konopkja@users.noreply.github.com>
@netlify
Copy link
Copy Markdown

netlify Bot commented Jul 1, 2025

Deploy Preview for ethereumorg ready!

Name Link
🔨 Latest commit 663972b
🔍 Latest deploy log https://app.netlify.com/projects/ethereumorg/deploys/6863ccb7a5d4060008c0efa9
😎 Deploy Preview https://deploy-preview-15773--ethereumorg.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
7 paths audited
Performance: 49 (🔴 down 4 from production)
Accessibility: 94 (no change from production)
Best Practices: 92 (no change from production)
SEO: 99 (no change from production)
PWA: 59 (no change from production)
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

@konopkja
Copy link
Copy Markdown
Contributor Author

konopkja commented Jul 1, 2025

@coderabbitai review code

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Jul 1, 2025

Tip

For best results, initiate chat on the files or code changes.

🧩 Analysis chain

@konopkja I'll review the code changes in this PR. Let me gather information about what files have been modified and analyze the changes.


🏁 Script executed:

#!/bin/bash
# Get information about the PR and the files that have been changed
echo "=== PR Information ==="
gh pr view 15773 --repo ethereum/ethereum-org-website

echo -e "\n=== Files changed in this PR ==="
git diff --name-only HEAD~1 HEAD

echo -e "\n=== Detailed diff summary ==="
git diff --stat HEAD~1 HEAD

Length of output: 1531


🏁 Script executed:

#!/bin/bash
# Get the changed files from the PR using GitHub CLI
echo "=== Files changed in this PR using GitHub CLI ==="
gh pr diff 15773 --repo ethereum/ethereum-org-website --name-only

echo -e "\n=== PR diff ==="
gh pr diff 15773 --repo ethereum/ethereum-org-website

Length of output: 925


@konopkja I've reviewed the code changes in PR #15773. Here's my comprehensive analysis:

Overall Assessment: Excellent

This is a well-executed accessibility fix that addresses a specific contrast issue on the enterprise page.

Technical Review

File Changed: app/[locale]/enterprise/_components/FeatureCard.tsx

Change Analysis:

// Before
<p key={i} className="mb-8 last:mb-0">

// After  
<p key={i} className="mb-8 last:mb-0 text-body-medium">

Strengths 🎯

  1. Targeted Fix: Addresses the specific contrast issue (Enterprise change body to body medium #15772) without over-engineering
  2. Minimal Impact: Single line change reduces risk of unintended side effects
  3. Proper CSS Utility Usage: Uses semantic class naming (text-body-medium) consistent with design system
  4. Preserves Existing Styling: Maintains spacing classes (mb-8 last:mb-0) while only adjusting text color/weight
  5. Clear Documentation: PR description clearly explains the change and its purpose

Accessibility Impact

  • Positive: Improves visual contrast and readability on the enterprise page
  • Semantic: Uses appropriate text styling classes rather than arbitrary color values
  • Maintainable: Leverages design system tokens for consistent theming

Code Quality 💻

  • Clean Implementation: No complex logic or unnecessary abstraction
  • Consistent Style: Follows existing code patterns in the component
  • Non-Breaking: Change only affects visual presentation, no functional impact

Minor Considerations 🤔

  1. Testing: Ensure the text-body-medium class provides sufficient contrast across all themes/modes
  2. Design System Consistency: Verify this aligns with the overall design system color hierarchy

Recommendations 📋

  • Approve and merge - This is a straightforward accessibility improvement
  • Consider documenting this pattern for future feature cards if similar contrast issues arise elsewhere

Security & Performance 🔒

  • No security implications
  • No performance impact (CSS class addition only)

This PR demonstrates excellent engineering practices: focused scope, clear documentation, and addresses a real user experience issue. Ready for merge! 🚀

@wackerow wackerow merged commit 0f38080 into dev Jul 15, 2025
6 checks passed
@wackerow wackerow deleted the claude/issue-15772-20250701_110411 branch July 15, 2025 23:00
This was referenced Jul 16, 2025
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.

Enterprise change body to body medium

2 participants