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

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>МБОУ СОШ № 3 г. Новошахтинск</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
</head>
<body>
    <header class="header">
        <div class="container header__content">
            <div class="logo">
                <i class="fa-solid fa-graduation-cap"></i>
                <h1>МБОУ СОШ № 3</h1>
            </div>
            <nav class="nav">
                <a href="#about">О школе</a>
                <a href="#features">Преимущества</a>
                <a href="#contacts">Контакты</a>
                <a href="#grades" class="btn btn--primary">Учёт успеваемости</a>
            </nav>
        </div>
    </header>

    <section class="hero">
        <div class="container">
            <h2>Образование, которое открывает будущее</h2>
            <p>Современные методики, квалифицированные педагоги и комфортная среда для каждого ученика.</p>
        </div>
    </section>

    <section id="about" class="about">
        <div class="container">
            <h2>О нашей школе</h2>
            <p>МБОУ СОШ № 3 г. Новошахтинска – образовательное учреждение с более чем 50-летней историей. Мы реализуем программы начального, основного и среднего общего образования в соответствии с ФГОС, уделяя особое внимание развитию цифровой грамотности и воспитательной работе.</p>
        </div>
    </section>

    <section id="features" class="features">
        <div class="container">
            <h2>Наши преимущества</h2>
            <div class="features__grid">
                <div class="card"><i class="fa-solid fa-chalkboard-user"></i><h3>Квалифицированные педагоги</h3><p>95% учителей имеют высшую и первую категории.</p></div>
                <div class="card"><i class="fa-solid fa-laptop-code"></i><h3>Цифровая среда</h3><p>Интерактивные доски, Wi-Fi, электронный дневник.</p></div>
                <div class="card"><i class="fa-solid fa-users"></i><h3>Инклюзивность</h3><p>Адаптивные программы и психологическое сопровождение.</p></div>
            </div>
        </div>
    </section>
    <section id="grades" class="grade-system">
        <div class="container">
            <h2>Система учёта успеваемости</h2>
            <form id="gradeForm" class="grade-form">
                <div class="form-group">
                    <label for="fullName">ФИО учащегося *</label>
                    <input type="text" id="fullName" name="fullName" required>
                </div>
                <div class="form-row">
                    <div class="form-group">
                        <label for="class">Класс *</label>
                        <select id="class" name="class" required>
                            <option value="">Выберите</option>
                            <option value="5-А">5-А</option><option value="6-Б">6-Б</option>
                            <option value="7-В">7-В</option><option value="8-А">8-А</option>
                            <option value="9-Б">9-Б</option><option value="10-А">10-А</option>
                            <option value="11-Б">11-Б</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="subject">Предмет *</label>
                        <select id="subject" name="subject" required>
                            <option value="">Выберите</option>
                            <option value="Математика">Математика</option>
                            <option value="Русский язык">Русский язык</option>
                            <option value="Информатика">Информатика</option>
                            <option value="Физика">Физика</option>
                            <option value="История">История</option>
                        </select>
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group">
                        <label for="grade">Оценка (1–5) *</label>
                        <input type="number" id="grade" name="grade" min="1" max="5" required>
                    </div>
                    <div class="form-group">
                        <label for="date">Дата *</label>
                        <input type="date" id="date" name="date" required>
                    </div>
                </div>
                <div class="form-group">
                    <label for="comment">Комментарий</label>
                    <textarea id="comment" name="comment" rows="3"></textarea>
                </div>
                <button type="submit" class="btn btn--success">Сохранить запись</button>
                <div id="formMessage" class="form-message"></div>
            </form>
        </div>
    </section>
    <section id="contacts" class="contacts">
        <div class="container">
            <h2>Контакты</h2>
            <div class="contacts__grid">
                <div class="contact-card"><i class="fa-solid fa-location-dot"></i><p>г. Новошахтинск, ул. Ленина, 15</p></div>
                <div class="contact-card"><i class="fa-solid fa-clock"></i><p>Пн–Пт: 08:00–17:00</p></div>
                <div class="contact-card"><i class="fa-solid fa-phone"></i><p>+7 (86369) 2-15-33</p></div>
            </div>
        </div>
    </section>

    <footer class="footer">
        <div class="container">
            <p>&copy; 2026 МБОУ СОШ № 3 г. Новошахтинск. Все права защищены.</p>
        </div>
    </footer>

    <script src="script.js"></script>
</body>
</html>