Skip to content

Redesign docs homepage#842

Open
Alfrick wants to merge 1 commit intomainfrom
alfrick-branch
Open

Redesign docs homepage#842
Alfrick wants to merge 1 commit intomainfrom
alfrick-branch

Conversation

@Alfrick
Copy link
Collaborator

@Alfrick Alfrick commented Mar 23, 2026

Summary

  • Updated tagline, branded hero divider (hero-divider), and :::note What's New callout linking to Release 12.2
  • Added social meta tags (og:title, og:description, og:image, twitter:card)
  • Replaced raw HTML card markup with a reusable CardGrid component — cards are equal-height via flexbox, include per-card emoji icons, and handle external links with rel="noopener noreferrer"
  • Extracted card data to src/data/homepageCards.js for easy maintenance
  • Added ## See Clarifai in action heading before the YouTube embed; switched to youtube-nocookie.com and added loading="lazy"
  • Styled homepage diagram with border-radius and box-shadow
  • Card sections grouped under labelled ## Start here and ## Explore the platform headings with uppercase primary-colour label styling
  • Two-column Popular topics list with arrow prefix
  • Replaced HomepageFeatures.js Docusaurus boilerplate with Clarifai-specific content
  • Fixed missing closing } in custom.css

Test plan

  • Verify homepage renders correctly in light and dark mode
  • Check card grid layout at desktop, tablet, and mobile widths
  • Confirm all internal card and popular-topics links resolve without broken-link errors
  • Check YouTube embed loads lazily and plays correctly
  • Verify social meta tags appear correctly when URL is shared

🤖 Generated with Claude Code

- Rewrite introduction.mdx: updated tagline, branded hero divider, What's New
  callout, social meta tags, lazy YouTube embed with nocookie URL, image alt
  text and styling, video section heading, and card sections with labels
- Extract card data to src/data/homepageCards.js with icons per card
- Add reusable CardGrid component with equal-height flex layout
- Replace HomepageFeatures.js boilerplate with Clarifai-specific content
- Add homepage styles to custom.css: hero divider, section labels, card hover
  lift, card icons, homepage diagram, popular topics two-column layout

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
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.

1 participant