labs123
This commit is contained in:
parent
e2ad337348
commit
2e3f6cc4ab
BIN
lab1/lab1 IP.docx
Normal file
BIN
lab1/lab1 IP.docx
Normal file
Binary file not shown.
BIN
lab2/StreamerCircle.jpg
Normal file
BIN
lab2/StreamerCircle.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 41 KiB |
12
lab2/_media.css
Normal file
12
lab2/_media.css
Normal file
@ -0,0 +1,12 @@
|
||||
.media {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: start;
|
||||
-ms-flex-align: start;
|
||||
align-items: flex-start; }
|
||||
|
||||
.media-body {
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1; }
|
||||
19
lab2/data.json
Normal file
19
lab2/data.json
Normal file
@ -0,0 +1,19 @@
|
||||
{
|
||||
"posts": [
|
||||
{
|
||||
"id": 1,
|
||||
"title": "json-server",
|
||||
"author": "typicode"
|
||||
}
|
||||
],
|
||||
"comments": [
|
||||
{
|
||||
"id": 1,
|
||||
"body": "some comment",
|
||||
"postId": 1
|
||||
}
|
||||
],
|
||||
"profile": {
|
||||
"name": "typicode"
|
||||
}
|
||||
}
|
||||
190
lab2/index.html
Normal file
190
lab2/index.html
Normal file
@ -0,0 +1,190 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Streaming service</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||
<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="h-100 d-flex flex-column"-->
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<i class="fa-solid fa-microchip"></i>
|
||||
Streaming service
|
||||
</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="./page1.html">Главная страница</a>
|
||||
<a class="nav-link" href="./page2.html">Поиск</a>
|
||||
<a class="nav-link" href="./page3.html">Подписки</a>
|
||||
<a class="nav-link" href="./page4.html">Вход/Регистрация</a>
|
||||
</div>
|
||||
<form class="col-12 col-md-auto mb-2 mb-md-0 me-md-3" role="search" action="./page2.html" method="get">
|
||||
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="container-fluid ">
|
||||
<div class="row">
|
||||
|
||||
<nav class="col-md-2 bg-dark sidebar">
|
||||
<div class="d-flex flex-column align-items-center align-items-sm-start px-8 pt-3 text-white">
|
||||
<h2>Стримеры онлайн</h2>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Streamer1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Straaaa2</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1702</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page6admin.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">admin</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">902</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
|
||||
<div class="full-page-div">
|
||||
<div class="p-5 text-center">
|
||||
<h1 class="display-4 fw-bold">Welcome to our streaming service</h1>
|
||||
<p class="fs-5">Explore the whole streaming world!</p>
|
||||
<a class="btn btn-outline-danger btn-lg" href="page1.html" role="button">Главная страница</a>
|
||||
</div>
|
||||
|
||||
<div class="p-5 text-bg-dark rounded-3">
|
||||
<h2>Популярные трансляции</h2>
|
||||
<div class="row">
|
||||
<!-- Video Recommendation 1 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer1</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">CS-3</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Video Recommendation 2 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer2</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA0</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Video Recommendation 3 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer3</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA4</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Video Recommendation 4 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer4</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA3</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../assets/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="sidebars.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
BIN
lab2/kai.png
Normal file
BIN
lab2/kai.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 986 KiB |
BIN
lab2/kai2.png
Normal file
BIN
lab2/kai2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 178 KiB |
BIN
lab2/lab2 IP.docx
Normal file
BIN
lab2/lab2 IP.docx
Normal file
Binary file not shown.
BIN
lab2/logo.jpg
Normal file
BIN
lab2/logo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
BIN
lab2/logo.png
Normal file
BIN
lab2/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
4627
lab2/package-lock.json
generated
Normal file
4627
lab2/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
27
lab2/package.json
Normal file
27
lab2/package.json
Normal file
@ -0,0 +1,27 @@
|
||||
|
||||
{
|
||||
"name": "int-prog",
|
||||
"version": "1.0.0",
|
||||
"type": "module",
|
||||
"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"
|
||||
},
|
||||
"dependencies": {
|
||||
"bootstrap": "5.3.2",
|
||||
"@fortawesome/fontawesome-free": "6.4.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"vite": "4.4.9",
|
||||
"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"
|
||||
}
|
||||
}
|
||||
247
lab2/page1.html
Normal file
247
lab2/page1.html
Normal file
@ -0,0 +1,247 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Моя страница</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||
<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">
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<i class="fa-solid fa-microchip"></i>
|
||||
Streaming service
|
||||
</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 active" href="./page1.html">Главная страница</a>
|
||||
<a class="nav-link" href="./page2.html">Поиск</a>
|
||||
<a class="nav-link" href="./page3.html">Подписки</a>
|
||||
<a class="nav-link" href="./page4.html">Вход/Регистрация</a>
|
||||
</div>
|
||||
<form class="col-12 col-md-auto mb-2 mb-md-0 me-md-3" role="search" action="./page2.html" method="get">
|
||||
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="container-fluid container-main">
|
||||
<div class="row">
|
||||
<nav class="col-md-2 d-none d-md-block bg-dark sidebar">
|
||||
<div class="d-flex flex-column align-items-center align-items-sm-start px-8 pt-3 text-white min-vh-100">
|
||||
<h2>Стримеры онлайн</h2>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Streamer1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Straaaa2</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1702</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page6admin.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">admin</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">902</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
|
||||
<hr class="featurette-divider">
|
||||
<h1 class="display-4 fs-2 fw-bold">Для вас</h1>
|
||||
<hr class="featurette-divider">
|
||||
<div class="row mt-4">
|
||||
<!-- Video Recommendation 1 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer1</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">CS-3</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Video Recommendation 2 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer2</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA0</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Video Recommendation 3 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer3</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA4</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="featurette-divider">
|
||||
<h1 class="display-4 fs-2 fw-bold">Самые популярные</h1>
|
||||
<hr class="featurette-divider">
|
||||
<!-- Video Recommendation 4 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer4</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA5</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Video Recommendation 5 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer5</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA9</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Video Recommendation 6 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer6</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA6</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="featurette-divider">
|
||||
<h1 class="display-4 fs-2 fw-bold">Каналы, которые могут вам понравиться</h1>
|
||||
<hr class="featurette-divider">
|
||||
<!-- Video Recommendation 7 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<img src="kai.png" class="card-img-top" alt="Video 2">
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p class="h-4 m-0 text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer7</p>
|
||||
<p class="fs-5 text-nowrap text-secondary">DOTA7</p>
|
||||
</div>
|
||||
<div class="col-md-6 p-3 text-nowrap align-items-end d-flex">
|
||||
<a class="btn btn-secondary ms-auto" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../assets/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="sidebars.js"></script>
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
215
lab2/page2.html
Normal file
215
lab2/page2.html
Normal file
@ -0,0 +1,215 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Моя страница</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||
<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">
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<i class="fa-solid fa-microchip"></i>
|
||||
Streaming service
|
||||
</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="./page1.html">Главная страница</a>
|
||||
<a class="nav-link active" href="./page2.html">Поиск</a>
|
||||
<a class="nav-link" href="./page3.html">Подписки</a>
|
||||
<a class="nav-link" href="./page4.html">Вход/Регистрация</a>
|
||||
</div>
|
||||
<form class="col-12 col-md-auto mb-2 mb-md-0 me-md-3" role="search" action="./page2.html" method="get">
|
||||
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="container-fluid container-main">
|
||||
<div class="row">
|
||||
<nav class="col-md-2 d-none d-md-block bg-dark sidebar">
|
||||
<div class="d-flex flex-column align-items-center align-items-sm-start px-8 pt-3 text-white min-vh-100">
|
||||
<h2>Стримеры онлайн</h2>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Streamer1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Straaaa2</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1702</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page6admin.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">admin</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">902</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
|
||||
<hr class="featurette-divider">
|
||||
<div class="col-md-7">
|
||||
<h2 class="featurette-heading fw-normal lh-1">По запросу ничего не найдено. <span class="text-body-secondary"> </span></h2>
|
||||
<p class="lead">Убедитесь, что все слова написаны правильно, или попробуйте другие ключевые слова.</p>
|
||||
</div>
|
||||
|
||||
<hr class="featurette-divider">
|
||||
<h1 class="display-4 fs-2 fw-bold">Рекомендации</h1>
|
||||
|
||||
<div class="row mt-3">
|
||||
<div class="col-md-3 mb-3">
|
||||
<div class="card">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" alt="Your Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer1</a>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<a class="btn btn-secondary" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 mb-3">
|
||||
<div class="card">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" alt="Your Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer2</a>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<a class="btn btn-secondary" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 mb-3">
|
||||
<div class="card">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" alt="Your Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer3</a>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<a class="btn btn-secondary" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-3 mb-3">
|
||||
<div class="card">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" alt="Your Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer4</a>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<a class="btn btn-secondary" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-3 mb-3">
|
||||
<div class="card">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" alt="Your Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer5</a>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<a class="btn btn-secondary" href="page5channel.html">Subscribe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../assets/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="sidebars.js"></script>
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
237
lab2/page3.html
Normal file
237
lab2/page3.html
Normal file
@ -0,0 +1,237 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Подписки</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||
<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">
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<i class="fa-solid fa-microchip"></i>
|
||||
Streaming service
|
||||
</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="./page1.html">Главная страница</a>
|
||||
<a class="nav-link" href="./page2.html">Поиск</a>
|
||||
<a class="nav-link active" href="./page3.html">Подписки</a>
|
||||
<a class="nav-link" href="./page4.html">Вход/Регистрация</a>
|
||||
</div>
|
||||
<form class="col-12 col-md-auto mb-2 mb-md-0 me-md-3" role="search" action="./page2.html" method="get">
|
||||
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="container-fluid container-main">
|
||||
<div class="row">
|
||||
<nav class="col-md-2 d-none d-md-block bg-dark sidebar">
|
||||
<div class="d-flex flex-column align-items-center align-items-sm-start px-8 pt-3 text-white min-vh-100">
|
||||
<h2>Стримеры онлайн</h2>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Streamer1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Straaaa2</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1702</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page6admin.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">admin</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">902</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
|
||||
<div class="row mt-4">
|
||||
<p class="fw-bold fs-5">Подписки</p>
|
||||
<hr class="featurette-divider">
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer1</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer2</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer3</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer4</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer5</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer6</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer7</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 mb-2">
|
||||
<div class="card text-center">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" class="card-img-top rounded-circle" alt="Streamer Image">
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a class="streamer-nickname m-0 text-secondary text-decoration-none text-nowrap font-italic font-weight-bold" href="page5channel.html">Streamer8</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../assets/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="sidebars.js"></script>
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
180
lab2/page4.html
Normal file
180
lab2/page4.html
Normal file
@ -0,0 +1,180 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Login</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||
<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">
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<i class="fa-solid fa-microchip"></i>
|
||||
Streaming service
|
||||
</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="./page1.html">Главная страница</a>
|
||||
<a class="nav-link" href="./page2.html">Поиск</a>
|
||||
<a class="nav-link" href="./page3.html">Подписки</a>
|
||||
<a class="nav-link active" href="./page4.html">Вход/Регистрация</a>
|
||||
</div>
|
||||
<form class="col-12 col-md-auto mb-2 mb-md-0 me-md-3" role="search" action="./page2.html" method="get">
|
||||
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<div class="container-fluid container-main">
|
||||
<div class="row">
|
||||
<nav class="col-md-2 d-none d-md-block bg-dark sidebar">
|
||||
<div class="d-flex flex-column align-items-center align-items-sm-start px-8 pt-3 text-white min-vh-100">
|
||||
<h2>Стримеры онлайн</h2>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Streamer1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Straaaa2</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1702</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page6admin.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">admin</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">902</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
|
||||
<ul class="nav nav-tabs" id="myTab" role="tablist">
|
||||
<li class="nav-item" role="presentation">
|
||||
<a class="nav-link active" id="login-tab" data-toggle="tab" href="#login" role="tab" aria-controls="login" aria-selected="true">Логин</a>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<a class="nav-link" id="register-tab" data-toggle="tab" href="#register" role="tab" aria-controls="register" aria-selected="false">Регистрация</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content" id="myTabContent">
|
||||
<!-- логин -->
|
||||
<div class="tab-pane fade show active" id="login" role="tabpanel" aria-labelledby="login-tab">
|
||||
<div class="row justify-content-center">
|
||||
<form class="col-md-6 m-0" action="./page4new.html" method="get">
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="email">E-mail</label>
|
||||
<input id="email" name="email" class="form-control" type="email" placeholder="name@example.ru" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="password">Пароль</label>
|
||||
<input id="password" name="password" class="form-control" type="password" required>
|
||||
</div>
|
||||
|
||||
<div class="text-center">
|
||||
<button class="btn btn-primary w-50" type="submit">Вход</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- регистрация -->
|
||||
<div class="tab-pane fade" id="register" role="tabpanel" aria-labelledby="register-tab">
|
||||
<div class="row justify-content-center">
|
||||
<form class="col-md-6 m-0" action="./page4new.html" method="get">
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="lastname">Фамилия</label>
|
||||
<input id="lastname" name="lastname" class="form-control" type="text" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="firstname">Имя</label>
|
||||
<input id="firstname" name="firstname" class="form-control" type="text" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="email">E-mail</label>
|
||||
<input id="email" name="email" class="form-control" type="email" placeholder="name@example.ru" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="password">Пароль</label>
|
||||
<input id="password" name="password" class="form-control" type="password" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="date">Дата</label>
|
||||
<input id="date" name="date" class="form-control" type="date" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="disabled">Выключенный компонент</label>
|
||||
<input id="disabled" name="disabled" class="form-control" type="text" value="Некоторое значение"
|
||||
disabled>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="readonly">Компонент только для чтения</label>
|
||||
<input id="readonly" name="readonly" class="form-control" type="text" value="Некоторое значение"
|
||||
readonly>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="color">Выбор цвета</label>
|
||||
<input id="color" name="color" type="color" class="form-control form-control-color">
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<select class="form-select form-select-sm" aria-label="Large select example">
|
||||
<option selected>Ваш пол</option>
|
||||
<option value="1">М</option>
|
||||
<option value="2">Ж</option>
|
||||
<option value="3">Другое</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="text-center mb-md-0 ">
|
||||
<button class="btn btn-primary w-50" type="submit">Зарегистрироваться</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> -->
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
142
lab2/page5channel.html
Normal file
142
lab2/page5channel.html
Normal file
@ -0,0 +1,142 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Streaming service</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||
<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"> <!-- class="h-100 d-flex flex-column"-->
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<i class="fa-solid fa-microchip"></i>
|
||||
Streaming service
|
||||
</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="./page1.html">Главная страница</a>
|
||||
<a class="nav-link" href="./page2.html">Поиск</a>
|
||||
<a class="nav-link" href="./page3.html">Подписки</a>
|
||||
<a class="nav-link" href="./page4.html">Вход/Регистрация</a>
|
||||
</div>
|
||||
<form class="col-12 col-md-auto mb-2 mb-md-0 me-md-3" role="search" action="./page2.html" method="get">
|
||||
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="container-fluid ">
|
||||
<div class="row">
|
||||
|
||||
<nav class="col-md-2 bg-dark sidebar">
|
||||
<div class="d-flex flex-column align-items-center align-items-sm-start px-8 pt-3 text-white">
|
||||
<h2>Стримеры онлайн</h2>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Streamer1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Straaaa2</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1702</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page6admin.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">admin</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">902</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
|
||||
<div class="full-page-div">
|
||||
|
||||
<!-- YouTube Player -->
|
||||
<div class="embed-responsive embed-responsive-16by9 mb-4">
|
||||
<iframe class="video-thumbnail embed-responsive-item" src="https://www.youtube.com/embed/dQw4w9WgXcQ" allowfullscreen></iframe>
|
||||
</div>
|
||||
|
||||
<div class="row mb-4">
|
||||
<div class="col-md-4">
|
||||
<div class="circle-container m-3">
|
||||
<img src="StreamerCircle.jpg" alt="Your Image">
|
||||
</div>
|
||||
<h4 class="mt-2">Channel Name</h4>
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
<h2>Video Title</h2>
|
||||
<p>Real video description goes here...</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<h3>Comments</h3>
|
||||
<div class="media mb-3">
|
||||
<img src="user-avatar1.jpg" class="mr-3 rounded-circle" alt="User Avatar">
|
||||
<div class="media-body">
|
||||
<h5 class="mt-0">Commenter 1</h5>
|
||||
Comment content goes here...
|
||||
</div>
|
||||
</div>
|
||||
<div class="media">
|
||||
<img src="user-avatar2.jpg" class="mr-3 rounded-circle" alt="User Avatar">
|
||||
<div class="media-body">
|
||||
<h5 class="mt-0">Commenter 2</h5>
|
||||
Another comment content...
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script src="../assets/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="sidebars.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
177
lab2/page6admin.html
Normal file
177
lab2/page6admin.html
Normal file
@ -0,0 +1,177 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Streaming service</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||
<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="h-100 d-flex flex-column"-->
|
||||
<header>
|
||||
<nav class="navbar navbar-expand-md navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<i class="fa-solid fa-microchip"></i>
|
||||
Streaming service
|
||||
</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="./page1.html">Главная страница</a>
|
||||
<a class="nav-link" href="./page2.html">Поиск</a>
|
||||
<a class="nav-link" href="./page3.html">Подписки</a>
|
||||
<a class="nav-link" href="./page4.html">Вход/Регистрация</a>
|
||||
</div>
|
||||
<form class="col-12 col-md-auto mb-2 mb-md-0 me-md-3" role="search" action="./page2.html" method="get">
|
||||
<input class="form-control" type="text" placeholder="Search" aria-label="Search">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="container-fluid ">
|
||||
<div class="row">
|
||||
|
||||
<nav class="col-md-2 bg-dark sidebar">
|
||||
<div class="d-flex flex-column align-items-center align-items-sm-start px-8 pt-3 text-white">
|
||||
<h2>Стримеры онлайн</h2>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Streamer1</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1000</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5channel.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">Straaaa2</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">1702</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<a href="page5kaicenat.html" class="nav-link align-middle px-0">
|
||||
<i class="fs-4 bi-house"></i> <span class="ms-1 d-none d-sm-inline">admin</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col d-flex align-items-center justify-content-end">
|
||||
<div class="online-indicator">
|
||||
<div class="dot"></div>
|
||||
<div class="online-count ml-1">902</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4"> <!-- container-fluid p-2 -->
|
||||
<div class="full-page-div">
|
||||
<div class="btn-group" role="group">
|
||||
<button id="items-add" class="btn btn-info">Добавить товар (диалог)</button>
|
||||
<a class="btn btn-success" href="/page-edit.html">Добавить товар (страница)</a>
|
||||
</div>
|
||||
<div>
|
||||
<table id="items-table" class="table table-striped">
|
||||
<thead>
|
||||
<th scope="col">№</th>
|
||||
<th scope="col" class="w-25">Товар</th>
|
||||
<th scope="col" class="w-25">Цена</th>
|
||||
<th scope="col" class="w-25">Количество</th>
|
||||
<th scope="col" class="w-25">Сумма</th>
|
||||
<th scope="col"></th>
|
||||
<th scope="col"></th>
|
||||
<th scope="col"></th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="items-update" class="modal fade" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false">
|
||||
<div class="modal-dialog">
|
||||
<form id="items-form" class="needs-validation" novalidate>
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="items-update-title"></h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="text-center">
|
||||
<img id="image-preview" src="https://via.placeholder.com/200" class="rounded rounded-circle"
|
||||
alt="placeholder">
|
||||
</div>
|
||||
<input id="items-line-id" type="number" hidden>
|
||||
<div class="mb-2">
|
||||
<label for="item" class="form-label">Товары</label>
|
||||
<select id="item" class="form-select" name="selected" required>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="price">Цена</label>
|
||||
<input id="price" name="price" class="form-control" type="number" value="0.00" min="1000.00"
|
||||
step="0.50" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="count">Количество</label>
|
||||
<input id="count" name="count" class="form-control" type="number" value="0" min="1" step="1"
|
||||
required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label" for="image">Изображение</label>
|
||||
<input id="image" type="file" name="image" class="form-control" accept="image/*">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
|
||||
<button type="submit" class="btn btn-primary">Сохранить</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module">
|
||||
import validation from "./js/validation";
|
||||
import { linesForm } from "./js/lines";
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
validation();
|
||||
linesForm();
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</main>
|
||||
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
|
||||
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script src="../assets/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="sidebars.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
5
lab2/readme.md
Normal file
5
lab2/readme.md
Normal file
@ -0,0 +1,5 @@
|
||||
npm install
|
||||
|
||||
npm start
|
||||
|
||||
npm run prod
|
||||
0
lab2/second.html
Normal file
0
lab2/second.html
Normal file
8
lab2/sidebars.js
Normal file
8
lab2/sidebars.js
Normal file
@ -0,0 +1,8 @@
|
||||
/* global bootstrap: false */
|
||||
(() => {
|
||||
'use strict'
|
||||
const tooltipTriggerList = Array.from(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
|
||||
tooltipTriggerList.forEach(tooltipTriggerEl => {
|
||||
new bootstrap.Tooltip(tooltipTriggerEl)
|
||||
})
|
||||
})()
|
||||
209
lab2/style.css
Normal file
209
lab2/style.css
Normal file
@ -0,0 +1,209 @@
|
||||
header nav {
|
||||
background-color: #292828;
|
||||
}
|
||||
/* @media screen and (min-width: 992px){
|
||||
.navbar .container-fluid, .navbar-expand-lg .navbar-collapse, .navbar-expand-lg .navbar-nav{
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
|
||||
}
|
||||
.navbar{
|
||||
width: 25%;
|
||||
height: 100vh;
|
||||
align-items: flex-start;
|
||||
|
||||
}
|
||||
.navbar-brand{
|
||||
margin-left: .5rem;
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
}
|
||||
.navbar .navbar-nav .nav-link{
|
||||
color: #fff2ff;
|
||||
font-size: 1.1em;
|
||||
} */
|
||||
html, body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
header nav {
|
||||
height: 64px;
|
||||
}
|
||||
container-fluid nav{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.full-page-div {
|
||||
background-color: #ececec; /* Цвет фона */
|
||||
padding: 1%; /* Внутренний отступ */
|
||||
margin: 1%; /* Внешний отступ */
|
||||
}
|
||||
|
||||
header nav a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: #9c9c9c;
|
||||
height: 32px;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
h4 {
|
||||
font-size: 1.5px;
|
||||
}
|
||||
/* .container{
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
}*/
|
||||
/* .container-fluid{
|
||||
height: 100vh;
|
||||
}
|
||||
.full-page-div {
|
||||
width: 100%;
|
||||
height: calc(100vh - 56px); /* 56px - высота навигационной панели (navbar)
|
||||
overflow-y: auto; Добавляет вертикальную прокрутку, если содержимое не помещается
|
||||
|
||||
} */
|
||||
.card{
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
.circle-container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden; /* обрезаем лишнее изображение за пределами круга */
|
||||
margin: auto; /* автоматическое выравнивание по горизонтали */
|
||||
margin-top: 20px; /* опциональное выравнивание по вертикали (если нужно) */
|
||||
}
|
||||
|
||||
.circle-container img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover; /* сохраняем соотношение сторон и обрезаем изображение, чтобы оно полностью заполнило круг */
|
||||
}
|
||||
|
||||
a{
|
||||
margin-bottom: 2px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
/* .container-main {
|
||||
flex: 1;
|
||||
} */
|
||||
|
||||
.streamer-nickname {
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
font-size: 26px;
|
||||
}
|
||||
.online-indicator {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.dot {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
background-color: red;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.online-count {
|
||||
color: red;
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
/* .sidebar {
|
||||
background-color: #f8f9fa;
|
||||
height: 100vh;
|
||||
} */
|
||||
.video-thumbnail {
|
||||
/* width: 1920px;
|
||||
height: 1080px; */
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.embed-responsive{
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
width: 1600px;
|
||||
height: 800px;
|
||||
}
|
||||
|
||||
img,
|
||||
svg {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/*
|
||||
.tab-style-1 {
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.tab-style-1 a {
|
||||
font-size: 24px;
|
||||
color: #ACACAC;
|
||||
letter-spacing: 1.5px;
|
||||
display: inline-block;
|
||||
margin: 0 47px;
|
||||
line-height: .8;
|
||||
font-family: "Proxima Nova Rg";
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
||||
.tab-style-1 a {
|
||||
margin: 0 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
||||
.tab-style-1 a {
|
||||
margin: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
.tab-style-1 a {
|
||||
margin: 0 10px 15px;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-style-1 a.active {
|
||||
color: #181818;
|
||||
border-bottom: 1px solid #181818;
|
||||
}
|
||||
|
||||
.tab-style-1 a:hover {
|
||||
color: #BB9B1F;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
.tab-style-1.mb-10 {
|
||||
margin-bottom: 24px !important;
|
||||
}
|
||||
} */
|
||||
|
||||
8288
lab2/style1.css
Normal file
8288
lab2/style1.css
Normal file
File diff suppressed because it is too large
Load Diff
27630
lab2/style3.css
Normal file
27630
lab2/style3.css
Normal file
File diff suppressed because one or more lines are too long
14
lab2/vite.config.js
Normal file
14
lab2/vite.config.js
Normal file
@ -0,0 +1,14 @@
|
||||
import { resolve } from 'path'
|
||||
import { defineConfig } from 'vite'
|
||||
|
||||
export default defineConfig({
|
||||
build: {
|
||||
rollupOptions: {
|
||||
input: {
|
||||
main: resolve(__dirname, 'index.html'),
|
||||
page2: resolve(__dirname, 'page2.html'),
|
||||
page3: resolve(__dirname, 'page3.html'),
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
BIN
lab3/lab3 IP.docx
Normal file
BIN
lab3/lab3 IP.docx
Normal file
Binary file not shown.
Loading…
Reference in New Issue
Block a user