Загрузка данных


<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Мой профиль — SkillDrop</title>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
</head>
<body>

    <header class="header">
        <div class="container">
            <a href="index.html" class="logo"><div class="logo-icon">⚡</div> SkillDrop</a>
            <nav class="nav"><a href="catalog.html">Каталог</a></nav>
            <div><a href="create-course.html" class="btn btn-blue">Создать курс</a></div>
        </div>
    </header>

    <main class="container main-content">
        
        <!-- Шапка профиля -->
        <div class="card" style="display: flex; align-items: center; gap: 30px; padding: 30px; margin-bottom: 30px;">
            <div style="width: 80px; height: 80px; background: #EEF2FF; color: #4F46E5; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 32px; font-weight: bold;">А</div>
            <div>
                <h1 style="margin-bottom: 5px;">Алексей К.</h1>
                <p style="color: #6B7280;">Автор и студент</p>
            </div>
        </div>

        <h2 style="margin-bottom: 20px;">Мои созданные курсы</h2>

        <!-- Простая таблица вместо сложной верстки -->
        <div class="card" style="padding: 0; overflow-x: auto;">
            <table style="width: 100%; border-collapse: collapse; text-align: left;">
                <thead style="background: #F9FAFB;">
                    <tr>
                        <th style="padding: 15px; border-bottom: 1px solid #E5E7EB;">Название</th>
                        <th style="padding: 15px; border-bottom: 1px solid #E5E7EB;">Статус</th>
                        <th style="padding: 15px; border-bottom: 1px solid #E5E7EB;">Просмотры</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td style="padding: 15px; border-bottom: 1px solid #E5E7EB; font-weight: 500;">Git и GitHub</td>
                        <td style="padding: 15px; border-bottom: 1px solid #E5E7EB;">
                            <span style="color: #059669; background: #D1FAE5; padding: 4px 10px; border-radius: 20px; font-size: 12px; font-weight: bold;">Опубликован</span>
                        </td>
                        <td style="padding: 15px; border-bottom: 1px solid #E5E7EB; color: #6B7280;">1 245</td>
                    </tr>
                    <tr>
                        <td style="padding: 15px; border-bottom: 1px solid #E5E7EB; font-weight: 500;">Терминал Linux</td>
                        <td style="padding: 15px; border-bottom: 1px solid #E5E7EB;">
                            <span style="color: #D97706; background: #FEF3C7; padding: 4px 10px; border-radius: 20px; font-size: 12px; font-weight: bold;">На модерации</span>
                        </td>
                        <td style="padding: 15px; border-bottom: 1px solid #E5E7EB; color: #6B7280;">—</td>
                    </tr>
                </tbody>
            </table>
        </div>

    </main>

</body>
</html>