105 lines
4.3 KiB
TypeScript
105 lines
4.3 KiB
TypeScript
import React from 'react';
|
|
|
|
export default function TestimonialsSection() {
|
|
return (
|
|
<section className="testimonials-section">
|
|
<div className="flagship-container">
|
|
<div className="testimonials-header text-center max-w-2xl mx-auto mb-12">
|
|
<div className="font-label-caps text-blue-accent pill-label bg-surface-high mb-10px">
|
|
RACED ON TRACK & CANYONS
|
|
</div>
|
|
<h2 className="font-headline-xl text-ink m-0">
|
|
Validated by racers, coaches & road captains.
|
|
</h2>
|
|
</div>
|
|
|
|
<div className="testimonial-grid">
|
|
{/* Testimonial 1 */}
|
|
<div className="testimonial-card">
|
|
<div className="testimonial-content">
|
|
<div className="testimonial-stars text-green-accent">
|
|
{[...Array(5)].map((_, i) => (
|
|
<span key={i} className="material-symbols-outlined icon-md">
|
|
star
|
|
</span>
|
|
))}
|
|
</div>
|
|
<p className="font-body-md testimonial-quote m-0 italic">
|
|
"The instant lean angle telemetry transformed my coaching. Being able to demonstrate the difference
|
|
between 44° and 52° roll stability visually after every session cut seconds off our students' pace."
|
|
</p>
|
|
</div>
|
|
<div className="testimonial-author-row">
|
|
<div className="testimonial-avatar bg-cyan-accent text-on-primary-container">
|
|
DR
|
|
</div>
|
|
<div className="testimonial-author-info">
|
|
<span className="font-headline-sm text-ink">
|
|
Dave Rossi
|
|
</span>
|
|
<span className="font-body-sm text-muted">Lead Coach, Apex Pro Track School</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Testimonial 2 */}
|
|
<div className="testimonial-card">
|
|
<div className="testimonial-content">
|
|
<div className="testimonial-stars text-green-accent">
|
|
{[...Array(5)].map((_, i) => (
|
|
<span key={i} className="material-symbols-outlined icon-md">
|
|
star
|
|
</span>
|
|
))}
|
|
</div>
|
|
<p className="font-body-md testimonial-quote m-0 italic">
|
|
"In group canyon rides, the Fleet Beacon brings absolute peace of mind. We had a rider go down in a
|
|
blind downhill hairpin—MotorSignal flagged the G-impact instantly and notified the sweep rider."
|
|
</p>
|
|
</div>
|
|
<div className="testimonial-author-row">
|
|
<div className="testimonial-avatar bg-green-accent text-surface-lowest">
|
|
MK
|
|
</div>
|
|
<div className="testimonial-author-info">
|
|
<span className="font-headline-sm text-ink">
|
|
Maya Kovacs
|
|
</span>
|
|
<span className="font-body-sm text-muted">Founder, Bay Area Moto Collective</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Testimonial 3 */}
|
|
<div className="testimonial-card">
|
|
<div className="testimonial-content">
|
|
<div className="testimonial-stars text-green-accent">
|
|
{[...Array(5)].map((_, i) => (
|
|
<span key={i} className="material-symbols-outlined icon-md">
|
|
star
|
|
</span>
|
|
))}
|
|
</div>
|
|
<p className="font-body-md testimonial-quote m-0 italic">
|
|
"The 10Hz GPS accuracy matches dedicated telemetry loggers costing ten times as much. Plugged straight
|
|
into my Panigale OBD CAN-link and synced in under two minutes."
|
|
</p>
|
|
</div>
|
|
<div className="testimonial-author-row">
|
|
<div className="testimonial-avatar bg-blue-accent text-surface-lowest">
|
|
TJ
|
|
</div>
|
|
<div className="testimonial-author-info">
|
|
<span className="font-headline-sm text-ink">
|
|
Tyler Jenkins
|
|
</span>
|
|
<span className="font-body-sm text-muted">MotoAmerica Supersport Competitor</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|