Testimonial Card
Displays a card with an avatar, quote, author name, and author role.
M
Security was our top concern, and this platform exceeded our expectations.
Michel Zhang
Security Architect
Usage
import { TestimonialCard, TestimonialCardAuthor, TestimonialCardAvatar, TestimonialCardContent, TestimonialCardFooter, TestimonialCardQuote, TestimonialCardRole,} from "@/app/_components/ui/testimonial-card";<TestimonialCard> <TestimonialCardContent> <TestimonialCardAvatar imageUrl={avatarUrl} alt="Michel Zhang" /> <TestimonialCardQuote> "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." </TestimonialCardQuote> </TestimonialCardContent> <TestimonialCardFooter> <TestimonialCardAuthor>Author Name</TestimonialCardAuthor> <TestimonialCardRole>Author Role</TestimonialCardRole> </TestimonialCardFooter></TestimonialCard>Props
TestimonialCard
| Name | Type | Default | Description |
|---|---|---|---|
children | ReactNode | - | The content to be displayed. |
className | string | - | Additional classes. |
TestimonialCardAuthor
| Name | Type | Default | Description |
|---|---|---|---|
children | ReactNode | - | The content to be displayed. |
className | string | - | Additional classes. |
TestimonialCardAvatar
| Name | Type | Default | Description |
|---|---|---|---|
className | string | - | Additional classes. |
imageUrl | string | - | The URL of the avatar image. |
alt | string | - | The alt text of the image. |
TestimonialCardContent
| Name | Type | Default | Description |
|---|---|---|---|
children | ReactNode | - | The content to be displayed. |
className | string | - | Additional classes. |
TestimonialCardFooter
| Name | Type | Default | Description |
|---|---|---|---|
children | ReactNode | - | The content to be displayed. |
className | string | - | Additional classes. |
TestimonialCardQuote
| Name | Type | Default | Description |
|---|---|---|---|
children | ReactNode | - | The content to be displayed. |
className | string | - | Additional classes. |
TestimonialCardRole
| Name | Type | Default | Description |
|---|---|---|---|
children | ReactNode | - | The content to be displayed. |
className | string | - | Additional classes. |