Skip to content

feat: blog-post components#122

Draft
ntatoud wants to merge 22 commits into
mainfrom
blog-post-components
Draft

feat: blog-post components#122
ntatoud wants to merge 22 commits into
mainfrom
blog-post-components

Conversation

@ntatoud
Copy link
Copy Markdown
Member

@ntatoud ntatoud commented Apr 29, 2026

Summary

  • New blog-post components for use in MDX articles: PhoneCarousel, ScratchSection, RoleCard, FeatureCard, StatCard, TestimonialCard + TestimonialList, TwoColumns
  • All components added to /styleguide/blog-post with light and dark variants
  • Responsive layouts (mobile-first)

Components

Component Description
PhoneCarousel React carousel with phone frame mockup, dot indicators, dark mode support
ScratchSection Full-width dark section with torn-paper edges
RoleCard Role presentation card with icon, tags, team members, and visual slot
FeatureCard Icon + title + description card
StatCard Stat highlight card with visual slot
TestimonialCard + TestimonialList Review card in horizontal scroll container
TwoColumns Two-column layout with ratio and reverse props

Test plan

  • Visit /styleguide/blog-post and review all components
  • Check responsive behavior on mobile (< lg)
  • Check dark variants render correctly

🤖 Generated with Claude Code

ntatoud and others added 22 commits April 15, 2026 16:12
…uide page

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- New PhoneCarousel component with phone frame, dots, prev/next nav
- Supports width prop and dark prop for inverted colors on dark backgrounds
- Added to styleguide with light and dark variants

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- FeatureCard grid: single column on mobile, 2 cols from sm
- RoleCard: column layout below lg, row above
- TestimonialCard: px-8 py-6, min-w-72
- TestimonialList: new horizontal scroll wrapper component
- StatCard: px-6 py-5

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 29, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
bearstudio.fr Ready Ready Preview, Comment Apr 29, 2026 0:18am

Request Review

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