Третья+Четвертая лаба
This commit is contained in:
Marselchi
@@ -65,7 +65,7 @@
|
|||||||
"id": 6
|
"id": 6
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"genre": [
|
"genres": [
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 1,
|
||||||
"name": "Ужасы"
|
"name": "Ужасы"
|
||||||
|
|||||||
BIN
lab3/images/bro.jpg
Normal file
BIN
lab3/images/bro.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 178 KiB |
BIN
lab3/images/fire.jpg
Normal file
BIN
lab3/images/fire.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 322 KiB |
BIN
lab3/images/harry.jpg
Normal file
BIN
lab3/images/harry.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 262 KiB |
BIN
lab3/images/noimage.png
Normal file
BIN
lab3/images/noimage.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
lab3/images/nolan.jpg
Normal file
BIN
lab3/images/nolan.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 169 KiB |
4716
lab3/package-lock.json
generated
Normal file
4716
lab3/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
31
lab3/package.json
Normal file
31
lab3/package.json
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
{
|
||||||
|
"name": "web",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {
|
||||||
|
"vite": "vite",
|
||||||
|
"serve": "http-server -p 3000 ./dist/",
|
||||||
|
"build": "vite build",
|
||||||
|
"rest": "json-server --watch data.json -p 8081",
|
||||||
|
"dev": "npm-run-all --parallel rest vite",
|
||||||
|
"prod": "npm-run-all build --parallel serve rest"
|
||||||
|
},
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC",
|
||||||
|
"dependencies": {
|
||||||
|
"@fortawesome/fontawesome-free": "^6.5.1",
|
||||||
|
"bootstrap": "^5.2.1",
|
||||||
|
"bootstrap-datepicker": "^1.10.0",
|
||||||
|
"jquery": "^3.7.1"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"eslint": "8.50.0",
|
||||||
|
"eslint-config-airbnb-base": "15.0.0",
|
||||||
|
"eslint-plugin-import": "2.28.1",
|
||||||
|
"http-server": "14.1.1",
|
||||||
|
"json-server": "0.17.4",
|
||||||
|
"npm-run-all": "4.1.5",
|
||||||
|
"vite": "4.4.9"
|
||||||
|
}
|
||||||
|
}
|
||||||
101
lab3/search.html
Normal file
101
lab3/search.html
Normal file
@@ -0,0 +1,101 @@
|
|||||||
|
<html lang="ru">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Онлайн-кинотеатр</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class ="d-flex flex-column h-100">
|
||||||
|
<div>
|
||||||
|
<header id="header" class="header row w-100 m-0 mb-3">
|
||||||
|
<div class="p-0">
|
||||||
|
<div class="d-flex pt-lg-3 px-lg-5 p-0 justify-content-lg-between row w-100 m-0">
|
||||||
|
<div class="col-0 col-lg bg-cyan mw-100 mh-100">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex col p-1 pe-0 fs-2 bg-cyan mw-100 mh-100 text-break flex-grow-1 justify-content-center justify-content-lg-start">
|
||||||
|
<a class ="text-decoration-none text-center text-black fs-2 fw-normal font-family-Average Sans m-0 py-2" href="index.html">Онлайн-кинотеатр</a>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex flex-column col-sm-6 col-lg-3 col-xl-2 p-0 bg-cyan ">
|
||||||
|
<div class= "d-flex p-1 ps-0 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<a class = "text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0" href="signup.html">Регистрация</a>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex p-1 ps-0 pb-2 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<a class="text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0" href="login.html">Вход</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="input-group row text-break w-100 mt-3 p-0 mb-2">
|
||||||
|
<div class="form-outline col text-break h-100 flex-grow-1">
|
||||||
|
<input id="search-focus" type="search" id="form1" class="form-control ms-3 p-2 ms-lg-0" placeholder="Введите название фильма" />
|
||||||
|
</div>
|
||||||
|
<div class="dropdown col-1 col-lg-2 col-xl-3 w-auto mx-3 p-0 text-break h-100">
|
||||||
|
<button class="btn btn-secondary dropdown-toggle h-100" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
|
||||||
|
<span class="d-none d-lg-inline">Выберите жанр</span>
|
||||||
|
</button>
|
||||||
|
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<button type="button" class="btn btn-primary col-1 col-sm-1 col-lg-3 col-xl-2 h-100 w-auto">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
|
||||||
|
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
|
||||||
|
</svg>
|
||||||
|
<span class="d-none d-lg-inline">Поиск</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid flex-shrink-0">
|
||||||
|
<div class="row m-2 my-5 ">
|
||||||
|
<div class="col d-flex align-items-center justify-content-center">
|
||||||
|
<a href="selected.html" class="col-xs-12 col-lg-3 w-auto h-auto"><img src="images/fire.jpg" class="img-fluid" alt=""></a>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex flex-column col-xs-12 col-lg-6 col-xl-8 p-0 justify-content-center">
|
||||||
|
<div class= "d-flex p-1 ps-0 justify-content-center mw-100 mh-100 mx-4">
|
||||||
|
<p class="text-white fs-5 fw-normal font-family-Bayon text-center">Фильм-катастрофа о подвиге небольшой бригады пожарных и спасателей, которые борются с неистовой огненной стихией, уничтожающей всё на своем пути. Герои работают в эпицентре лесного пожара и приходят на помощь</p>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex p-1 ps-0 pb-2 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<p class="text-center text-white fs-3 fw-normal font-family-Bayon">Приключения, катастрофа, драма, боевик</p>
|
||||||
|
</div>
|
||||||
|
<a href="selected.html" class="d-flex btn btn-primary justify-content-center p-5 fs-4 m-3">
|
||||||
|
Перейти
|
||||||
|
</a>
|
||||||
|
<a class="d-flex btn btn-primary justify-content-center p-5 fs-5 m-3">
|
||||||
|
Добавить в избранное
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row m-2 my-5">
|
||||||
|
<div class="col d-flex align-items-center justify-content-center">
|
||||||
|
<a href="selected.html" class="col-xs-12 col-lg-3 w-auto h-auto"><img src="images/fire.jpg" class="img-fluid" alt=""></a>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex flex-column col-xs-12 col-lg-6 col-xl-8 p-0 justify-content-center">
|
||||||
|
<div class= "d-flex p-1 ps-0 justify-content-center mw-100 mh-100 text-break mx-4">
|
||||||
|
<p class="text-white fs-5 fw-normal font-family-Bayon text-center">Фильм-катастрофа о подвиге небольшой бригады пожарных и спасателей, которые борются с неистовой огненной стихией, уничтожающей всё на своем пути. Герои работают в эпицентре лесного пожара и приходят на помощь</p>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex p-1 ps-0 pb-2 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<p class="text-center text-white fs-3 fw-normal font-family-Bayon">Приключения, катастрофа, драма, боевик</p>
|
||||||
|
</div>
|
||||||
|
<a href="selected.html" class="d-flex btn btn-primary justify-content-center p-5 fs-4 m-3">
|
||||||
|
Перейти
|
||||||
|
</a>
|
||||||
|
<a class="d-flex btn btn-primary justify-content-center p-5 fs-5 m-3">
|
||||||
|
Добавить в избранное
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
<footer class="footer mt-auto fixed bottom-0">
|
||||||
|
<div class= "bg-dark-blue d-flex text-center justify-content-center">
|
||||||
|
<p class="text-black fs-5 fw-normal font-family-Average Sans">Фильмы нам не пренадлежат</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
64
lab3/selected.html
Normal file
64
lab3/selected.html
Normal file
@@ -0,0 +1,64 @@
|
|||||||
|
<html lang="ru">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Онлайн-кинотеатр</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class ="d-flex flex-column h-100">
|
||||||
|
<header id="header" class="header row w-100 m-0 mb-3">
|
||||||
|
<div class="p-0">
|
||||||
|
<div class="d-flex pt-lg-3 px-lg-5 p-0 justify-content-lg-between row w-100 m-0">
|
||||||
|
<div class="col-0 col-lg bg-cyan mw-100 mh-100">
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex col p-1 pe-0 fs-2 bg-cyan mw-100 mh-100 text-break flex-grow-1 justify-content-center justify-content-lg-start">
|
||||||
|
<a class ="text-decoration-none text-center text-black fs-2 fw-normal font-family-Average Sans py-2" href="index.html">Онлайн-кинотеатр</a>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex flex-column col-xs-12 col-sm-6 col-lg-3 col-xl-2 p-0 bg-cyan">
|
||||||
|
<div class= "d-flex p-1 ps-0 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<a class = "text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0" href="signup.html">Регистрация</a>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex p-1 ps-0 pb-2 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<a class="text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0" href="login.html">Вход</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid flex-shrink-0">
|
||||||
|
<div class="ms-3">
|
||||||
|
<div class="row p-2 justify-content-center">
|
||||||
|
<img class="col-12 col-lg-6 img-fluid w-auto h-auto" src="images/fire.jpg" alt="" style="max-height: 590;">
|
||||||
|
<div class="col-12 col-lg-6 text-wrap px-2 d-flex justify-content-center mt-3">
|
||||||
|
<p class="text-white fs-3 fw-normal font-family-Bayon text-lg-start text-center">Дата выхода: 2020<br/>Режиссер:<br/>Алексей Нужный<br/>В главных ролях:<br/>Константин Хабенский, Иван Янковский, Стася Милославская...<br/>Язык: Русский</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 d-flex justify-content-center m-0 flex-column mt-5">
|
||||||
|
<div class="d-flex justify-content-center">
|
||||||
|
<h1 class="text-white fs-2 fw-normal font-family-Bayon">Огонь</h1>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex text-wrap me-3">
|
||||||
|
<p class="text-white fs-5 fw-normal font-family-Bayon text-lg-center mb-0 px-3 py-2" style="text-align: justify;">Фильм-катастрофа о подвиге небольшой бригады пожарных и спасателей, которые борются с неистовой огненной стихией, уничтожающей всё на своем пути. Герои работают в эпицентре лесного пожара и приходят на помощь жителям близлежащей деревни. Константин Хабенский, Иван Янковский и Стася Милославская в зрелищном героическом блокбастере от режиссера Алексея Нужного и создателей кинохитов «Движение вверх», «Экипаж», «Легенда № 17».<br/>Наступает тяжелый сезон разрушительных лесных пожаров. Борьба с ними не на жизнь, а на смерть разворачивается возле маленького села Ольхово в Карелии. На вызов прибыла бригада из шести пожарных во главе с опытным инструктором Алексеем Павловичем Соколовым. У каждого члена группы своя история: кто-то уже потерял в огне самых близких, кого-то с беспокойством ждут дома. Есть среди них и новичок – самоуверенный красавец Роман Ильин. Он ухаживает за дочкой Соколова Катей, работающей на базе в диспетчерской. Вот только отношения с самим Алексеем Павловичем у Ильина не задались – и это мягко говоря. Конфликт нарастает перед лицом свирепого пожара, угрожающего деревенским жителям, которых приходится эвакуировать в экстремальных условиях.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row justify-content-around">
|
||||||
|
<buttnon class="d-flex btn btn-primary justify-content-center col p-5 fs-4 m-3 align-items-center">
|
||||||
|
Смотреть
|
||||||
|
</buttnon>
|
||||||
|
<buttnon class="d-flex btn btn-primary justify-content-center col p-5 fs-5 m-3 align-items-center">
|
||||||
|
Добавить в избранное
|
||||||
|
</buttnon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
<footer class="footer mt-auto fixed bottom-0">
|
||||||
|
<div class= "bg-dark-blue d-flex text-center justify-content-center">
|
||||||
|
<p class="text-black fs-5 fw-normal font-family-Average Sans">Фильмы нам не пренадлежат</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
61
lab3/signup.html
Normal file
61
lab3/signup.html
Normal file
@@ -0,0 +1,61 @@
|
|||||||
|
<html lang="ru">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Онлайн-кинотеатр</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class ="d-flex flex-column h-100">
|
||||||
|
<header id="header" class="header row w-100 m-0 mb-3">
|
||||||
|
<div class="p-0">
|
||||||
|
<div class="d-flex pt-lg-3 px-lg-5 p-0 justify-content-lg-between row w-100 m-0">
|
||||||
|
<div class="col-0 col-lg bg-cyan mw-100 mh-100">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex col p-1 pe-0 fs-2 bg-cyan mw-100 mh-100 text-break flex-grow-1 justify-content-center justify-content-lg-start">
|
||||||
|
<a class ="text-decoration-none text-center text-black fs-2 fw-normal font-family-Average Sans py-2" href="index.html">Онлайн-кинотеатр</a>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex flex-column col-xs-12 col-sm-6 col-lg-3 col-xl-2 p-0 bg-cyan">
|
||||||
|
<div class= "d-flex p-1 ps-0 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<a class = "text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0" href="signup.html">Регистрация</a>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex p-1 ps-0 pb-2 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<a class="text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0" href="login.html">Вход</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid flex-shrink-0">
|
||||||
|
<section class="d-flex align-items-center justify-content-center">
|
||||||
|
<div class="container">
|
||||||
|
<div class="justify-content-center pt-2">
|
||||||
|
<p class="text-center text-white fs-2 fw-normal font-family-Average Sans">Регистрация</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<form class="d-flex align-items-center justify-content-center">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row justify-content-center mt-5 col">
|
||||||
|
<div class="flex-column d-flex col p-2 align-items-center">
|
||||||
|
<input type="text" class="form-control p-2 m-2" placeholder="Имя пользователя">
|
||||||
|
<input type="text" class="form-control p-2 m-2" placeholder="Почта">
|
||||||
|
<input type="text" class="form-control p-2 m-2" placeholder="Пароль">
|
||||||
|
<input type="text" class="form-control p-2 m-2" placeholder="Повторите пароль">
|
||||||
|
<button type="submit" class="btn btn-primary mt-5 text-break px-5 py-1 fs-2">Зарегистрироваться</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
<footer class="footer mt-auto fixed bottom-0">
|
||||||
|
<div class= "bg-dark-blue d-flex text-center justify-content-center">
|
||||||
|
<p class="text-black fs-5 fw-normal font-family-Average Sans">Фильмы нам не пренадлежат</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
16
lab3/style.css
Normal file
16
lab3/style.css
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
body{
|
||||||
|
background-color:#194F75;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.bg-cyan{
|
||||||
|
background-color: #71B8F7;
|
||||||
|
}
|
||||||
|
.bg-grey{
|
||||||
|
background-color: #D9D9D9;
|
||||||
|
}
|
||||||
|
.bg-dark-blue{
|
||||||
|
background-color: #2B82CF;
|
||||||
|
}
|
||||||
|
main{
|
||||||
|
flex: 1 1 auto;
|
||||||
|
}
|
||||||
22
lab3/vite.config.js
Normal file
22
lab3/vite.config.js
Normal file
@@ -0,0 +1,22 @@
|
|||||||
|
import { resolve } from "path";
|
||||||
|
// eslint-disable-next-line import/no-extraneous-dependencies
|
||||||
|
import { defineConfig } from "vite";
|
||||||
|
|
||||||
|
export default defineConfig({
|
||||||
|
build: {
|
||||||
|
sourcemap: true,
|
||||||
|
emptyOutDir: true,
|
||||||
|
rollupOptions: {
|
||||||
|
input: {
|
||||||
|
main: resolve(__dirname, "index.html"),
|
||||||
|
selected: resolve(__dirname, "selected.html"),
|
||||||
|
favourite: resolve(__dirname, "favourite.html"),
|
||||||
|
admin: resolve(__dirname, "admin.html"),
|
||||||
|
signup: resolve(__dirname, "signup.html"),
|
||||||
|
login: resolve(__dirname, "login.html"),
|
||||||
|
search: resolve(__dirname, "search.html"),
|
||||||
|
add: resolve(__dirname, "add.html"),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
24
lab4/.eslintrc.cjs
Normal file
24
lab4/.eslintrc.cjs
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
module.exports = {
|
||||||
|
root: true,
|
||||||
|
env: { browser: true, es2020: true },
|
||||||
|
extends: [
|
||||||
|
'airbnb-base',
|
||||||
|
'plugin:react/recommended',
|
||||||
|
'plugin:react/jsx-runtime',
|
||||||
|
'plugin:react-hooks/recommended',
|
||||||
|
],
|
||||||
|
ignorePatterns: ['dist', '.eslintrc.cjs'],
|
||||||
|
parserOptions: { ecmaVersion: 12, sourceType: 'module' },
|
||||||
|
settings: { react: { version: '18.2' } },
|
||||||
|
plugins: ['react-refresh'],
|
||||||
|
rules: {
|
||||||
|
'react-refresh/only-export-components': [
|
||||||
|
'warn',
|
||||||
|
{ allowConstantExport: true },
|
||||||
|
],
|
||||||
|
'indent': 'off',
|
||||||
|
'no-console': 'off',
|
||||||
|
'arrow-body-style': 'off',
|
||||||
|
'implicit-arrow-linebreak': 'off',
|
||||||
|
},
|
||||||
|
}
|
||||||
24
lab4/.gitignore
vendored
Normal file
24
lab4/.gitignore
vendored
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
|
||||||
|
node_modules
|
||||||
|
dist
|
||||||
|
dist-ssr
|
||||||
|
*.local
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.vscode/*
|
||||||
|
!.vscode/extensions.json
|
||||||
|
.idea
|
||||||
|
.DS_Store
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
||||||
29
lab4/README.md
Normal file
29
lab4/README.md
Normal file
@@ -0,0 +1,29 @@
|
|||||||
|
#### Окружение:
|
||||||
|
- nodejs 18;
|
||||||
|
- VSCode;
|
||||||
|
- ESLint плагин для VSCode;
|
||||||
|
- для отладки необходимы бразузеры Chrome или Edge.
|
||||||
|
|
||||||
|
#### Создание пустого проекта:
|
||||||
|
|
||||||
|
```commandline
|
||||||
|
npm create vite@latest ./ -- --template react
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Установка зависимостей:
|
||||||
|
|
||||||
|
```commandline
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Запуск проекта:
|
||||||
|
|
||||||
|
```commandline
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Сборка проекта:
|
||||||
|
|
||||||
|
```commandline
|
||||||
|
npm run build
|
||||||
|
```
|
||||||
15
lab4/index.html
Normal file
15
lab4/index.html
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
<html lang="ru">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>My shop</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="root" class="h-100 d-flex flex-column"></div>
|
||||||
|
<script type="module" src="/src/main.jsx"></script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
14
lab4/jsconfig.json
Normal file
14
lab4/jsconfig.json
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "Node",
|
||||||
|
"target": "ES2020",
|
||||||
|
"jsx": "react",
|
||||||
|
"strictNullChecks": true,
|
||||||
|
"strictFunctionTypes": true
|
||||||
|
},
|
||||||
|
"exclude": [
|
||||||
|
"node_modules",
|
||||||
|
"**/node_modules/*"
|
||||||
|
]
|
||||||
|
}
|
||||||
4344
lab4/package-lock.json
generated
Normal file
4344
lab4/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
32
lab4/package.json
Normal file
32
lab4/package.json
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
{
|
||||||
|
"name": "lec4",
|
||||||
|
"private": true,
|
||||||
|
"version": "0.0.0",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vite build",
|
||||||
|
"lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"react": "^18.2.0",
|
||||||
|
"react-dom": "^18.2.0",
|
||||||
|
"react-router-dom": "^6.18.0",
|
||||||
|
"bootstrap": "^5.3.2",
|
||||||
|
"react-bootstrap": "^2.9.1",
|
||||||
|
"react-bootstrap-icons": "^1.10.3",
|
||||||
|
"prop-types": "^15.8.1"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@types/react": "^18.2.15",
|
||||||
|
"@types/react-dom": "^18.2.7",
|
||||||
|
"@vitejs/plugin-react": "^4.0.3",
|
||||||
|
"eslint": "^8.45.0",
|
||||||
|
"eslint-config-airbnb-base": "^15.0.0",
|
||||||
|
"eslint-plugin-react": "^7.32.2",
|
||||||
|
"eslint-plugin-react-hooks": "^4.6.0",
|
||||||
|
"eslint-plugin-react-refresh": "^0.4.3",
|
||||||
|
"vite": "^4.4.5"
|
||||||
|
}
|
||||||
|
}
|
||||||
3
lab4/public/favicon.svg
Normal file
3
lab4/public/favicon.svg
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-cart2" viewBox="0 0 16 16">
|
||||||
|
<path d="M0 2.5A.5.5 0 0 1 .5 2H2a.5.5 0 0 1 .485.379L2.89 4H14.5a.5.5 0 0 1 .485.621l-1.5 6A.5.5 0 0 1 13 11H4a.5.5 0 0 1-.485-.379L1.61 3H.5a.5.5 0 0 1-.5-.5zM3.14 5l1.25 5h8.22l1.25-5H3.14zM5 13a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm-2 1a2 2 0 1 1 4 0 2 2 0 0 1-4 0zm9-1a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm-2 1a2 2 0 1 1 4 0 2 2 0 0 1-4 0z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 463 B |
0
lab4/src/App.css
Normal file
0
lab4/src/App.css
Normal file
19
lab4/src/App.jsx
Normal file
19
lab4/src/App.jsx
Normal file
@@ -0,0 +1,19 @@
|
|||||||
|
import { Container } from 'react-bootstrap';
|
||||||
|
import { Outlet } from 'react-router-dom';
|
||||||
|
import './App.css';
|
||||||
|
import Footer from './components/footer/Footer.jsx';
|
||||||
|
import Header from './components/header/Header.jsx';
|
||||||
|
|
||||||
|
const App = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Header></Header>
|
||||||
|
<Container className='p-0' as="main" fluid>
|
||||||
|
<Outlet />
|
||||||
|
</Container>
|
||||||
|
<Footer />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default App;
|
||||||
BIN
lab4/src/assets/banner1.png
Normal file
BIN
lab4/src/assets/banner1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 640 KiB |
BIN
lab4/src/assets/banner2.png
Normal file
BIN
lab4/src/assets/banner2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 812 KiB |
BIN
lab4/src/assets/banner3.png
Normal file
BIN
lab4/src/assets/banner3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 767 KiB |
BIN
lab4/src/assets/images/bro.jpg
Normal file
BIN
lab4/src/assets/images/bro.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 178 KiB |
BIN
lab4/src/assets/images/fire.jpg
Normal file
BIN
lab4/src/assets/images/fire.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 322 KiB |
BIN
lab4/src/assets/images/harry.jpg
Normal file
BIN
lab4/src/assets/images/harry.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 262 KiB |
BIN
lab4/src/assets/images/noimage.png
Normal file
BIN
lab4/src/assets/images/noimage.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
lab4/src/assets/images/nolan.jpg
Normal file
BIN
lab4/src/assets/images/nolan.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 169 KiB |
BIN
lab4/src/assets/logo.png
Normal file
BIN
lab4/src/assets/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
25
lab4/src/components/banner/Banner.css
Normal file
25
lab4/src/components/banner/Banner.css
Normal file
@@ -0,0 +1,25 @@
|
|||||||
|
#banner {
|
||||||
|
margin: 2px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#banner img {
|
||||||
|
border: 1px solid #3c3c3f;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#banner img.banner-show {
|
||||||
|
width: 100%;
|
||||||
|
opacity: 1;
|
||||||
|
transition: opacity 1s, visibility 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#banner img.banner-hide {
|
||||||
|
height: 0;
|
||||||
|
width: 0;
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
transition: opacity 1s, visibility 0s 1s;
|
||||||
|
}
|
||||||
40
lab4/src/components/banner/Banner.jsx
Normal file
40
lab4/src/components/banner/Banner.jsx
Normal file
@@ -0,0 +1,40 @@
|
|||||||
|
import { useEffect, useState } from 'react';
|
||||||
|
import banner1 from '../../assets/banner1.png';
|
||||||
|
import banner2 from '../../assets/banner2.png';
|
||||||
|
import banner3 from '../../assets/banner3.png';
|
||||||
|
import './Banner.css';
|
||||||
|
|
||||||
|
const Banner = () => {
|
||||||
|
const [currentBanner, setCurrentBanner] = useState(0);
|
||||||
|
const banners = [banner1, banner2, banner3];
|
||||||
|
|
||||||
|
const getBannerClass = (index) => {
|
||||||
|
return currentBanner === index ? 'banner-show' : 'banner-hide';
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const bannerInterval = setInterval(
|
||||||
|
() => {
|
||||||
|
console.info('Banner changed');
|
||||||
|
let current = currentBanner + 1;
|
||||||
|
if (current === banners.length) {
|
||||||
|
current = 0;
|
||||||
|
}
|
||||||
|
setCurrentBanner(current);
|
||||||
|
},
|
||||||
|
5000,
|
||||||
|
);
|
||||||
|
return () => clearInterval(bannerInterval);
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div id="banner" >
|
||||||
|
{
|
||||||
|
banners.map((banner, index) =>
|
||||||
|
<img key={index} className={getBannerClass(index)} src={banner} alt={`banner${index}`} />)
|
||||||
|
}
|
||||||
|
</div >
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Banner;
|
||||||
22
lab4/src/components/filmLogo/FilmLogo.jsx
Normal file
22
lab4/src/components/filmLogo/FilmLogo.jsx
Normal file
@@ -0,0 +1,22 @@
|
|||||||
|
import { Col, Image } from 'react-bootstrap';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
|
const FilmLogo = ({ logoName }) => {
|
||||||
|
const tempLogo = logoName ?? 'logo';
|
||||||
|
return (
|
||||||
|
<Col xs={12} sm={6} lg={3}
|
||||||
|
className="w-auto h-auto m-2"
|
||||||
|
>
|
||||||
|
<Link to="/selected">
|
||||||
|
<Image src={`src/assets/images/${tempLogo}.jpg`} fluid alt="" />
|
||||||
|
</Link>
|
||||||
|
</Col>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
FilmLogo.propTypes = {
|
||||||
|
logoName: PropTypes.string,
|
||||||
|
};
|
||||||
|
|
||||||
|
export default FilmLogo;
|
||||||
4
lab4/src/components/filmRow/FilmRow.css
Normal file
4
lab4/src/components/filmRow/FilmRow.css
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
.FilmLogoRow{
|
||||||
|
min-width: 300px;
|
||||||
|
min-height: 500px;
|
||||||
|
}
|
||||||
38
lab4/src/components/filmRow/FilmRow.jsx
Normal file
38
lab4/src/components/filmRow/FilmRow.jsx
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
import {
|
||||||
|
Row, Col, Button, Image,
|
||||||
|
} from 'react-bootstrap';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
|
||||||
|
const FilmRow = () => {
|
||||||
|
return (
|
||||||
|
<Row className="m-2 my-5 ">
|
||||||
|
<Col xs={12} lg={3}>
|
||||||
|
<Link to="/selected" className="">
|
||||||
|
<Image src="src/assets/images/fire.jpg" fluid alt="" className="FilmLogoRow"/>
|
||||||
|
</Link>
|
||||||
|
</Col>
|
||||||
|
<Col xs={12} lg={6} xl={8} className="d-flex flex-column p-0 justify-content-center">
|
||||||
|
<div className="d-flex p-1 ps-0 justify-content-center mw-100 mh-100 mx-4">
|
||||||
|
<p className="text-white fs-5 fw-normal font-family-Bayon text-center">
|
||||||
|
Фильм-катастрофа о подвиге небольшой бригады пожарных и спасателей,
|
||||||
|
которые борются с неистовой огненной стихией, уничтожающей всё на своем
|
||||||
|
пути. Герои работают в эпицентре лесного пожара и приходят на помощь
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="d-flex p-1 ps-0 pb-2 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<p className="text-center text-white fs-3 fw-normal font-family-Bayon">
|
||||||
|
Приключения, катастрофа, драма, боевик
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<Button className="d-flex btn btn-primary justify-content-center p-5 fs-4 m-3 align-items-center">
|
||||||
|
Перейти
|
||||||
|
</Button>
|
||||||
|
<Button className="d-flex btn btn-primary justify-content-center p-5 fs-4 m-3 align-items-center">
|
||||||
|
Смотреть позже
|
||||||
|
</Button>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default FilmRow;
|
||||||
3
lab4/src/components/footer/Footer.css
Normal file
3
lab4/src/components/footer/Footer.css
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
.bg-dark-blue{
|
||||||
|
background-color: #2B82CF;
|
||||||
|
}
|
||||||
13
lab4/src/components/footer/Footer.jsx
Normal file
13
lab4/src/components/footer/Footer.jsx
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
import './Footer.css';
|
||||||
|
|
||||||
|
const Footer = () => {
|
||||||
|
return (
|
||||||
|
<footer className="footer mt-auto fixed bottom-0 w-100">
|
||||||
|
<div className= "bg-dark-blue d-flex text-center justify-content-center">
|
||||||
|
<p className="text-black fs-5 fw-normal font-family-Average Sans">Фильмы нам не пренадлежат</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Footer;
|
||||||
3
lab4/src/components/genre/Genre.css
Normal file
3
lab4/src/components/genre/Genre.css
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
.bg-grey{
|
||||||
|
background-color: #D9D9D9;
|
||||||
|
}
|
||||||
23
lab4/src/components/genre/Genre.jsx
Normal file
23
lab4/src/components/genre/Genre.jsx
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
import { Col } from 'react-bootstrap';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import './Genre.css';
|
||||||
|
|
||||||
|
const Genre = ({ genreName }) => {
|
||||||
|
return (
|
||||||
|
<Col xs={12} sm={6} lg={3} xl={1} className="bg-grey rounded-3 text-center p-2 m-2">
|
||||||
|
<Link
|
||||||
|
className="text-decoration-none text-black fs-5 fw-normal font-family-Average Sans"
|
||||||
|
to="/search"
|
||||||
|
>
|
||||||
|
{genreName}
|
||||||
|
</Link>
|
||||||
|
</Col>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
Genre.propTypes = {
|
||||||
|
genreName: PropTypes.string,
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Genre;
|
||||||
10
lab4/src/components/header/Header.css
Normal file
10
lab4/src/components/header/Header.css
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
.bg-cyan{
|
||||||
|
background-color: #71B8F7;
|
||||||
|
}
|
||||||
|
.bg-grey{
|
||||||
|
background-color: #D9D9D9;
|
||||||
|
}
|
||||||
|
.bg-dark-blue{
|
||||||
|
background-color: #2B82CF;
|
||||||
|
}
|
||||||
|
|
||||||
43
lab4/src/components/header/Header.jsx
Normal file
43
lab4/src/components/header/Header.jsx
Normal file
@@ -0,0 +1,43 @@
|
|||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
import { Col, Row } from 'react-bootstrap';
|
||||||
|
import './Header.css';
|
||||||
|
|
||||||
|
const Header = () => {
|
||||||
|
return (
|
||||||
|
<header className="w-100 m-0 mb-3">
|
||||||
|
<div className="w-100">
|
||||||
|
<Row className="pt-lg-3 px-lg-5 p-0 justify-content-lg-between justify-content-center row w-100 m-0">
|
||||||
|
<Col lg={3} xl={2} className="col-0 bg-cyan gone">
|
||||||
|
</Col>
|
||||||
|
<Col xs className="d-flex p-1 pe-0 fs-2 bg-cyan mw-100 mh-100 text-break flex-grow-1 justify-content-center">
|
||||||
|
<Link to="/"
|
||||||
|
className="text-decoration-none text-center text-black fs-2 fw-normal font-family-Average Sans py-2"
|
||||||
|
href="index.html"
|
||||||
|
>
|
||||||
|
Онлайн-кинотеатр
|
||||||
|
</Link>
|
||||||
|
</Col>
|
||||||
|
<Col xs={12} sm={6} lg={3} xl={2} className="flex-column p-0 bg-cyan">
|
||||||
|
<div className="d-flex p-1 ps-0 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<Link
|
||||||
|
className="text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0"
|
||||||
|
to="/signup"
|
||||||
|
>
|
||||||
|
Регистрация
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
<div className="d-flex p-1 ps-0 pb-2 justify-content-center mw-100 mh-100 text-break">
|
||||||
|
<Link
|
||||||
|
className="text-decoration-none text-center text-black fs-5 fw-normal font-family-Average Sans m-0"
|
||||||
|
to="/login"
|
||||||
|
>
|
||||||
|
Вход
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default Header;
|
||||||
12
lab4/src/components/navigation/Navigation.css
Normal file
12
lab4/src/components/navigation/Navigation.css
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
.my-navbar {
|
||||||
|
background-color: #3c3c3c !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-navbar .link a:hover {
|
||||||
|
text-decoration: underline !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-navbar .logo {
|
||||||
|
width: 26px;
|
||||||
|
height: 26px;
|
||||||
|
}
|
||||||
41
lab4/src/components/navigation/Navigation.jsx
Normal file
41
lab4/src/components/navigation/Navigation.jsx
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import { Container, Nav, Navbar } from 'react-bootstrap';
|
||||||
|
import { Cart2 } from 'react-bootstrap-icons';
|
||||||
|
import { Link, useLocation } from 'react-router-dom';
|
||||||
|
import './Navigation.css';
|
||||||
|
|
||||||
|
const Navigation = ({ routes }) => {
|
||||||
|
const location = useLocation();
|
||||||
|
const indexPageLink = routes.filter((route) => route.index === false).shift();
|
||||||
|
const pages = routes.filter((route) => Object.prototype.hasOwnProperty.call(route, 'title'));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<header>
|
||||||
|
<Navbar expand='md' bg='dark' data-bs-theme='dark' className='my-navbar'>
|
||||||
|
<Container fluid>
|
||||||
|
<Navbar.Brand as={Link} to={indexPageLink?.path ?? '/'}>
|
||||||
|
<Cart2 className='d-inline-block align-top me-1 logo' />
|
||||||
|
My shop
|
||||||
|
</Navbar.Brand>
|
||||||
|
<Navbar.Toggle aria-controls='main-navbar' />
|
||||||
|
<Navbar.Collapse id='main-navbar'>
|
||||||
|
<Nav className='me-auto link' activeKey={location.pathname}>
|
||||||
|
{
|
||||||
|
pages.map((page) =>
|
||||||
|
<Nav.Link as={Link} key={page.path} eventKey={page.path} to={page.path ?? '/'}>
|
||||||
|
{page.title}
|
||||||
|
</Nav.Link>)
|
||||||
|
}
|
||||||
|
</Nav>
|
||||||
|
</Navbar.Collapse>
|
||||||
|
</Container>
|
||||||
|
</Navbar >
|
||||||
|
</header>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
Navigation.propTypes = {
|
||||||
|
routes: PropTypes.array,
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Navigation;
|
||||||
15
lab4/src/components/searchbar/SearchBar.css
Normal file
15
lab4/src/components/searchbar/SearchBar.css
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
.bg-grey{
|
||||||
|
background-color: #D9D9D9;
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
#dropdown-basic-button{
|
||||||
|
font-size: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.sotnya{
|
||||||
|
min-height: 100px;
|
||||||
|
|
||||||
|
}
|
||||||
|
#dropdown-basic-button{
|
||||||
|
height: 100% !important ;
|
||||||
|
}
|
||||||
38
lab4/src/components/searchbar/SearchBar.jsx
Normal file
38
lab4/src/components/searchbar/SearchBar.jsx
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
import {
|
||||||
|
Form, Row, Col, Dropdown, DropdownButton,
|
||||||
|
} from 'react-bootstrap';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
import './SearchBar.css';
|
||||||
|
|
||||||
|
const SearchBar = () => {
|
||||||
|
return (
|
||||||
|
<Row className="text-break w-100 mt-3 p-0 mb-2 align-items-center justify-content-center">
|
||||||
|
<Col lg={3} className=" text-break h-100 flex-grow-1">
|
||||||
|
<Form.Control
|
||||||
|
id="search-focus"
|
||||||
|
as="textarea"
|
||||||
|
className="ms-3 p-0 ms-lg-4"
|
||||||
|
placeholder="Введите название фильма"
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col sm={1} lg={2} xl={3} className=" w-auto mx-3 p-auto text-break h-100 d-flex align-items-center">
|
||||||
|
<DropdownButton id="dropdown-basic-button" title="Выберите жанр" className=" h-100">
|
||||||
|
<Dropdown.Item href="#">Ужасы</Dropdown.Item>
|
||||||
|
<Dropdown.Item href="#">Триллер</Dropdown.Item>
|
||||||
|
<Dropdown.Item href="#">Комедия</Dropdown.Item>
|
||||||
|
</DropdownButton>
|
||||||
|
</Col>
|
||||||
|
<Col sm={1} lg={3} xl={2} className="align-items-center justify-content-center">
|
||||||
|
<Link
|
||||||
|
className=" "
|
||||||
|
>
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="currentColor" className="bi bi-search" viewBox="0 0 20 20">
|
||||||
|
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
|
||||||
|
</svg>
|
||||||
|
</Link>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SearchBar;
|
||||||
32
lab4/src/index.css
Normal file
32
lab4/src/index.css
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
h1 {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-mw {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.btn-mw {
|
||||||
|
width: 30%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.btn-mw {
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background-color:#194F75;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
67
lab4/src/main.jsx
Normal file
67
lab4/src/main.jsx
Normal file
@@ -0,0 +1,67 @@
|
|||||||
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom/client';
|
||||||
|
import { RouterProvider, createBrowserRouter } from 'react-router-dom';
|
||||||
|
import App from './App.jsx';
|
||||||
|
import './index.css';
|
||||||
|
import ErrorPage from './pages/ErrorPage.jsx';
|
||||||
|
import Page1 from './pages/Page1.jsx';
|
||||||
|
import Signup from './pages/signup.jsx';
|
||||||
|
import Login from './pages/Login.jsx';
|
||||||
|
import Admin from './pages/Admin.jsx';
|
||||||
|
import PageEdit from './pages/PageEdit.jsx';
|
||||||
|
import Selected from './pages/Selected.jsx';
|
||||||
|
import Search from './pages/Search.jsx';
|
||||||
|
|
||||||
|
const routes = [
|
||||||
|
{
|
||||||
|
index: true,
|
||||||
|
path: '/',
|
||||||
|
element: <Page1 />,
|
||||||
|
title: 'Главная страница',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/signup',
|
||||||
|
element: <Signup />,
|
||||||
|
title: 'Вторая страница',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/login',
|
||||||
|
element: <Login />,
|
||||||
|
title: 'Третья страница',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/admin',
|
||||||
|
element: <Admin />,
|
||||||
|
title: 'Четвертая страница',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/add',
|
||||||
|
element: <PageEdit />,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/selected',
|
||||||
|
element: <Selected />,
|
||||||
|
title: 'Страница выбора',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/search',
|
||||||
|
element: <Search />,
|
||||||
|
title: 'Страница поиска',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const router = createBrowserRouter([
|
||||||
|
{
|
||||||
|
path: '/',
|
||||||
|
element: <App routes={routes} />,
|
||||||
|
children: routes,
|
||||||
|
errorElement: <ErrorPage />,
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
ReactDOM.createRoot(document.getElementById('root')).render(
|
||||||
|
<React.StrictMode>
|
||||||
|
<RouterProvider router={router} />
|
||||||
|
</React.StrictMode>,
|
||||||
|
);
|
||||||
23
lab4/src/pages/Admin.jsx
Normal file
23
lab4/src/pages/Admin.jsx
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
import { Button, Table } from 'react-bootstrap';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
|
||||||
|
const Admin = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Button as={Link} to="/add" variant="success">Добавить Фильм</Button>
|
||||||
|
<Table className="mt-2" striped>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th scope="col">#</th>
|
||||||
|
<th scope="col">Название</th>
|
||||||
|
<th scope="col">Редактировать</th>
|
||||||
|
<th scope="col">Удалить</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</Table>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Admin;
|
||||||
19
lab4/src/pages/ErrorPage.jsx
Normal file
19
lab4/src/pages/ErrorPage.jsx
Normal file
@@ -0,0 +1,19 @@
|
|||||||
|
import { Alert, Button, Container } from 'react-bootstrap';
|
||||||
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
|
||||||
|
const ErrorPage = () => {
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Container fluid className="p-2 row justify-content-center">
|
||||||
|
<Container className='col-md-6'>
|
||||||
|
<Alert variant="danger">
|
||||||
|
Страница не найдена
|
||||||
|
</Alert>
|
||||||
|
<Button className="w-25 mt-2" variant="primary" onClick={() => navigate(-1)}>Назад</Button>
|
||||||
|
</Container>
|
||||||
|
</Container>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ErrorPage;
|
||||||
34
lab4/src/pages/Login.jsx
Normal file
34
lab4/src/pages/Login.jsx
Normal file
@@ -0,0 +1,34 @@
|
|||||||
|
import { Form, Button } from 'react-bootstrap';
|
||||||
|
import { useState } from 'react';
|
||||||
|
|
||||||
|
const Login = () => {
|
||||||
|
const [validated, setValidated] = useState(false);
|
||||||
|
|
||||||
|
const handleSubmit = (event) => {
|
||||||
|
const form = event.currentTarget;
|
||||||
|
if (form.checkValidity() === false) {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
|
||||||
|
setValidated(true);
|
||||||
|
};
|
||||||
|
return (
|
||||||
|
<Form id="items-form" noValidate validated={validated} onSubmit={handleSubmit}>
|
||||||
|
<Form.Group className="mb-2">
|
||||||
|
<Form.Label className="form-label">Войдите</Form.Label>
|
||||||
|
<Form.Control type="text" name="name"
|
||||||
|
placeholder='Введите имя пользователя/email' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2">
|
||||||
|
<Form.Control type="text" name="password"
|
||||||
|
placeholder='Введите пароль' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="d-flex flex-md-row flex-column justify-content-center">
|
||||||
|
<Button className="btn-mw me-md-3" type="submit" variant="primary">Войти</Button>
|
||||||
|
</Form.Group>
|
||||||
|
</Form>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Login;
|
||||||
65
lab4/src/pages/Page1.jsx
Normal file
65
lab4/src/pages/Page1.jsx
Normal file
@@ -0,0 +1,65 @@
|
|||||||
|
import { Row, Container } from 'react-bootstrap';
|
||||||
|
import FilmLogo from '../components/filmLogo/FilmLogo.jsx';
|
||||||
|
import Genre from '../components/genre/Genre.jsx';
|
||||||
|
|
||||||
|
const Page1 = () => {
|
||||||
|
return (
|
||||||
|
<Container fluid className="flex-shrink-0 p-0">
|
||||||
|
<section className="d-flex align-items-center justify-content-center">
|
||||||
|
<div>
|
||||||
|
<Row className="justify-content-center pt-2">
|
||||||
|
<p className="text-center text-white fs-2 fw-normal font-family-Average Sans">
|
||||||
|
Популярные сейчас
|
||||||
|
</p>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section className="d-flex justify-content-evenly ">
|
||||||
|
<Row className="row p-2 m-2 align-items-center justify-content-center">
|
||||||
|
<FilmLogo logoName={'fire'}>
|
||||||
|
|
||||||
|
</FilmLogo>
|
||||||
|
<FilmLogo logoName={'harry'}>
|
||||||
|
|
||||||
|
</FilmLogo>
|
||||||
|
<FilmLogo logoName={'fire'}>
|
||||||
|
|
||||||
|
</FilmLogo>
|
||||||
|
<FilmLogo logoName={'fire'}>
|
||||||
|
|
||||||
|
</FilmLogo>
|
||||||
|
</Row>
|
||||||
|
</section>
|
||||||
|
<section className="d-flex justify-content-center">
|
||||||
|
<Row className="m-3 justify-content-evenly w-100 text-break">
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
<Genre genreName={'Ужасы'}>
|
||||||
|
|
||||||
|
</Genre>
|
||||||
|
</Row>
|
||||||
|
</section>
|
||||||
|
</Container>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Page1;
|
||||||
57
lab4/src/pages/PageEdit.jsx
Normal file
57
lab4/src/pages/PageEdit.jsx
Normal file
@@ -0,0 +1,57 @@
|
|||||||
|
import { useState } from 'react';
|
||||||
|
import { Button, Form } from 'react-bootstrap';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
|
||||||
|
const PageEdit = () => {
|
||||||
|
const [validated, setValidated] = useState(false);
|
||||||
|
|
||||||
|
const handleSubmit = (event) => {
|
||||||
|
const form = event.currentTarget;
|
||||||
|
if (form.checkValidity() === false) {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
|
||||||
|
setValidated(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="text-center">
|
||||||
|
<img id="image-preview" src="https://via.placeholder.com/200" className=""
|
||||||
|
alt="placeholder" />
|
||||||
|
</div>
|
||||||
|
<Form id="items-form" noValidate validated={validated} onSubmit={handleSubmit}>
|
||||||
|
<Form.Group className="mb-2" controlId="name">
|
||||||
|
<Form.Label htmlFor="desc" className="form-label">Описание</Form.Label>
|
||||||
|
<Form.Control as="textarea" name="name" rows={5}
|
||||||
|
placeholder='Описание' required/>
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2" controlId="email">
|
||||||
|
<Form.Label htmlFor="actrs" className="form-label">Актеры</Form.Label>
|
||||||
|
<Form.Control type="text" name="actrs"
|
||||||
|
placeholder='Актеры' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2" controlId="password">
|
||||||
|
<Form.Label htmlFor="genres" className="form-label">Жанры</Form.Label>
|
||||||
|
<Form.Control type="text" name="genres"
|
||||||
|
placeholder='Жанры' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2" controlId="file">
|
||||||
|
<Form.Label>Изображение</Form.Label>
|
||||||
|
<Form.Control type="file" name="image" accept="image/*" />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2" controlId="file">
|
||||||
|
<Form.Label>Файл</Form.Label>
|
||||||
|
<Form.Control type="file" name="file"/>
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="d-flex flex-md-row flex-column justify-content-center">
|
||||||
|
<Button className="btn-mw me-md-3 mb-md-0 mb-2" as={Link} to="/admin" variant="secondary">Назад</Button>
|
||||||
|
<Button className="btn-mw me-md-3" type="submit" variant="primary">Сохранить</Button>
|
||||||
|
</Form.Group>
|
||||||
|
</Form>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default PageEdit;
|
||||||
14
lab4/src/pages/Search.jsx
Normal file
14
lab4/src/pages/Search.jsx
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
import SearchBar from '../components/searchbar/SearchBar.jsx';
|
||||||
|
import FilmRow from '../components/filmRow/FilmRow.jsx';
|
||||||
|
|
||||||
|
const Search = () => {
|
||||||
|
return (
|
||||||
|
<div className="ms-4">
|
||||||
|
<SearchBar/>
|
||||||
|
<FilmRow/>
|
||||||
|
<FilmRow/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Search;
|
||||||
80
lab4/src/pages/Selected.jsx
Normal file
80
lab4/src/pages/Selected.jsx
Normal file
@@ -0,0 +1,80 @@
|
|||||||
|
import {
|
||||||
|
Row, Col, Image, Button,
|
||||||
|
} from 'react-bootstrap';
|
||||||
|
import image from '../assets/images/fire.jpg';
|
||||||
|
|
||||||
|
const Selected = () => {
|
||||||
|
return (
|
||||||
|
<div className=" w-100">
|
||||||
|
<Row className="p-2 justify-content-center mw-100">
|
||||||
|
<Col lg={6} md={12} className="align-items-center d-flex justify-content-center">
|
||||||
|
<Image
|
||||||
|
className=" w-auto h-auto ms-5"
|
||||||
|
src={image}
|
||||||
|
alt=""
|
||||||
|
fluid
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col lg={6} className="text-wrap px-2 d-flex justify-content-center mt-3">
|
||||||
|
<p className="text-white fs-3 fw-normal font-family-Bayon text-lg-start text-center">
|
||||||
|
Дата выхода: 2020
|
||||||
|
<br />
|
||||||
|
Режиссер:
|
||||||
|
<br />
|
||||||
|
Алексей Нужный
|
||||||
|
<br />В главных ролях:
|
||||||
|
<br />
|
||||||
|
Константин Хабенский, Иван Янковский, Стася Милославская...
|
||||||
|
<br />
|
||||||
|
Язык: Русский
|
||||||
|
</p>
|
||||||
|
</Col>
|
||||||
|
<Col sm={12} className="d-flex justify-content-center m-0 flex-column mt-5">
|
||||||
|
<div className="d-flex justify-content-center">
|
||||||
|
<h1 className="text-white fs-2 fw-normal font-family-Bayon">Огонь</h1>
|
||||||
|
</div>
|
||||||
|
<div className="d-flex text-wrap me-3">
|
||||||
|
<p
|
||||||
|
className="text-white fs-5 fw-normal font-family-Bayon text-lg-center mb-0 px-3 py-2"
|
||||||
|
>
|
||||||
|
Фильм-катастрофа о подвиге небольшой бригады пожарных и спасателей,
|
||||||
|
которые борются с неистовой огненной стихией, уничтожающей всё на
|
||||||
|
своем пути. Герои работают в эпицентре лесного пожара и приходят на
|
||||||
|
помощь жителям близлежащей деревни. Константин Хабенский, Иван
|
||||||
|
Янковский и Стася Милославская в зрелищном героическом блокбастере
|
||||||
|
от режиссера Алексея Нужного и создателей кинохитов «Движение
|
||||||
|
вверх», «Экипаж», «Легенда № 17».
|
||||||
|
<br />
|
||||||
|
Наступает тяжелый сезон разрушительных лесных пожаров. Борьба с ними
|
||||||
|
не на жизнь, а на смерть разворачивается возле маленького села
|
||||||
|
Ольхово в Карелии. На вызов прибыла бригада из шести пожарных во
|
||||||
|
главе с опытным инструктором Алексеем Павловичем Соколовым. У
|
||||||
|
каждого члена группы своя история: кто-то уже потерял в огне самых
|
||||||
|
близких, кого-то с беспокойством ждут дома. Есть среди них и новичок
|
||||||
|
– самоуверенный красавец Роман Ильин. Он ухаживает за дочкой
|
||||||
|
Соколова Катей, работающей на базе в диспетчерской. Вот только
|
||||||
|
отношения с самим Алексеем Павловичем у Ильина не задались – и это
|
||||||
|
мягко говоря. Конфликт нарастает перед лицом свирепого пожара,
|
||||||
|
угрожающего деревенским жителям, которых приходится эвакуировать в
|
||||||
|
экстремальных условиях.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row className="justify-content-center w-100">
|
||||||
|
<Col lg={3} md={6} xs={12} className="justify-content-center align-items-center d-flex">
|
||||||
|
<Button className="d-flex btn btn-primary justify-content-center p-5 fs-4 m-3 align-items-center">
|
||||||
|
Смотреть
|
||||||
|
</Button>
|
||||||
|
</Col>
|
||||||
|
<Col lg={3} md={6} xs={12} className="justify-content-center align-items-center d-flex">
|
||||||
|
<Button className="d-flex btn btn-primary justify-content-centerp-5 p-5 fs-5 m-3 align-items-center">
|
||||||
|
Добавить в избранное
|
||||||
|
</Button>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Selected;
|
||||||
42
lab4/src/pages/signup.jsx
Normal file
42
lab4/src/pages/signup.jsx
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
import { Form, Button } from 'react-bootstrap';
|
||||||
|
import { useState } from 'react';
|
||||||
|
|
||||||
|
const Signup = () => {
|
||||||
|
const [validated, setValidated] = useState(false);
|
||||||
|
|
||||||
|
const handleSubmit = (event) => {
|
||||||
|
const form = event.currentTarget;
|
||||||
|
if (form.checkValidity() === false) {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
|
||||||
|
setValidated(true);
|
||||||
|
};
|
||||||
|
return (
|
||||||
|
<Form id="items-form" noValidate validated={validated} onSubmit={handleSubmit}>
|
||||||
|
<Form.Group className="mb-2">
|
||||||
|
<Form.Label className="form-label">Зарегистрируйтесь</Form.Label>
|
||||||
|
<Form.Control type="text" name="name"
|
||||||
|
placeholder='Введите имя пользователя' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2">
|
||||||
|
<Form.Control type="text" name="email"
|
||||||
|
placeholder='Введите email' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2">
|
||||||
|
<Form.Control type="text" name="password"
|
||||||
|
placeholder='Введите пароль' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="mb-2">
|
||||||
|
<Form.Control type="text" name="repPassword"
|
||||||
|
placeholder='Повторите пароль' required />
|
||||||
|
</Form.Group>
|
||||||
|
<Form.Group className="d-flex flex-md-row flex-column justify-content-center">
|
||||||
|
<Button className="btn-mw me-md-3" type="submit" variant="primary">Зарегистрироваться</Button>
|
||||||
|
</Form.Group>
|
||||||
|
</Form>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Signup;
|
||||||
13
lab4/vite.config.js
Normal file
13
lab4/vite.config.js
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
/* eslint-disable import/no-extraneous-dependencies */
|
||||||
|
import react from '@vitejs/plugin-react';
|
||||||
|
import { defineConfig } from 'vite';
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [react()],
|
||||||
|
build: {
|
||||||
|
sourcemap: true,
|
||||||
|
chunkSizeWarningLimit: 1024,
|
||||||
|
emptyOutDir: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
BIN
lab4/Лаб4 отчет.docx
Normal file
BIN
lab4/Лаб4 отчет.docx
Normal file
Binary file not shown.
Reference in New Issue
Block a user