sheym/PIbd-23_Sheymuhov_A.I._Internet_Programming
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: sheym:main
Branches Tags
sheym:main sheym:Lab5 sheym:Lab4 sheym:Lab3 sheym:Lab2 sheym:Lab1
...
pull from: sheym:Lab2
Branches Tags
sheym:Lab5 sheym:Lab4 sheym:Lab3 sheym:Lab2 sheym:Lab1 sheym:main

4 Commits
main ... Lab2

Author SHA1 Message Date
sheymuh
1d4db16e23 не везде внёс правки 2025-04-25 13:21:13 +04:00
sheymuh
89246eeead правки 2025-04-25 13:15:11 +04:00
sheymuh
a9bc51d17a вторая лаба 2025-04-11 15:51:08 +04:00
sheymuh
49435b1342 первая лаба 2025-03-01 13:05:35 +04:00
22 changed files with 495 additions and 0 deletions
Expand all files Collapse all files

BIN
Resources/2016.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 201 KiB

BIN
Resources/cs2.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 20 KiB

BIN
Resources/derzko.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.8 KiB

BIN
Resources/goats.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 642 KiB

BIN
Resources/lofi_girl.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 393 KiB

BIN
Resources/stardew.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

BIN
Resources/teddy.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 154 KiB

BIN
Resources/tg_icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
Resources/tg_icon1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.6 KiB

BIN
Resources/vk_icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
Resources/vk_icon2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.9 KiB

BIN
Resources/КАЙФ.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 90 KiB

BIN
Resources/асмр человек паук.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 68 KiB

BIN
Resources/папаня.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
Resources/резня.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 155 KiB

BIN
Resources/стрим ксго.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 83 KiB

46
pageAccount.html Normal file
View File

@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Мой аккаунт</title>
<link rel="stylesheet" href="styleStreamingService.css" />
</head>
<body>
<div class="header">
<div class="header-logo">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown">
<span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav>
<nav class="features-item"><a href="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav>
</nav>
</nav>
</div>
<div class="content">
<h2><em>Ваш никнейм</em></h2>
<div class="avatar"><img src="Resources\derzko.webp" alt="derzko"></div>
<p>ПОЛ МИЛЛИОНА ПОДПИЩИКОВ</p>
<div class="header-logo">
<div class="button">Выйти из аккаунта</div>
<div class="button">Сменить пароль</div>
</div>
</div>
<div class="footer">
<div class="footer-content">
<div class="company-name">RBCS CORP.</div>
<div class="footer-images">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image">
</div>
</div>
</div>
</body>
</html>

46
pageCategories.html Normal file
View File

@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Популярные категории</title>
<link rel="stylesheet" href="styleStreamingService.css" />
</head>
<body>
<div class="header">
<div class="header-logo">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown">
<span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav>
<nav class="features-item"><a href="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav>
</nav>
</nav>
</div>
<div class="content">
<h2>Популярные категории</h2>
<ol>
<li>Общение</li>
<li>Казик</li>
<li>Стрелялки</li>
<li>пупупу</li>
</ol>
</div>
<div class="footer">
<div class="footer-content">
<div class="company-name">RBCS CORP.</div>
<div class="footer-images">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image">
</div>
</div>
</div>
</body>
</html>

56
pageMain.html Normal file
View File

@@ -0,0 +1,56 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Главная</title>
<link rel="stylesheet" href="styleStreamingService.css" />
</head>
<body>
<div class="header">
<div class="header-logo">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown">
<span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav>
<nav class="features-item"><a href="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav>
</nav>
</nav>
</div>
<div class="content">
<p>Сейчас в эфире</p>
<div class="photo-grid-container">
<div class="photo-grid">
<div class="photo-grid-item"><img src="Resources\cs2.webp" alt="cs2"></div>
<div class="photo-grid-item"><img src="Resources\derzko.webp" alt="derzko"></div>
<div class="photo-grid-item"><img src="Resources\stardew.webp" alt="stardew"></div>
<div class="photo-grid-item"><img src="Resources\teddy.jpg" alt="teddy"></div>
<div class="photo-grid-item"><img src="Resources\lofi_girl.jpg" alt="lofi_girl"></div>
</div>
</div>
<h3>Популярные каналы</h3>
<ul>
<li><a href="pageAccount.html" target="_blank"><em>ВЫ</em> самый популярный стример на данной платформе!!!</a></li>
<li>какой-то стример 1</li>
<li>какой-то стример 2</li>
<li>ммм <b>МАРМОК</b></li>
</ul>
</div>
<div class="footer">
<div class="footer-content">
<div class="company-name">RBCS CORP.</div>
<div class="footer-images">
<a href="https://vk.com/sheym_not_shame" target="_blank"><img src="Resources\vk_icon.png" alt="vk" class="footer-image"></a>
<a href="https://t.me/sheymuh" target="_blank"><img src="Resources\tg_icon.png" alt="tg" class="footer-image"></a>
</div>
</div>
</div>
</body>
</html>

55
pageSavedStreams.html Normal file
View File

@@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Сохранённые трансляции</title>
<link rel="stylesheet" href="styleStreamingService.css" />
</head>
<body>
<div class="header">
<div class="header-logo">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown">
<span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav>
<nav class="features-item"><a href="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav>
</nav>
</nav>
</div>
<div class="content">
<h2>Запланированные трансляции</h2>
<div class="photo-grid-container">
<div class="photo-grid">
<div class="photo-grid-item"><img src="Resources\стрим ксго.webp" alt="стрим ксго"></div>
<div class="photo-grid-item"><img src="Resources\goats.png" alt="goats"></div>
<div class="photo-grid-item"><img src="Resources\папаня.jpg" alt="папаня"></div>
</div>
</div>
<h2>Смотреть позже</h2>
<div class="photo-grid-container">
<div class="photo-grid">
<div class="photo-grid-item"><img src="Resources\2016.jpeg" alt="стрим ксго"></div>
<div class="photo-grid-item"><img src="Resources\асмр человек паук.webp" alt="асмр"></div>
<div class="photo-grid-item"><img src="Resources\резня.jpg" alt="резня"></div>
</div>
</div>
</div>
<div class="footer">
<div class="footer-content">
<div class="company-name">RBCS CORP.</div>
<div class="footer-images">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image">
</div>
</div>
</div>
</body>
</html>

48
pageSubscriptions.html Normal file
View File

@@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Подписки</title>
<link rel="stylesheet" href="styleStreamingService.css" />
</head>
<body>
<div class="header">
<div class="header-logo">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown">
<span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav>
<nav class="features-item"><a href="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav>
</nav>
</nav>
</div>
<div class="content">
<h2>Ваши подписки</h2>
<ol>
<li>НОРМ канал</li>
<div class="subButtons"><div class="button">Вы подписаны</div></div>
<li>САМЫЙ КРУТОЙ КАНАЛ</li>
<div class="subButtons"><div class="button blue-button">Вы спонсор</div></div>
<li>ПРОСТО КРУТОЙ канал</li>
<div class="subButtons"><div class="button">Вы подписаны</div></div>
</ol>
</div>
<div class="footer">
<div class="footer-content">
<div class="company-name">RBCS CORP.</div>
<div class="footer-images">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image">
</div>
</div>
</div>
</body>
</html>

244
styleStreamingService.css Normal file
View File

@@ -0,0 +1,244 @@
body {
display: flex;
flex-direction: column;
min-height: 100vh;
font-family: "Helvetica", "Arial", sans-serif;
font-size: 18px;
margin: 0;
padding: 0;
background-color: #ade8f4;
}
h1 {
font-size: 1.5em;
margin: 20px auto;
}
h2 {
font-size: 1em;
margin: 20px auto;
text-align: left;
}
/* Мобильное устройство (ширина области отображения от 0 до 400px)*/
@media only screen and (max-width: 400px) {
h1 {
font-size: 1em;;
}
h2, h3, p {
text-align: center;
}
.header {
gap: 20px;
}
.navbar {
flex-direction: column;
align-self: center;
row-gap: 5px;
}
.navbar a {
height: 10px;
}
.dropdown:hover .features-menu {
height: max-content;
row-gap: 10px;
}
.avatar {
justify-content: center;
}
.avatar img {
width: 200px;
height: auto;
}
.photo-grid {
justify-content: center;
}
.subButtons {
justify-content: center;
}
}
/* Планшет (ширина области отображения от 401 до 960px)*/
@media only screen and (min-width: 401px) and (max-width: 960px) {
body {
justify-content: center;
}
.header {
gap: 20px;
}
}
.subButtons {
display: flex;
}
.button {
color: #081c15;
background-color: #90e0ef;
font-weight: bold;
padding: 10px 5px;
text-align: center;
border: 2px solid #5d6063;
border-radius: 5px;
width: 150px;
box-sizing: border-box;
margin: 10px;
}
.blue-button {
background-color: #0077b6;
}
.button:hover {
background: #48cae4;
}
.blue-button:hover {
background: #016296;
}
.header {
display: flex;
top: 0;
left: 0;
height: 60px;
position: sticky;
background-color: #00b4d8;
color: #081c15;
align-items: center;
justify-content: space-between;
padding: 10px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
}
.header-logo {
display: flex;
align-items: center;
gap: 15px;
}
.header-logo img {
width: 50px;
height: auto;
}
.navbar {
display: flex;
justify-content: center;
column-gap: 15px;
margin-right: 20px;
}
.navbar a {
display: flex;
text-decoration: none;
width: fit-content;
align-items: center;
justify-content: center;
color: #081c15;
font-weight: bold;
background: #90e0ef;
padding: 8px 15px;
border-radius: 5px;
}
.navbar a:hover {
background: #48cae4;
}
.dropdown {
width: max-content;
position: relative;
}
.dropdown > span {
z-index: 2;
position: relative;
cursor: pointer;
}
.dropdown:hover .features-menu {
display: flex;
flex-direction: column;
background: #90e0ef;
border-radius: 5px;
padding: 5px;
position: absolute;
z-index: 1;
}
.features-menu {
display: none;
}
.features-item:hover {
border-radius: 5px;
background: #48cae4;
}
.content {
flex: 1;
padding: 10px 20px;
}
.avatar {
display: flex;
}
.photo-grid-container {
display: flex;
justify-content: center;
}
.photo-grid {
width: 100%;
display: flex;
align-items: center;
flex-wrap: wrap;
flex-direction: row;
}
.photo-grid img {
width: 256px;
height: 200px;
}
.photo-grid-item {
height: 200px;
background-color: #5995da;
align-items: center;
justify-self: center;
border: 2px solid #fff;
}
.footer {
overflow: hidden;
flex-shrink: 1;
height: 80px;
background-color: #023047;
text-align: center;
padding: 0 40px;
}
.footer-content {
display: flex;
justify-content: space-between;
align-items: center;
}
.company-name {
flex: 1; /* Занимает доступное пространство */
color: #ade8f4;
}
.footer-images {
display: flex;
gap: 20px;
padding: 10px;
}
.footer-image {
width: 60px;
height: auto;
}