You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
104 lines
2.6 KiB
104 lines
2.6 KiB
6 months ago
|
import React from 'react';
|
||
|
|
import CourseCard from '@/components/elements/CourseCard';
|
||
|
|
|
||
|
|
const FeaturedCourses = () => {
|
||
|
|
const courses = [
|
||
|
|
{
|
||
|
|
id: 1,
|
||
|
|
title: 'Foundation course to under stand about software',
|
||
|
|
category: 'Data & Tech',
|
||
|
|
lessons: 23,
|
||
|
|
duration: '1hr 30 min',
|
||
|
|
price: 32.00,
|
||
|
|
originalPrice: 89.00,
|
||
|
|
instructor: {
|
||
|
|
name : 'Micie John',
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
},
|
||
|
|
rating: 4.5,
|
||
|
|
reviews: 44,
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: 2,
|
||
|
|
title: 'Nidhies course to under stand about softwere',
|
||
|
|
category: 'Mechanical',
|
||
|
|
lessons: 29,
|
||
|
|
duration: '2hr 30 min',
|
||
|
|
price: 32.00,
|
||
|
|
originalPrice: 89.00,
|
||
|
|
instructor: {
|
||
|
|
name : 'Micie John',
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
},
|
||
|
|
rating: 4.5,
|
||
|
|
reviews: 44,
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: 3,
|
||
|
|
title: 'Minws course to under stand about solution',
|
||
|
|
category: 'Development',
|
||
|
|
lessons: 25,
|
||
|
|
duration: '1hr 40 min',
|
||
|
|
price: 40.00,
|
||
|
|
originalPrice: 89.00,
|
||
|
|
instructor: {
|
||
|
|
name : 'Micie John',
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
},
|
||
|
|
rating: 4.5,
|
||
|
|
reviews: 44,
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: 3,
|
||
|
|
title: 'Minws course to under stand about solution',
|
||
|
|
category: 'Development',
|
||
|
|
lessons: 25,
|
||
|
|
duration: '1hr 40 min',
|
||
|
|
price: 40.00,
|
||
|
|
originalPrice: 89.00,
|
||
|
|
instructor: {
|
||
|
|
name : 'Micie John',
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
},
|
||
|
|
rating: 4.5,
|
||
|
|
reviews: 44,
|
||
|
|
image: 'https://dummyimage.com/300'
|
||
|
|
}
|
||
|
|
];
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="max-w-7xl mx-auto p-6">
|
||
|
|
<div className="flex justify-between items-center my-12">
|
||
|
|
<div>
|
||
|
|
<h1 className="text-3xl font-bold">Featured Courses</h1>
|
||
|
|
<h2 className="text-xl text-purple-700">View all featured courses</h2>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||
|
|
|
||
|
|
{
|
||
|
|
courses?.map((course : Record<string,any> , index) => {
|
||
|
|
return(
|
||
|
|
<CourseCard
|
||
|
|
key={index}
|
||
|
|
id={course.id}
|
||
|
|
image ={course?.image}
|
||
|
|
title ={course?.title}
|
||
|
|
category = {course?.category}
|
||
|
|
lessons = {course?.lessons}
|
||
|
|
instructor = {course?.instructor}
|
||
|
|
duration={course?.duration}
|
||
|
|
/>
|
||
|
|
)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default FeaturedCourses;
|