35 lines
1015 B
TypeScript
35 lines
1015 B
TypeScript
|
// components/portfolio/PortfolioExecutiveSummary.tsx
|
||
|
|
import { motion } from "framer-motion";
|
||
|
|
|
||
|
|
interface PortfolioExecutiveSummaryProps {
|
||
|
|
title?: string;
|
||
|
|
content: string;
|
||
|
|
backgroundColor?: string;
|
||
|
|
}
|
||
|
|
|
||
|
|
export const PortfolioExecutiveSummary = ({
|
||
|
|
title = "Executive Summary",
|
||
|
|
content,
|
||
|
|
backgroundColor = "bg-card/30"
|
||
|
|
}: PortfolioExecutiveSummaryProps) => {
|
||
|
|
return (
|
||
|
|
<section className={`py-24 ${backgroundColor}`}>
|
||
|
|
<div className="container mx-auto px-4 lg:px-6">
|
||
|
|
<motion.div
|
||
|
|
initial={{ opacity: 0, y: 20 }}
|
||
|
|
whileInView={{ opacity: 1, y: 0 }}
|
||
|
|
transition={{ duration: 0.8 }}
|
||
|
|
viewport={{ once: true }}
|
||
|
|
className="max-w-4xl mx-auto text-center"
|
||
|
|
>
|
||
|
|
<h2 className="text-3xl lg:text-5xl font-semibold text-foreground mb-8">
|
||
|
|
{title}
|
||
|
|
</h2>
|
||
|
|
<p className="text-xl text-muted-foreground leading-relaxed">
|
||
|
|
{content}
|
||
|
|
</p>
|
||
|
|
</motion.div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
);
|
||
|
|
};
|