22 lines
906 B
JavaScript
22 lines
906 B
JavaScript
|
import { motion } from "framer-motion";
|
||
|
|
export default function FeaturesOurCompany({ icon, title, discripction }) {
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<motion.div
|
||
|
|
className="group bg-white p-6 rounded-xl shadow-sm hover:shadow-md transition-all duration-300 border border-gray-100"
|
||
|
|
initial={{ opacity: 0, y: 20 }}
|
||
|
|
whileInView={{ opacity: 1, y: 0 }}
|
||
|
|
viewport={{ once: false }}
|
||
|
|
transition={{ duration: 0.5, delay: 0.1 }}
|
||
|
|
whileHover={{ y: -4 }}
|
||
|
|
>
|
||
|
|
<div className="flex items-center gap-4 mb-4">
|
||
|
|
<div className="w-12 h-12 bg-amber-100 rounded-xl flex items-center justify-center group-hover:bg-amber-200 transition-colors duration-300">{icon}</div>
|
||
|
|
<h3 className="text-lg font-bold text-gray-900">{title}</h3>
|
||
|
|
</div>
|
||
|
|
<p className="text-gray-600 text-sm leading-relaxed">{discripction}</p>
|
||
|
|
</motion.div>
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
}
|