Import source: app/src/pages/CoursesPage
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
@@ -0,0 +1,25 @@
|
|||||||
|
import { useState, useEffect } from 'react';
|
||||||
|
import { contentApi } from '../../src/lib/content-api.js';
|
||||||
|
|
||||||
|
export function CoursesPage() {
|
||||||
|
const [items, setItems] = useState([]);
|
||||||
|
useEffect(() => { contentApi.listCourses().then(setItems).catch(() => setItems([])); }, []);
|
||||||
|
return (
|
||||||
|
<div style={{ paddingTop: 80, background: '#FAF7F0', minHeight: '100vh', fontFamily: 'Vazirmatn,sans-serif', direction: 'rtl' }}>
|
||||||
|
<div style={{ maxWidth: 1040, margin: '0 auto', padding: '40px 24px' }}>
|
||||||
|
<h1 style={{ fontSize: 32, fontWeight: 900, color: '#263238', margin: '0 0 8px' }}>دورههای تخصصی تکناو</h1>
|
||||||
|
<p style={{ color: '#5F6B6D', lineHeight: 1.9, margin: '0 0 28px' }}>مسیرهای آموزشی فارسی برای تیمهایی که فناوری را در محصول و عملیات واقعی به کار میگیرند.</p>
|
||||||
|
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit,minmax(260px,1fr))', gap: 16 }}>
|
||||||
|
{items.map(course => (
|
||||||
|
<article key={course.id} style={{ background: '#fff', border: '1px solid #E4DDD2', borderRadius: 12, padding: 20 }}>
|
||||||
|
<div style={{ color: '#0F6B73', fontSize: 12, fontWeight: 800, marginBottom: 8 }}>{course.level}</div>
|
||||||
|
<h2 style={{ margin: '0 0 10px', color: '#263238', fontSize: 19 }}>{course.title}</h2>
|
||||||
|
<p style={{ color: '#5F6B6D', lineHeight: 1.9, fontSize: 13 }}>{course.summary}</p>
|
||||||
|
<div style={{ marginTop: 16, color: '#D49A2A', fontWeight: 900 }}>{course.price ? `${course.price.toLocaleString('fa-IR')} تومان` : 'بهزودی'}</div>
|
||||||
|
</article>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user