Internt_Programmirovanie_PI.../Lab4/web-site vite/Old_HTMLs/Courses.html
2023-11-21 12:37:22 +04:00

129 lines
6.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Courses</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="../src/myStyle.css">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css" >
<link rel="stylesheet" href="../node_modules/bootstrap/dist/css_mdb/mdb.min.css" />
<!-- Bootstrap JS -->
<script defer src="../node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
</head>
<body class="bg-image overflow-visible pageBackground">
<!--Шапка-->
<nav class="navbar navbar-expand-lg navbar-light navbar-style">
<div class="container-fluid">
<a class="navbar-brand btn btn-outline-dark" href="index1.html" >
<img src="../img/lable.png" alt="Logo" height="60" class="align-text-top">
</a>
<button class="navbar-toggler " type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<img src="../img/togglerIcon.png" alt="Toggler" height="40">
</button>
<div class="collapse navbar-collapse " id="navbarSupportedContent">
<ul class="navbar-nav">
<li class="nav-item ">
<a class="nav-link me-3 ms-3 fs-4 fw-bold" href="index1.html">Главная</a>
</li>
<li class="nav-item ">
<a class="nav-link me-3 ms-3 fs-4 fw-bold" href="Galery.html" >Галерея</a>
</li>
<li class="nav-item " >
<a class="nav-link active me-3 ms-3 fs-3 fw-bold" aria-current="page" href="./Courses.html">Курсы</a>
</li>
<li class="nav-item " >
<a class="nav-link me-3 ms-3 fs-4 fw-bold" href="Contacts.html" >Контакты</a>
</li>
<li class="nav-item " >
<a class="nav-link me-3 ms-3 fs-4 fw-bold" href="Reviews.html" >Отзывы</a>
</li>
<li class="nav-item " >
<a class="nav-link me-3 ms-3 fs-4 fw-bold" href="Admin.html" >Админ</a>
</li>
</ul>
</div>
</div>
</nav>
<!--Шапка-->
<!--Курсы-->
<div class="container mx-auto my-5 formSizeStyle">
<div class="row row-cols-xl-3 row-cols-md-2 row-cols-1 pd-3 text-center text-secondary-emphasis">
<div class="coll col-xxl-4 col-lg-6 col-12 mx-auto mb-3 p-2 rounded-8 fw-bold formStyle hfitcon wfitcon" >
<img src="../img/CourseImage1.jpg" class="my-3 rounded-9" alt="image" height="150">
<div class="my-3 fs-3 fw-bold">
1 занятие <br>
2500 рублей
</div>
<button class="btn rounded-pill btn-lg text-light my-3 fw-normal fs-6 purple" data-bs-toggle="modal" data-bs-target="#signUp">
Записаться
</button>
</div>
<div class="coll col-xxl-4 col-lg-6 col-12 mx-auto mb-3 p-2 rounded-8 fw-bold formStyle hfitcon wfitcon">
<img src="../img/CourseImage2.jpg" class="my-3 rounded-9" alt="image" height="150">
<div class="my-3 fs-3 fw-bold">
5 занятий <br>
10000 рублей
</div>
<button class="btn rounded-pill btn-lg text-light my-3 fw-normal fs-6 purple" data-bs-toggle="modal" data-bs-target="#signUp">
Записаться
</button>
</div>
<div class="coll col-xxl-4 col-lg-6 col-12 mx-auto mb-3 p-2 rounded-8 fw-bold formStyle hfitcon wfitcon">
<img src="../img/CourseImage3.jpg" class="my-3 rounded-9" alt="image" height="150">
<div class="my-3 fs-3 fw-bold">
11 занятий <br>
20000 рублей
</div>
<button class="btn rounded-pill btn-lg text-light my-3 fw-normal fs-6 purple" data-bs-toggle="modal" data-bs-target="#signUp">
Записаться
</button>
</div>
</div>
</div>
<!--Модальное окно-->
<div class="modal fade" id="signUp" tabindex="-1" aria-labelledby="signUp" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content rounded-8 modalStyle">
<div class="modal-header">
<h5 class="modal-title fw-bold fs-3 text-secondary-emphasis" id="signUpLabel">Запись на курс</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
</div>
<div class="modal-body">
<form>
<div class="mb-3">
<label for="recipient-name" class="col-form-label fw-bold fw-5 text-secondary-emphasis">Ваше имя:</label>
<input type="text" class="form-control rounded-8 light-grey" id="recipient-name">
</div>
<div class="mb-3">
<label for="signUpText" class="col-form-label fw-bold fw-5 text-secondary-emphasis">Ваш номер телефона +7-...:</label>
<input type="tel" class="form-control rounded-8 light-grey" id="signUpText">
</div>
<p class="fw-bold fw-5 text-secondary-emphasis">С вами свяжется наш оператор для уточнения деталей</p>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn rounded-pill text-light fw-normal fs-6 purple">Ввод</button>
</div>
</div>
</div>
</div>
<!--Подвал-->
<footer class="position-sticky top-100 footer-style">
<div class="container">
<div class="row">
<div class="col-sm text-center text-sm-start text-light fw-bold fs-5">
Техническая поддержка <br>
8-800-555-3535 <br>
valitzhoska73@gmail.com
</div>
<div class="col-sm text-center text-sm-end text-light fw-bold fs-5">
Работаем без выходных с 8:00 до 21:30
</div>
</div>
</div>
</footer>
<!--Подвал-->
</body>
</html>