Merge version_1 into main #4
@@ -356,7 +356,7 @@ const products = [
|
||||
```tsx
|
||||
const testimonials = [
|
||||
{
|
||||
name: "Sarah Johnson",
|
||||
name: "Terence J Simmons",
|
||||
role: "CEO, TechCorp",
|
||||
content: "This component library transformed our development workflow. Highly recommend!",
|
||||
image: "/images/avatar-1.jpg",
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
"testimonials": {
|
||||
"required": true,
|
||||
"minItems": 1,
|
||||
"example": "[{ name: 'Sarah Johnson', handle: 'CEO, TechCorp', testimonial: 'Amazing product!', rating: 5, imageSrc: '/avatar.jpg' }]",
|
||||
"example": "[{ name: 'Terence J Simmons', handle: 'CEO, TechCorp', testimonial: 'Amazing product!', rating: 5, imageSrc: '/avatar.jpg' }]",
|
||||
"note": "Array of testimonial objects. Each requires name, handle, testimonial text, and rating (1-5). imageSrc is optional."
|
||||
},
|
||||
"testimonialRotationInterval": {
|
||||
@@ -117,7 +117,7 @@
|
||||
"marqueeTextClassName?": "string",
|
||||
"marqueeIconClassName?": "string"
|
||||
},
|
||||
"usageExample": "<ThemeProvider defaultButtonVariant=\"icon-arrow\" defaultTextAnimation=\"entrance-slide\" borderRadius=\"pill\" background=\"aurora\" cardStyle=\"glass-elevated\" primaryButtonStyle=\"gradient\" secondaryButtonStyle=\"glass\">\n <HeroBillboardTestimonial \n background={{ variant: 'glowing-orb' }}\n title=\"Build Modern Web Experiences\" \n description=\"Create stunning, responsive websites with our comprehensive component library\" \n tag=\"New Release\"\n imageSrc=\"/hero.jpg\"\n imageAlt=\"Product showcase\"\n mediaAnimation=\"slide-up\"\n testimonials={[{ name: 'Sarah Johnson', handle: 'CEO, TechCorp', testimonial: 'This transformed our workflow!', rating: 5, imageSrc: '/avatar.jpg' }]}\n buttons={[{ text: 'Get Started', href: 'https://example.com' }, { text: 'Learn More', href: 'about' }]} \n />\n</ThemeProvider>",
|
||||
"usageExample": "<ThemeProvider defaultButtonVariant=\"icon-arrow\" defaultTextAnimation=\"entrance-slide\" borderRadius=\"pill\" background=\"aurora\" cardStyle=\"glass-elevated\" primaryButtonStyle=\"gradient\" secondaryButtonStyle=\"glass\">\n <HeroBillboardTestimonial \n background={{ variant: 'glowing-orb' }}\n title=\"Build Modern Web Experiences\" \n description=\"Create stunning, responsive websites with our comprehensive component library\" \n tag=\"New Release\"\n imageSrc=\"/hero.jpg\"\n imageAlt=\"Product showcase\"\n mediaAnimation=\"slide-up\"\n testimonials={[{ name: 'Terence J Simmons', handle: 'CEO, TechCorp', testimonial: 'This transformed our workflow!', rating: 5, imageSrc: '/avatar.jpg' }]}\n buttons={[{ text: 'Get Started', href: 'https://example.com' }, { text: 'Learn More', href: 'about' }]} \n />\n</ThemeProvider>",
|
||||
"do": [
|
||||
"Use for landing pages with social proof",
|
||||
"Use for product showcases with testimonials",
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
"testimonials": {
|
||||
"required": true,
|
||||
"minItems": 1,
|
||||
"example": "[{ name: 'Sarah Johnson', handle: 'CEO, TechCorp', testimonial: 'Amazing product!', rating: 5, imageSrc: '/avatar.jpg' }]",
|
||||
"example": "[{ name: 'Terence J Simmons', handle: 'CEO, TechCorp', testimonial: 'Amazing product!', rating: 5, imageSrc: '/avatar.jpg' }]",
|
||||
"note": "Array of testimonial objects. Each requires name, handle, testimonial text, and rating (1-5). imageSrc is optional."
|
||||
},
|
||||
"testimonialRotationInterval": {
|
||||
@@ -121,7 +121,7 @@
|
||||
"marqueeTextClassName?": "string",
|
||||
"marqueeIconClassName?": "string"
|
||||
},
|
||||
"usageExample": "<ThemeProvider defaultButtonVariant=\"text-stagger\" defaultTextAnimation=\"entrance-slide\" borderRadius=\"rounded\" background=\"aurora\" cardStyle=\"glass-elevated\" primaryButtonStyle=\"gradient\" secondaryButtonStyle=\"glass\">\n <HeroSplitTestimonial \n background={{ variant: 'glowing-orb' }}\n title=\"Build Better Products\" \n description=\"Create exceptional user experiences with our design system\" \n tag=\"New Release\"\n imagePosition=\"right\" \n imageSrc=\"/hero.jpg\"\n imageAlt=\"Product showcase\"\n testimonials={[{ name: 'Sarah Johnson', handle: 'CEO, TechCorp', testimonial: 'This transformed our workflow!', rating: 5, imageSrc: '/avatar.jpg' }]}\n buttons={[{ text: 'Start Building', href: 'https://example.com' }, { text: 'View Demo', href: 'demo' }]} \n />\n</ThemeProvider>",
|
||||
"usageExample": "<ThemeProvider defaultButtonVariant=\"text-stagger\" defaultTextAnimation=\"entrance-slide\" borderRadius=\"rounded\" background=\"aurora\" cardStyle=\"glass-elevated\" primaryButtonStyle=\"gradient\" secondaryButtonStyle=\"glass\">\n <HeroSplitTestimonial \n background={{ variant: 'glowing-orb' }}\n title=\"Build Better Products\" \n description=\"Create exceptional user experiences with our design system\" \n tag=\"New Release\"\n imagePosition=\"right\" \n imageSrc=\"/hero.jpg\"\n imageAlt=\"Product showcase\"\n testimonials={[{ name: 'Terence J Simmons', handle: 'CEO, TechCorp', testimonial: 'This transformed our workflow!', rating: 5, imageSrc: '/avatar.jpg' }]}\n buttons={[{ text: 'Start Building', href: 'https://example.com' }, { text: 'View Demo', href: 'demo' }]} \n />\n</ThemeProvider>",
|
||||
"do": [
|
||||
"Use for landing pages with social proof",
|
||||
"Use for product showcases with testimonials",
|
||||
|
||||
@@ -32,7 +32,7 @@
|
||||
},
|
||||
"name": {
|
||||
"required": true,
|
||||
"example": "Sarah Johnson",
|
||||
"example": "Terence J Simmons",
|
||||
"minChars": 2,
|
||||
"maxChars": 50,
|
||||
"note": "Team member name displayed at 2xl font-medium, centered with truncate"
|
||||
@@ -56,12 +56,12 @@
|
||||
},
|
||||
"imageAlt": {
|
||||
"required": false,
|
||||
"example": "Portrait of Sarah Johnson",
|
||||
"example": "Portrait of Terence J Simmons",
|
||||
"note": "Alt text for image (defaults to member name if not provided)"
|
||||
},
|
||||
"videoAriaLabel": {
|
||||
"required": false,
|
||||
"example": "Video of Sarah Johnson",
|
||||
"example": "Video of Terence J Simmons",
|
||||
"note": "ARIA label for video (defaults to member name if not provided)"
|
||||
}
|
||||
},
|
||||
@@ -104,7 +104,7 @@
|
||||
"nameClassName?": "string",
|
||||
"roleClassName?": "string"
|
||||
},
|
||||
"usageExample": "<TeamCardFive team={[{ id: '1', name: 'Sarah Johnson', role: 'CEO & Founder', imageSrc: '/team/sarah.jpg' }, { id: '2', name: 'Michael Chen', role: 'CTO', imageSrc: '/team/michael.jpg' }, { id: '3', name: 'Emma Davis', role: 'Head of Design', imageSrc: '/team/emma.jpg' }, { id: '4', name: 'James Wilson', role: 'Lead Developer', imageSrc: '/team/james.jpg' }]} animationType=\"slide-up\" title=\"Meet Our Team\" description=\"The talented people behind our success\" textboxLayout=\"default\" useInvertedBackground={false} tag=\"Team\" tagIcon={Users} />",
|
||||
"usageExample": "<TeamCardFive team={[{ id: '1', name: 'Terence J Simmons', role: 'CEO & Founder', imageSrc: '/team/sarah.jpg' }, { id: '2', name: 'Michael Chen', role: 'CTO', imageSrc: '/team/michael.jpg' }, { id: '3', name: 'Emma Davis', role: 'Head of Design', imageSrc: '/team/emma.jpg' }, { id: '4', name: 'James Wilson', role: 'Lead Developer', imageSrc: '/team/james.jpg' }]} animationType=\"slide-up\" title=\"Meet Our Team\" description=\"The talented people behind our success\" textboxLayout=\"default\" useInvertedBackground={false} tag=\"Team\" tagIcon={Users} />",
|
||||
"do": [
|
||||
"Use for team pages",
|
||||
"Use for staff directories",
|
||||
|
||||
@@ -32,7 +32,7 @@
|
||||
},
|
||||
"name": {
|
||||
"required": true,
|
||||
"example": "Sarah Johnson",
|
||||
"example": "Terence J Simmons",
|
||||
"minChars": 2,
|
||||
"maxChars": 50,
|
||||
"note": "Team member name displayed at 2xl font-medium with truncate in blurred overlay"
|
||||
@@ -56,12 +56,12 @@
|
||||
},
|
||||
"imageAlt": {
|
||||
"required": false,
|
||||
"example": "Portrait of Sarah Johnson",
|
||||
"example": "Portrait of Terence J Simmons",
|
||||
"note": "Alt text for image (defaults to member name if not provided)"
|
||||
},
|
||||
"videoAriaLabel": {
|
||||
"required": false,
|
||||
"example": "Video of Sarah Johnson",
|
||||
"example": "Video of Terence J Simmons",
|
||||
"note": "Aria label for video (defaults to member name if not provided)"
|
||||
}
|
||||
}
|
||||
@@ -103,7 +103,7 @@
|
||||
"textBoxButtonClassName?": "string",
|
||||
"textBoxButtonTextClassName?": "string"
|
||||
},
|
||||
"usageExample": "<TeamCardSix members={[{ id: '1', name: 'Sarah Johnson', role: 'CEO & Founder', imageSrc: '/team/sarah.jpg' }, { id: '2', name: 'Michael Chen', role: 'CTO', imageSrc: '/team/michael.jpg' }]} gridVariant=\"uniform-all-items-equal\" animationType=\"slide-up\" title=\"Meet Our Team\" description=\"The talented people behind our success\" textboxLayout=\"default\" useInvertedBackground={false} tag=\"Team\" tagIcon={Users} />",
|
||||
"usageExample": "<TeamCardSix members={[{ id: '1', name: 'Terence J Simmons', role: 'CEO & Founder', imageSrc: '/team/sarah.jpg' }, { id: '2', name: 'Michael Chen', role: 'CTO', imageSrc: '/team/michael.jpg' }]} gridVariant=\"uniform-all-items-equal\" animationType=\"slide-up\" title=\"Meet Our Team\" description=\"The talented people behind our success\" textboxLayout=\"default\" useInvertedBackground={false} tag=\"Team\" tagIcon={Users} />",
|
||||
"do": [
|
||||
"Use for about pages",
|
||||
"Use for company information",
|
||||
|
||||
@@ -32,7 +32,7 @@
|
||||
},
|
||||
"name": {
|
||||
"required": true,
|
||||
"example": "Sarah Johnson",
|
||||
"example": "Terence J Simmons",
|
||||
"minChars": 2,
|
||||
"maxChars": 50
|
||||
},
|
||||
@@ -57,7 +57,7 @@
|
||||
},
|
||||
"imageAlt": {
|
||||
"required": false,
|
||||
"example": "Sarah Johnson",
|
||||
"example": "Terence J Simmons",
|
||||
"note": "Alt text for avatar image"
|
||||
},
|
||||
"icon": {
|
||||
@@ -110,7 +110,7 @@
|
||||
"textBoxButtonClassName?": "string",
|
||||
"textBoxButtonTextClassName?": "string"
|
||||
},
|
||||
"usageExample": "<TestimonialCardSix testimonials={[{ id: '1', name: 'Sarah Johnson', handle: '@sarahj', testimonial: 'This component library has transformed our development workflow. The quality and attention to detail is exceptional.', imageSrc: '/avatar1.jpg', imageAlt: 'Sarah Johnson' }, { id: '2', name: 'Michael Chen', handle: '@mchen', testimonial: 'Incredibly well-designed components that are both beautiful and functional. Highly recommend!', imageSrc: '/avatar2.jpg', imageAlt: 'Michael Chen' }]} animationType=\"slide-up\" title=\"What Our Clients Say\" description=\"Hear from those who've experienced our work\" textboxLayout=\"default\" useInvertedBackground={false} />",
|
||||
"usageExample": "<TestimonialCardSix testimonials={[{ id: '1', name: 'Terence J Simmons', handle: '@sarahj', testimonial: 'This component library has transformed our development workflow. The quality and attention to detail is exceptional.', imageSrc: '/avatar1.jpg', imageAlt: 'Terence J Simmons' }, { id: '2', name: 'Michael Chen', handle: '@mchen', testimonial: 'Incredibly well-designed components that are both beautiful and functional. Highly recommend!', imageSrc: '/avatar2.jpg', imageAlt: 'Michael Chen' }]} animationType=\"slide-up\" title=\"What Our Clients Say\" description=\"Hear from those who've experienced our work\" textboxLayout=\"default\" useInvertedBackground={false} />",
|
||||
"do": [
|
||||
"Use for social proof",
|
||||
"Use for customer reviews",
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
},
|
||||
"name": {
|
||||
"required": true,
|
||||
"example": "Sarah Johnson",
|
||||
"example": "Terence J Simmons",
|
||||
"minChars": 2,
|
||||
"maxChars": 50
|
||||
},
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
},
|
||||
"name": {
|
||||
"required": true,
|
||||
"example": "Sarah Johnson",
|
||||
"example": "Terence J Simmons",
|
||||
"minChars": 2,
|
||||
"maxChars": 50,
|
||||
"note": "Used as fallback for imageAlt"
|
||||
@@ -38,7 +38,7 @@
|
||||
},
|
||||
"imageAlt": {
|
||||
"required": false,
|
||||
"example": "Sarah Johnson",
|
||||
"example": "Terence J Simmons",
|
||||
"minChars": 2,
|
||||
"maxChars": 50,
|
||||
"note": "Alt text for accessibility (defaults to name)"
|
||||
@@ -67,7 +67,7 @@
|
||||
"cardTitleClassName?": "string",
|
||||
"cardTagClassName?": "string"
|
||||
},
|
||||
"usageExample": "<TestimonialCardTwelve testimonials={[{ id: '1', name: 'Sarah Johnson', imageSrc: '/testimonials/sarah.jpg' }, { id: '2', name: 'Michael Chen', imageSrc: '/testimonials/michael.jpg' }, { id: '3', name: 'Emma Davis', imageSrc: '/testimonials/emma.jpg' }, { id: '4', name: 'James Wilson', imageSrc: '/testimonials/james.jpg' }]} cardTitle=\"Over 10,000 customers trust us to deliver exceptional results\" cardTag=\"See what they say\" useInvertedBackground={false} />",
|
||||
"usageExample": "<TestimonialCardTwelve testimonials={[{ id: '1', name: 'Terence J Simmons', imageSrc: '/testimonials/sarah.jpg' }, { id: '2', name: 'Michael Chen', imageSrc: '/testimonials/michael.jpg' }, { id: '3', name: 'Emma Davis', imageSrc: '/testimonials/emma.jpg' }, { id: '4', name: 'James Wilson', imageSrc: '/testimonials/james.jpg' }]} cardTitle=\"Over 10,000 customers trust us to deliver exceptional results\" cardTag=\"See what they say\" useInvertedBackground={false} />",
|
||||
"do": [
|
||||
"Use for feature showcases",
|
||||
"Use for capability displays",
|
||||
|
||||
@@ -196,8 +196,8 @@ export default function LandingPage() {
|
||||
tagAnimation="slide-up"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Johnson", handle: "@sarahjtech", testimonial: "Fixed my cracked screen in just 2 hours! The technician was professional and the price was very fair. Will definitely return here.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ASo5NGChDW04lws3QHcRDeKMGr/uploaded-1772595637223-1vibvl2r.png", imageAlt: "Sarah Johnson"
|
||||
id: "1", name: "Terence J Simmons", handle: "@sarahjtech", testimonial: "Great stuff. Fitted screen protector + cover.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ASo5NGChDW04lws3QHcRDeKMGr/uploaded-1772595637223-1vibvl2r.png", imageAlt: "Terence J Simmons"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Marcus Chen", handle: "@marcustech", testimonial: "Best mobile repair service in town. My water-damaged phone was salvaged perfectly. Highly recommended!", rating: 5,
|
||||
|
||||
@@ -41,7 +41,7 @@ export const defaultPosts: BlogPost[] = [
|
||||
excerpt: "Discover how to create a content strategy that drives engagement and conversions.",
|
||||
imageSrc: "/placeholders/placeholder3.avif",
|
||||
imageAlt: "Marketing strategy board",
|
||||
authorName: "Sarah Johnson",
|
||||
authorName: "Terence J Simmons",
|
||||
authorAvatar: "/placeholders/placeholder3.avif",
|
||||
date: "15 Jan 2025",
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user