Лаб2
This commit is contained in:
parent
2c0b5a17a3
commit
afd15f9aba
BIN
Lab2/Dark Nights preview.jpg
Normal file
BIN
Lab2/Dark Nights preview.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
BIN
Lab2/Late Shift preview.jpg
Normal file
BIN
Lab2/Late Shift preview.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 91 KiB |
BIN
Lab2/Papers, Please preview.jpg
Normal file
BIN
Lab2/Papers, Please preview.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
BIN
Lab2/Song of Farca preview.jpg
Normal file
BIN
Lab2/Song of Farca preview.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
BIN
Lab2/Ten Dates preview.jpg
Normal file
BIN
Lab2/Ten Dates preview.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
69
Lab2/admin.html
Normal file
69
Lab2/admin.html
Normal file
@ -0,0 +1,69 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Steam</title>
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
|
||||
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.css" />
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="nav-link active" href="./index.html"> Главная </a>
|
||||
|
||||
|
||||
<!--КНОПКА С ТРЕМЯ ПОЛОСКАМИ ПРИ УМЕНЬШЕНИИ-->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
|
||||
<div class="navbar-nav">
|
||||
<a class="nav-link active" href="./basket.html">Корзина</a>
|
||||
<a class="nav-link active" href="./library.html">Библиотека</a>
|
||||
<a class="nav-link active" href="./entry.html">Вход</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="container-fluid p-2">
|
||||
<div class = "admin_panel mt-5">
|
||||
<div class="input-group mb-4">
|
||||
<span class="input-group-text span_admin_panel" id="basic-addon1">Название:</span>
|
||||
<input type="text" class="form-control" placeholder="Название" aria-label="Username" aria-describedby="name_of_adding_game">
|
||||
</div>
|
||||
<div class="input-group mb-4">
|
||||
<span class="input-group-text span_admin_panel">Описание игры:</span>
|
||||
<textarea class="form-control" aria-label="description_of_adding_game"></textarea>
|
||||
</div>
|
||||
<div class="input-group mb-4">
|
||||
<span class="input-group-text span_admin_panel" id="basic-addon1">Цена:</span>
|
||||
<input type="number" class="form-control" placeholder="Цена" aria-label="Username" aria-describedby="price_of_adding_game">
|
||||
</div>
|
||||
<div class="input-group mb-4">
|
||||
<span class="input-group-text span_admin_panel" id="basic-addon1">Фото:</span>
|
||||
<input type="image" class="form-control" placeholder="Цена" aria-label="Username" aria-describedby="price_of_adding_game">
|
||||
</div>
|
||||
<div class = "d-flex justify-content-center">
|
||||
<button class = "btn_admin_panel" onclick="window.location.href = './index.html';"> Подтвердить </button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
96
Lab2/basket.html
Normal file
96
Lab2/basket.html
Normal file
@ -0,0 +1,96 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Steam</title>
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
|
||||
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.css" />
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="nav-link" href="./index.html"> Главная </a>
|
||||
|
||||
<!--КНОПКА С ТРЕМЯ ПОЛОСКАМИ ПРИ УМЕНЬШЕНИИ-->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
|
||||
<div class="navbar-nav">
|
||||
<a class="nav-link active" href="./basket.html">Корзина</a>
|
||||
<a class="nav-link active" href="./library.html">Библиотека</a>
|
||||
<a class="nav-link active" href="./entry.html">Вход</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="container-fluid p-2">
|
||||
<table class="table table-bordered align-middle">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class = "p-0 cell1_basket">
|
||||
<img src="Dark Nights preview.jpg" alt="Dark Nights with Poe & Munro" class="img-fluid">
|
||||
</td>
|
||||
<td class = "p-0 cell2_basket">
|
||||
<p class = "basket_name_of_game">Dark Nights with Poe and Munro</p>
|
||||
|
||||
</td>
|
||||
<td class = "p-0 text-center align-middle cell3_basket">
|
||||
|
||||
<p class = "price_of_game_main_page"> 299 руб.</p>
|
||||
</td>
|
||||
<td class = "p-0 text-center align-middle">
|
||||
<button class = "basket_delete_button"> X </button>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td class = "p-0 cell1_basket">
|
||||
<img src="Ten Dates preview.jpg" alt="Ten Dates" class="img-fluid">
|
||||
</td>
|
||||
<td class = "p-0 text-center align-middle cell2_basket">
|
||||
<p class = "basket_name_of_game">Ten Dates</p>
|
||||
|
||||
</td>
|
||||
<td class = "p-0 text-center align-middle cell3_basket">
|
||||
<p class = "price_of_game_main_page"> 509 руб.</p>
|
||||
</td>
|
||||
<td class = "p-0 text-center align-middle">
|
||||
<button class = "basket_delete_button"> X </button>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td colspan="2" class = "align-left">
|
||||
<p class = "basket_price_of_games"> Итого: 808 руб.</p>
|
||||
</td>
|
||||
<td colspan="2" class = "align-right">
|
||||
<button class = "basket_buy_button">КУПИТЬ</button>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
</tfoot>
|
||||
|
||||
</table>
|
||||
</main>
|
||||
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Сайт Чернышева Георгия, ПИбд-22
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
78
Lab2/create_account.html
Normal file
78
Lab2/create_account.html
Normal file
@ -0,0 +1,78 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Steam</title>
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
|
||||
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.css" />
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="nav-link active" href="./index.html"> Главная </a>
|
||||
|
||||
<!--КНОПКА С ТРЕМЯ ПОЛОСКАМИ ПРИ УМЕНЬШЕНИИ-->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
|
||||
<div class="navbar-nav">
|
||||
<a class="nav-link active" href="./basket.html">Корзина</a>
|
||||
<a class="nav-link active" href="./library.html">Библиотека</a>
|
||||
<a class="nav-link active" href="./entry.html">Вход</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="container-fluid">
|
||||
<div class="row align-items-center justify-content-center mb-2 mt-20vh">
|
||||
<div class="col-auto justify-content-left">
|
||||
<label for="inputMail" class="account_text" id = "label_nickname">ВВЕДИТЕ ПОЧТУ:</label>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center justify-content-center mb-2">
|
||||
<div class="col-auto justify-content-left">
|
||||
<label for="inputMail" class="account_text" id = "label_nickname">ВВЕДИТЕ НИК:</label>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<input type="text" class="form-control" aria-label="Username" id = "inputMail">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center justify-content-center mb-2">
|
||||
<div class="col-auto">
|
||||
<label for="inputPassword6" class="account_text">ВВЕДИТЕ ПАРОЛЬ:</label>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<input type="password" id="inputPassword6" class="form-control" aria-describedby="passwordHelpInline">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col-auto mt-3">
|
||||
<button class = "account_btn"> СОЗДАТЬ </button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
<a class = "account_text" href = "entry.html">ВОЙТИ В АККАУНТ</a>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
67
Lab2/dark_nights_page.html
Normal file
67
Lab2/dark_nights_page.html
Normal file
@ -0,0 +1,67 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Steam</title>
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
|
||||
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.css" />
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="nav-link active" href="./index.html"> Главная </a>
|
||||
|
||||
<!--КНОПКА С ТРЕМЯ ПОЛОСКАМИ ПРИ УМЕНЬШЕНИИ-->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
|
||||
<div class="navbar-nav">
|
||||
<a class="nav-link active" href="./basket.html">Корзина</a>
|
||||
<a class="nav-link active" href="./library.html">Библиотека</a>
|
||||
<a class="nav-link active" href="./entry.html">Вход</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="container-fluid p-2">
|
||||
<!-- ВЕРХНИЙ DIV -->
|
||||
<div class = "row info_about_game_pic_and_name">
|
||||
<div class = "col-sm-5">
|
||||
<img src="Dark Nights preview.jpg" alt="Dark Nights with Poe & Munro" class="img-fluid">
|
||||
</div>
|
||||
<div class = "col-sm-7" align = "center">
|
||||
<p class = "info_about_game_name">Dark Nights with Poe and Munro</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class = "row">
|
||||
<div class = "col-sm 12">
|
||||
<p class = "info_about_game_text">Проведите местных радиоведущих По и Манро через шесть похожих на короткометражки эпизодов сверъестественной странности и обжигающего сюжета. От создателей The Infectious Madness of Doctor Dekker и The Shapeshifting Detective.</p>
|
||||
|
||||
</div>
|
||||
<div align = "center" class = "info_about_game_div_button">
|
||||
<button class = "info_about_game_add_to_basket_button"> Добавить в корзину </button>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Сайт Чернышева Георгия, ПИбд-22
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
68
Lab2/entry.html
Normal file
68
Lab2/entry.html
Normal file
@ -0,0 +1,68 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Steam</title>
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
|
||||
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.css" />
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="nav-link active" href="./index.html"> Главная </a>
|
||||
|
||||
<!--КНОПКА С ТРЕМЯ ПОЛОСКАМИ ПРИ УМЕНЬШЕНИИ-->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
|
||||
<div class="navbar-nav">
|
||||
<a class="nav-link active" href="./basket.html">Корзина</a>
|
||||
<a class="nav-link active" href="./library.html">Библиотека</a>
|
||||
<a class="nav-link active" href="./entry.html">Вход</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
|
||||
<main class = "container-fluid">
|
||||
<div class="row align-items-center justify-content-center mb-2 mt-25vh">
|
||||
<div class="col-auto">
|
||||
<label for="inputMail" class="account_text" id = "label_nickname">ВВЕДИТЕ НИК:</label>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center justify-content-center mb-2">
|
||||
<div class="col-auto">
|
||||
<label for="inputMail" class="account_text" id = "label_nickname">ВВЕДИТЕ ПАРОЛЬ:</label>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<input type="text" class="form-control" aria-label="Username" id = "inputMail">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col-auto mt-3">
|
||||
<button class = "account_btn"> ВОЙТИ </button>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
<a class = "account_text" href = "create_account.html">СОЗДАТЬ АККАУНТ</a>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
133
Lab2/index.html
Normal file
133
Lab2/index.html
Normal file
@ -0,0 +1,133 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Steam</title>
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
|
||||
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.css" />
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="nav-link active main_link" href="./index.html"> Главная </a>
|
||||
|
||||
<!--КНОПКА С ТРЕМЯ ПОЛОСКАМИ ПРИ УМЕНЬШЕНИИ-->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<div class="collapse navbar-collapse justify-content-end" id="navbarNav">
|
||||
<div class="navbar-nav">
|
||||
<a class="nav-link" href="./basket.html">Корзина</a>
|
||||
<a class="nav-link" href="./library.html">Библиотека</a>
|
||||
<a class="nav-link" href="./entry.html">Вход</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
|
||||
<main class="container-fluid p-2">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" placeholder="Название игры" aria-label="Recipient's username" aria-describedby="button_search">
|
||||
<button class="btn btn_searching" type="button" id="button_search">Поиск</button>
|
||||
</div>
|
||||
|
||||
<div class="d-flex flex-row-reverse">
|
||||
<div class="pt-2">
|
||||
<button class="btn_adding_game" onclick="window.location.href = './admin.html';">+</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="table table-borderless table_of_main_page">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_main_page">
|
||||
<img src="Dark Nights preview.jpg" alt="Dark Nights with Poe & Munro" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_main_page">
|
||||
<a class="nav-link active name_of_game_main_page" href="./dark_nights_page.html">Dark Nights with Poe and Munro</a>
|
||||
<p class = "price_of_game_main_page"> 299 руб.</p>
|
||||
|
||||
</td>
|
||||
<td class = "align-middle p-0">
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> изменить </button>
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> удалить </button>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_main_page" >
|
||||
<img src="Late Shift preview.jpg" alt="Late Shift" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_main_page" >
|
||||
<a class = "nav-link active name_of_game_main_page" href="./dark_nights_page.html">Late Shift</a>
|
||||
<p class = "price_of_game_main_page"> 399 руб.</p>
|
||||
</td>
|
||||
<td class = "align-middle p-0">
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> изменить </button>
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> удалить </button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_main_page">
|
||||
<img src="Ten Dates preview.jpg" alt="Ten Dates" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_main_page">
|
||||
<a class = "nav-link active name_of_game_main_page" href="./dark_nights_page.html">Ten Dates</a>
|
||||
<p class = "price_of_game_main_page"> 590 руб.</p>
|
||||
</td>
|
||||
<td class = "align-middle p-0">
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> изменить </button>
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> удалить </button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_main_page">
|
||||
<img src="Ten Dates preview.jpg" alt="Ten Dates" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_main_page">
|
||||
<a class = "nav-link active name_of_game_main_page" href="./dark_nights_page.html">Ten Dates</a>
|
||||
<p class = "price_of_game_main_page"> 590 руб.</p>
|
||||
</td>
|
||||
<td class = "align-middle p-0">
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> изменить </button>
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> удалить </button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_main_page">
|
||||
<img src="Ten Dates preview.jpg" alt="Ten Dates" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_main_page">
|
||||
<a class = "nav-link active name_of_game_main_page" href="./dark_nights_page.html">Ten Dates</a>
|
||||
<p class = "price_of_game_main_page"> 590 руб.</p>
|
||||
</td>
|
||||
<td class = "align-middle p-0">
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> изменить </button>
|
||||
<button class = "btn_for_game_main_page" onclick="window.location.href = './admin.html';"> удалить </button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</main>
|
||||
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Сайт Чернышева Георгия, ПИбд-22
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
120
Lab2/library.html
Normal file
120
Lab2/library.html
Normal file
@ -0,0 +1,120 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Steam</title>
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
|
||||
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.css" />
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="nav-link active" href="./index.html"> Главная </a>
|
||||
|
||||
<!--КНОПКА С ТРЕМЯ ПОЛОСКАМИ ПРИ УМЕНЬШЕНИИ-->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
|
||||
<div class="navbar-nav">
|
||||
<a class="nav-link active" href="./basket.html">Корзина</a>
|
||||
<a class="nav-link active" href="./library.html">Библиотека</a>
|
||||
<a class="nav-link active" href="./entry.html">Вход</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="container-fluid p-2">
|
||||
<table class="table table-bordered table_of_library">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_library">
|
||||
<img src="Dark Nights preview.jpg" alt="Dark Nights with Poe & Munro" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_library">
|
||||
<a class = "nav-link library_name_of_game" href="./dark_nights_page.html">Dark Nights with Poe and Munro</a>
|
||||
</td>
|
||||
<td class = "align-middle text-center p-0">
|
||||
<select>
|
||||
<option disabled selected>ИГРА</option>
|
||||
<option>Играть</option>
|
||||
<option>Установить</option>
|
||||
<option>Удалить</option>
|
||||
</select>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_library" >
|
||||
<img src="Song of Farca preview.jpg" alt="Song of Farca" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_library" >
|
||||
<a class = "nav-link library_name_of_game" href="./dark_nights_page.html">Song of Farca</a>
|
||||
</td>
|
||||
<td class = "align-middle text-center p-0">
|
||||
<select>
|
||||
<option disabled selected>ИГРА</option>
|
||||
<option>Играть</option>
|
||||
<option>Установить</option>
|
||||
<option>Удалить</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_library">
|
||||
<img src="Papers, Please preview.jpg" alt="Papers, Please" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_library">
|
||||
<a class = "nav-link library_name_of_game" href="./dark_nights_page.html"> Papers, Please </a>
|
||||
</td>
|
||||
<td class = "align-middle text-center p-0">
|
||||
<select>
|
||||
<option disabled selected>ИГРА</option>
|
||||
<option>Играть</option>
|
||||
<option>Установить</option>
|
||||
<option>Удалить</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class = "align-middle p-0 cell1_library">
|
||||
<img src="Ten Dates preview.jpg" alt="Ten Dates" class="img-fluid">
|
||||
</td>
|
||||
<td class = "align-middle p-0 cell2_library">
|
||||
<a class = "nav-link library_name_of_game" href="./dark_nights_page.html">Ten Dates</a>
|
||||
</td>
|
||||
<td class = "align-middle text-center p-0">
|
||||
<select>
|
||||
<option disabled selected>ИГРА</option>
|
||||
<option>Играть</option>
|
||||
<option>Установить</option>
|
||||
<option>Удалить</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</main>
|
||||
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Сайт Чернышева Георгия, ПИбд-22
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
2240
Lab2/package-lock.json
generated
Normal file
2240
Lab2/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
20
Lab2/package.json
Normal file
20
Lab2/package.json
Normal file
@ -0,0 +1,20 @@
|
||||
{
|
||||
"name": "lab2",
|
||||
"version": "1.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"start": "vite",
|
||||
"serve": "http-server -p 3000 ./dist/",
|
||||
"build": "vite build",
|
||||
"prod": "npm-run-all build serve"
|
||||
},
|
||||
"dependencies": {
|
||||
"bootstrap": "5.2.1",
|
||||
"@fortawesome/fontawesome-free": "6.2.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"http-server": "14.1.1",
|
||||
"vite": "4.4.9",
|
||||
"npm-run-all": "4.1.5"
|
||||
}
|
||||
}
|
||||
287
Lab2/style.css
Normal file
287
Lab2/style.css
Normal file
@ -0,0 +1,287 @@
|
||||
html {
|
||||
position: relative;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #2e4150;
|
||||
margin-bottom: 70px; /*Равно высоте подвала*/
|
||||
}
|
||||
main {
|
||||
height: 100% !important;
|
||||
}
|
||||
select {
|
||||
background-color: #385a80;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: 2.5vw;
|
||||
border: none;
|
||||
border-radius: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
select option {
|
||||
background-color: #385a80;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: auto;
|
||||
border-radius: 2px;
|
||||
width: 100%;
|
||||
}
|
||||
nav {
|
||||
font-family: sans-serif;
|
||||
background-color:#385a80 !important;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
footer {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background-color: #385a80;
|
||||
height: 70px;
|
||||
max-height: 100px;
|
||||
width: 100%;
|
||||
font-family: sans-serif;
|
||||
color:white;
|
||||
font-size: calc(2vw + 8px) !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
.navbar > div > a {
|
||||
font-size: calc(18px + 2vw) !important;
|
||||
}
|
||||
.navbar-nav > a {
|
||||
font-family: sans-serif;
|
||||
color: white;
|
||||
font-size: calc(12px + 2vw);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.container-fluid > a {
|
||||
font-family: sans-serif;
|
||||
color: white;
|
||||
font-size: 32px;
|
||||
font-weight: 600;
|
||||
}
|
||||
/* ГЛАВНАЯ СТРАНИЦА */
|
||||
.btn_for_game_main_page {
|
||||
border: none;
|
||||
size: 0.5rem;
|
||||
background-color: #385a80 !important;
|
||||
color: white;
|
||||
font-size: calc(1vh + 0.5vw) !important;
|
||||
margin-right: 1rem;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.name_of_game_main_page {
|
||||
color: white;
|
||||
font-size: 3vw !important;
|
||||
margin-left: 1vw !important;
|
||||
}
|
||||
|
||||
.price_of_game_main_page {
|
||||
color: white;
|
||||
font-size: 2.7vw !important;
|
||||
margin-left: 1vw !important;
|
||||
font-weight: 600 !important;
|
||||
margin-bottom: 0;
|
||||
margin-top: -3px;
|
||||
}
|
||||
.table_of_main_page {
|
||||
border-collapse: separate;
|
||||
}
|
||||
@media (max-width: 420px) {
|
||||
.table_of_main_page {
|
||||
border-spacing: 0 0;
|
||||
}
|
||||
}
|
||||
@media (min-width: 420px) {
|
||||
.table_of_main_page {
|
||||
border-spacing: 0 0.5vw;
|
||||
}
|
||||
}
|
||||
.cell1_main_page {
|
||||
width: 20% !important;
|
||||
}
|
||||
.cell2_main_page {
|
||||
width: 60% !important;
|
||||
}
|
||||
|
||||
main > .container-fluid {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.btn_searching {
|
||||
background-color: #385a80 !important;
|
||||
color: white !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
.searching_input {
|
||||
size: 2vw !important;
|
||||
}
|
||||
|
||||
.btn_adding_game {
|
||||
background-color: #385a80 !important;
|
||||
color: white !important;
|
||||
font-weight: bold !important;
|
||||
border: none !important;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
/* СТРАНИЦА С ОПИСАНИЕМ ИГРЫ */
|
||||
|
||||
.info_about_game_pic_and_name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40% !important;
|
||||
}
|
||||
|
||||
.info_about_game_name {
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
align-items: center !important;
|
||||
font-size: calc(3vw + 2vh) !important;
|
||||
}
|
||||
|
||||
.info_about_game_text {
|
||||
color: white;
|
||||
align-items: center !important;
|
||||
font-size: calc(2vw + 2vh) !important;
|
||||
}
|
||||
|
||||
.info_about_game_add_to_basket_button {
|
||||
background-color: #385a80;
|
||||
color: white;
|
||||
font-family: sans-serif;
|
||||
font-size: calc(2.5vw + 1.5vh);
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.info_about_game_div_button {
|
||||
border: 1px white;
|
||||
align-items: center !important;
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* СТРАНИЦЫ АККАУНТА */
|
||||
.account_text {
|
||||
font-family: sans-serif;
|
||||
color: white;
|
||||
font-size: calc(2.5vw + 1.5vh);
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.account_btn {
|
||||
background-color:#385a80;
|
||||
color: white;
|
||||
font-family: sans-serif;
|
||||
font-size: calc(2.5vw + 1.5vh);
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
font-weight: 500;
|
||||
|
||||
}
|
||||
.mt-25vh {
|
||||
margin-top: 25vh;
|
||||
}
|
||||
.mt-20vh {
|
||||
margin-top: 20vh;
|
||||
}
|
||||
|
||||
/* БИБЛИОТЕКА */
|
||||
.library_name_of_game {
|
||||
color: white;
|
||||
font-size: calc(3vw + 0.5vh);
|
||||
font-weight: 600;
|
||||
margin-left: 0.5vw;
|
||||
}
|
||||
.table_of_library {
|
||||
border-collapse: separate;
|
||||
border-spacing: 0 0.5vw;
|
||||
}
|
||||
.cell1_library {
|
||||
width: 20%;
|
||||
}
|
||||
.cell2_library {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
|
||||
/* КОРЗИНА */
|
||||
.basket_name_of_game {
|
||||
color: white;
|
||||
font-family: sans-serif;
|
||||
font-size: 3vw;
|
||||
font-size: auto;
|
||||
margin: 0;
|
||||
}
|
||||
.basket_price_of_games{
|
||||
color: white;
|
||||
font-size: 3vw;
|
||||
margin-bottom: auto;
|
||||
font-weight: 600;
|
||||
}
|
||||
.basket_delete_button {
|
||||
font-family: sans-serif;
|
||||
border: none !important;
|
||||
background: none !important;
|
||||
color: white !important;
|
||||
font-size: 3vw !important;
|
||||
}
|
||||
.basket_buy_button {
|
||||
background-color: #385a80;
|
||||
color: white;
|
||||
font-family: sans-serif;
|
||||
font-size: 3vw;
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.cell1_basket {
|
||||
width: 20% !important;
|
||||
}
|
||||
.cell2_basket {
|
||||
width: 50% !important;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
.cell3_basket {
|
||||
width: 20% !important;
|
||||
}
|
||||
tfoot {
|
||||
/* border-color: #2e4150; */
|
||||
}
|
||||
|
||||
/* СТРАНИЦА АДМИНА */
|
||||
.admin_panel {
|
||||
margin-left: 20%;
|
||||
margin-right: 20%;
|
||||
}
|
||||
|
||||
.span_admin_panel {
|
||||
background-color: #385a80 !important;
|
||||
color: white !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@media (min-width: 600px) {
|
||||
.span_admin_panel {
|
||||
font-size: 1.5vw;
|
||||
}
|
||||
}
|
||||
@media (max-width: 600px) {
|
||||
.span_admin_panel {
|
||||
font-size: 3vw;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.btn_admin_panel {
|
||||
border: none;
|
||||
background-color: #385a80 !important;
|
||||
color: white;
|
||||
font-size: calc(1.5vh + 1vw) !important;
|
||||
border-radius: 3px;
|
||||
}
|
||||
18
Lab2/vite.config.js
Normal file
18
Lab2/vite.config.js
Normal file
@ -0,0 +1,18 @@
|
||||
import { resolve } from 'path'
|
||||
import { defineConfig } from 'vite'
|
||||
|
||||
export default defineConfig({
|
||||
build: {
|
||||
rollupOptions: {
|
||||
input: {
|
||||
main: resolve(__dirname, 'index.html'),
|
||||
page2: resolve(__dirname, 'basket.html'),
|
||||
page3: resolve(__dirname, 'library.html'),
|
||||
page4: resolve(__dirname, 'entry.html'),
|
||||
page5: resolve(__dirname, 'create_account.html'),
|
||||
page6: resolve(__dirname, 'dark_nights_page.html'),
|
||||
page7: resolve(__dirname, 'admin.html')
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user