81 lines
3.8 KiB
HTML
81 lines
3.8 KiB
HTML
<!doctype html>
|
||
<html lang="fa" dir="rtl">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>ایلو · دانشجو</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="styles.css" />
|
||
|
||
<script src="https://unpkg.com/react@18.3.1/umd/react.development.js" integrity="sha384-hD6/rw4ppMLGNu3tX5cjIb+uRZ7UkRJ6BPkLpg4hAu/6onKUg4lLsHAs9EBPT82L" crossorigin="anonymous"></script>
|
||
<script src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.development.js" integrity="sha384-u6aeetuaXnQ38mYT8rp6sbXaQe3NL9t+IBXmnYxwkUI2Hw4bsp2Wvmx4yRQF1uAm" crossorigin="anonymous"></script>
|
||
<script src="https://unpkg.com/@babel/standalone@7.29.0/babel.min.js" integrity="sha384-m08KidiNqLdpJqLq95G/LEi8Qvjl/xUYll3QILypMoQ65QorJ9Lvtp2RXYGBFj1y" crossorigin="anonymous"></script>
|
||
</head>
|
||
<body>
|
||
<div id="root"></div>
|
||
|
||
<script type="text/babel" src="icons.jsx"></script>
|
||
<script type="text/babel" src="shell.jsx"></script>
|
||
<script type="text/babel" src="student-data.jsx"></script>
|
||
<script type="text/babel" src="student-screens.jsx"></script>
|
||
|
||
<script type="text/babel">
|
||
const CRUMBS = {
|
||
dash: ['ایلو', 'خانه'],
|
||
mycourses: ['ایلو', 'دورههای من'],
|
||
catalog: ['ایلو', 'کاوش دورهها'],
|
||
detail: ['ایلو', 'کاوش دورهها', 'مبانی طراحی رابط کاربری'],
|
||
cert: ['ایلو', 'گواهینامهها'],
|
||
chat: ['ایلو', 'گفتوگو'],
|
||
};
|
||
|
||
function App() {
|
||
const [active, setActive] = React.useState('dash');
|
||
|
||
React.useEffect(() => {
|
||
const root = document.documentElement;
|
||
root.dataset.theme = 'light';
|
||
root.dataset.density = 'regular';
|
||
}, []);
|
||
|
||
const renderScreen = () => {
|
||
if (active === 'dash') return <StudentDash onOpen={setActive} />;
|
||
if (active === 'catalog') return <StudentCatalog onOpen={setActive} />;
|
||
if (active === 'detail') return <StudentCourseDetail />;
|
||
if (active === 'mycourses') return <StudentDash onOpen={setActive} />;
|
||
return (
|
||
<div className="page-inner">
|
||
<div className="card card-pad" style={{ minHeight: 320, display: 'grid', placeItems: 'center', textAlign: 'center' }}>
|
||
<div>
|
||
<div style={{ width: 56, height: 56, borderRadius: 16, background: 'var(--accent-soft)', color: 'var(--accent)', display: 'grid', placeItems: 'center', margin: '0 auto 14px' }}>
|
||
<Icon name={active === 'cert' ? 'cert' : 'chat'} style={{ width: 24, height: 24 }} />
|
||
</div>
|
||
<div style={{ fontSize: 18, fontWeight: 700 }}>بهزودی</div>
|
||
<div className="muted" style={{ fontSize: 13, marginTop: 6 }}>این بخش در نسخهی بعدی فعال میشود</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
return (
|
||
<div className="app">
|
||
<StudentSidebar active={active === 'detail' ? 'catalog' : active} onNav={setActive} />
|
||
<main className="main">
|
||
<Topbar crumb={CRUMBS[active] || ['ایلو']}
|
||
right={<a className="btn" href="Ilo Auth.html" style={{ textDecoration: 'none' }}>خروج</a>} />
|
||
<div className="page" key={active}>
|
||
{renderScreen()}
|
||
</div>
|
||
</main>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
ReactDOM.createRoot(document.getElementById('root')).render(<App />);
|
||
</script>
|
||
</body>
|
||
</html>
|