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

Compare commits

base: sheym:Lab2
Branches Tags
sheym:main sheym:Lab5 sheym:Lab4 sheym:Lab3 sheym:Lab2 sheym:Lab1
..
compare: sheym:1fef86cb17515cc474c3f684a45177bfcec78483
Branches Tags
sheym:Lab5 sheym:Lab4 sheym:Lab3 sheym:Lab2 sheym:Lab1 sheym:main

4 Commits
Lab2 ... 1fef86cb17

Author SHA1 Message Date
sheymuh
1fef86cb17 теперь точно третья лаба готова 2025-05-14 15:38:23 +04:00
sheymuh
f9f430f92b третья лаба готова 2025-04-30 15:07:55 +04:00
sheymuh
38b22411cc остались иконки и форма 2025-04-29 20:40:50 +04:00
sheymuh
8fc03cb811 настроил окружение 2025-04-12 10:36:38 +04:00
30 changed files with 8934 additions and 206 deletions
Expand all files Collapse all files

2
.eslintignore Normal file
View File

@@ -0,0 +1,2 @@
node_modules
dist

16
.eslintrc.json Normal file
View File

@@ -0,0 +1,16 @@
{
"env": {
"browser": true,
"es2021": true
},
"extends": ["airbnb-base", "prettier"],
"plugins": ["prettier", "html"],
"parserOptions": {
"ecmaVersion": 12,
"sourceType": "module"
},
"rules": {
"prettier/prettier": "error",
"no-console": "off"
}
}

1
.gitignore vendored
View File

@@ -12,3 +12,4 @@
# Built Visual Studio Code Extensions # Built Visual Studio Code Extensions
*.vsix *.vsix
node_modules

7
.prettierrc Normal file
View File

@@ -0,0 +1,7 @@
{
"tabWidth": 4,
"singleQuote": false,
"printWidth": 120,
"trailingComma": "es5",
"useTabs": false
}

8
.vscode/extensions.json vendored Normal file
View File

@@ -0,0 +1,8 @@
{
"recommendations": [
"usernamehw.errorlens",
"AndersEAndersen.html-class-suggestions",
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode"
]
}

18
.vscode/launch.json vendored Normal file
View File

@@ -0,0 +1,18 @@
{
"configurations": [
{
"type": "chrome",
"name": "Debug",
"request": "launch",
"url": "http://localhost:8080"
},
{
"type": "node",
"name": "Start",
"request": "launch",
"runtimeExecutable": "npm",
"runtimeArgs": ["run-script", "start"],
"console": "integratedTerminal"
}
]
}

39
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,39 @@
{
"files.autoSave": "onFocusChange",
"files.eol": "\n",
"editor.detectIndentation": false,
"editor.formatOnType": false,
"editor.formatOnPaste": true,
"editor.formatOnSave": true,
"editor.tabSize": 4,
"editor.insertSpaces": true,
"editor.codeActionsOnSave": {
"source.organizeImports": "explicit",
"source.sortImports": "explicit"
},
"editor.snippetSuggestions": "bottom",
"debug.toolBarLocation": "commandCenter",
"debug.showVariableTypes": true,
"errorLens.gutterIconsEnabled": true,
"errorLens.messageEnabled": false,
"prettier.tabWidth": 4,
"prettier.singleQuote": false,
"prettier.printWidth": 120,
"prettier.trailingComma": "es5",
"prettier.useTabs": false,
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
}

BIN
dist/assets/2016-BUapLfv6.jpeg vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 201 KiB

BIN
dist/assets/derzko-pSp-01RX.webp vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.8 KiB

BIN
dist/assets/goats-D56R5-1i.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 642 KiB

1
dist/assets/styleStreamingService-CUHvxLFI.css vendored Normal file
View File

@@ -0,0 +1 @@
body{font-family:Helvetica,Arial,sans-serif;font-size:18px;background-color:#ade8f4}h1{font-size:1.5em;margin:20px auto}h2{font-size:1em;margin:20px auto;text-align:left}@media only screen and (max-width: 400px){h1{font-size:1em}h2,h3,p{text-align:center}.navbar{flex-direction:column;align-self:center;row-gap:5px}.navbar a{height:30px}.dropdown:hover .features-menu{height:max-content}.features-item a{height:40px;text-align:start}.avatar{justify-content:center}.avatar img{width:200px;height:auto}.photo-grid,.subButtons{justify-content:center}}@media only screen and (min-width: 401px) and (max-width: 960px){body{justify-content:center}}.button{color:#081c15;background-color:#90e0ef;font-weight:700;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{background-color:#00b4d8;color:#081c15;box-shadow:0 4px 10px #0003}.header-logo img{width:50px;height:auto;margin:5px}.navbar a{display:flex;text-decoration:none;align-items:center;justify-content:center;padding:8px 15px;width:fit-content;color:#081c15;font-weight:700;background:#90e0ef;border-radius:5px}.navbar a:hover{background:#48cae4}.dropdown{width:max-content}.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}.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{background-color:#023047;text-align:center}.company-name{color:#ade8f4}

BIN
dist/assets/КАЙФ-Dbw7IVze.jpg vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 90 KiB

BIN
dist/assets/асмр человек паук-RgZcxljT.webp vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 68 KiB

BIN
dist/assets/папаня-BZOoCf1B.jpg vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
dist/assets/резня-Du5Ks9ja.jpg vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 155 KiB

BIN
dist/assets/стрим ксго-d7c_w3u0.webp vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 83 KiB

52
dist/pageAccount.html vendored Normal file
View File

@@ -0,0 +1,52 @@
<!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 href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
<link rel="stylesheet" crossorigin href="/assets/styleStreamingService-CUHvxLFI.css">
</head>
<body class="min-vh-100 d-flex flex-column m-0 p-0">
<header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="/assets/%D0%9A%D0%90%D0%99%D0%A4-Dbw7IVze.jpg" alt="Логотип"/></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown position-relative">
<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>
</header>
<div class="content flex-grow-1 p-3 px-4">
<h2><em>Ваш никнейм</em> <i class="bi bi-patch-check-fill"></i></h2>
<div class="avatar d-flex"><img src="/assets/derzko-pSp-01RX.webp" alt="derzko" /></div>
<p>ПОЛ МИЛЛИОНА ПОДПИЩИКОВ</p>
<div class="buttons d-flex align-items-center gap-3">
<div class="button">Выйти из аккаунта</div>
<div class="button">Сменить пароль</div>
</div>
</div>
<div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images d-flex gap-3 p-3">
<a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEcUlEQVR4nO2aX2wURRzH71GNSigSd5BAYmIwMTFGjfHVvvhm5E80QV980KqRRExnripwtgLyYDCaaJACUSFYQVBfjOFBia31wEM6v7tem0Na6l1pKdw1pbQ0ba9jfnu0ureztzO7e3s+3Df5JZd2Ojefnd+/mW0kUldddYUm8lbiHqO5ZyOhsJNQOE4YP00oJEzDzwyO4e8MltywqiW9IvJ/UsOWzN1GtOc1g/FuQnmRMBBKRnnRoPw3g0ETzlEzgOXRxLLS04Vx5cU7mEGhQBhvDR3oXgbPEcov+wWwATEYNhjfVHUAEkvcYVB+KGgACVD76q3dt1cFYk0LLEefrjYEWYohOIPJI1AIzDCEQio0CLZkydVbUw2BuRNhEK8BhCi5Ge8OxM3CiAlXGAr7/WenGkOQf3dmk/dCx2C41gBkyfgI1i5tELPNqPniwWqUv6cFgeRBVOzA3YtCQav6Y+8km+jFQ4Ni548jFlv7TlL6pZsPWse+8fXfjgtkJ3KWsRv3XawQK9CkDoINoGSS9s6rolyP7uqTfuGRM3nLuLODU9JxT3zQLxYWrHO+ftQZ2mC8S6P4ybvYPT+N2kAa92Z8gRzoumYZNz1bFOtivZXipKhU8THNOU1CT+RsIC8cHPQM8tTejJidt27HV/G8e6yw5AZf2QoXXS7cJS8gD2xPib6Rm5YxkzNF8cj7aYXA560qIMedJngw1iuKZf58Kj2hDYKuEx+4YXsobx7LqmUwyr9RcC34tdIk/aPWpzgztyD1aRnIfVEQL315SWQLszaIT34eU4MogfziDkLhz0qTfPG7NThR0ZM5V5DrN4viyvU5IRNmQ2UIZqbgc75Bnv74gm0hoxOz4v53UxVBZMKY2NLhnGqJLxAX10I7n522LQrTqC5IYWpeNH+bM11OC4YquJZ5ZeMyERYsmbb9MKwFsqjOC5Ni3Y5ejR3hHYE0i6uiYAavTEfPFsRDrWkbSOLSlOj4oyDyN+Rxgqn4sd3yLsFT+jUv2BQme3JPv5iYnpcuCotc+YL33wroNW8nRcvJYenfZq7MqO1MM6z31aKUGzZ32FKoaBHkvw9i4OqMbdz3PeNu8VFUPsfr3JY889lfYmxyThsE7fHdfeKaxNU2O7Q9ZnxQ6FSCKIHAqzpZ5OG2tPju/Liti3UDQXv58JBtbGJoqsKOwCt6x1zzGlMvLTZ+lDGbPkyrqiBoPZJ03ijpqg3G8yto310RHWFm0AVZNKwLCIWHqQ9PjYpPT4+JpiNDjuPRlQ7H8xZ7vn1A5lY7IrpCcoNBzitM0GZQyK6Mpe6MeFGls0noIEzhDFIRhvIDtYYglO+L+BVeVzqd4cPZCd61NjZ4m2+QEkyqAS+Uw98JgMAusS2vFRjvChEkHvhrBaubQXsIEJ8H5k5u2awaqdmgkPWdnbzUGbyL9dIBSAI6j8Vupdc6EYRu3do3mfGj/XoaOrF30m47qi0zuzXDekJ5G17Z4JF06R8GzM/mz9oIhWcDz0Z11VVXpJL+Aemdmrez0du5AAAAAElFTkSuQmCC" alt="vk"/>
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEnklEQVR4nO2aS2wbRRjHfae8xOuOqnbXalMkJLiAhDggBOVQaBFSpCKOoCJVnAoSQoKm0AMSJw6gIh4ioliigXbGjqzmUSVxaF4YE+okjpO6TrBD0zpOZuxde/dDM7YTO3bWM/auzcF/6bvsrmf3N99jvp21y9VRRx21TF39m4+6vfSEgkmPgqhHwWRYxXSSGyJDxWM97Jr9OP2I6/+kw1dSD7oxeVdB9LqKiKliCkKGiKlgOq4gcurIpbsPtBVAReQzFZO08MPvDbWhYnKu5UAKoicVRJNNA+wyBdOEG9NuxwEO9sG9KiK9dgNUASHyg3sQ9jkCcejXzcdURKechlB3bJIVD/shMJlrIQQUjMzZBsPCSUF0uvUQdNsztoQZi9c2QgDPGUx+ahKCnmw3hFq0hqsZWyecKLG17IWhDJwJavDM1YyFV2iioXWmsNg59/BdPgrvzWgQuG2ACQWdCWr1QqxH2huF1dZ+gBeHM/D1Yg7WtdLj7+jYSNb694impLzCeic7H/6Ij8LpaQ3GymZ/t3QDuJfqjaVg8o4wCG8AbQB4yWL2NV2vgAqlDLFxEQ0IQbAFSKqLlZz9XD4PscQaBOejoOm57eMXYzlBEGIe+C39cF0Q9Qp9vRGAl4uzf1ffK3gA1jfSEFpYgj/no7BFMxXnPgrpwvdyY3K8flhh0iM64BNls28lmsnC/M04zIQj8FdkCWhWq7rmxGidRMflRj4WyQ9PvYGOXivMfspi9pnyeQPiyX/hj3CEQ8wuLkNW06uvM4FPiioIomByUQCEXKv148NeCh+GdJ6UIiqFEQNgdiMaAz23kxPlCqcFEx1v58mgiEdqNohfzFXPZC2RsjAq2dzyLZ7ke+mXeF4ShE41DMLaCH8iD1s56zAqB2C2EFsBw7D24tlZ3QkQUjO0SnbIS+H4aBY+D+s8yTWjOoxKFo3/A6ZpnUdM3YGsI6HlkRn02FC6CoDZrcRa/TgEAMMEeLJfrtQrQskuUX5Ldjm0XAGxsnYbRBXZNOW8gQXLL9s8kx34g7HkNkRfcBkGltaFQS6vSCY6pnAQkdccaVGe86dhugjy3cQSXBoYgx9nYkIg529IJjomhlCLUggvOi47S55gjINcCCxA38Aot68CEd7VWunNcelEHxOC4CCInJIFOT1SKL3fjMxyCM9AAF7xJXlFqtX9MrGjT/kzsh55WxiEvbzIvlg93b8FU+FF6B2e4BBHfcmKNWhhs9o1N4lkoiOaetx/536XjNherKxXvpyMw8+7IErGSuzVROXq7l2VS3QFkbMuWe3HcJ+K6KrMjZ71bcDz3juWi+mF6E5r8Onf4omuNLr5wMS2YGS9ImJv/Z6F94Mab0QlQN5wNSMFk++dgJHLDdLbFAT3yiDsK351aguEguj1rn64x2WH+CLZjk1sRMK2f6JT/BsPsR2MFoJM2P5ZoTzMWrKpjci3toWTJRCm3awc2g9AV5uuTrJiNZ23/HZsrSKaUhD5RHrVtlPs5mwbs5A/xBAHIAZrAFnv1FaAWmLtNXtXYLPL3uLYK2nZHwYG2TF+zkteZcWj5iAdddSRywn9B9E5uZlJrzFcAAAAAElFTkSuQmCC" alt="tg"/>
</a>
</div>
</div>
</div>
</body>

52
dist/pageCategories.html vendored Normal file
View File

@@ -0,0 +1,52 @@
<!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 href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
<link rel="stylesheet" crossorigin href="/assets/styleStreamingService-CUHvxLFI.css">
</head>
<body class="min-vh-100 d-flex flex-column m-0 p-0">
<header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="/assets/%D0%9A%D0%90%D0%99%D0%A4-Dbw7IVze.jpg" alt="Логотип"/></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown position-relative">
<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>
</header>
<div class="content flex-grow-1 p-3 px-4">
<h2>Популярные категории</h2>
<ol>
<li>Общение</li>
<li>Казик</li>
<li>Стрелялки</li>
<li>пупупу</li>
</ol>
</div>
<div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images d-flex gap-3 p-3">
<a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEcUlEQVR4nO2aX2wURRzH71GNSigSd5BAYmIwMTFGjfHVvvhm5E80QV980KqRRExnripwtgLyYDCaaJACUSFYQVBfjOFBia31wEM6v7tem0Na6l1pKdw1pbQ0ba9jfnu0ureztzO7e3s+3Df5JZd2Ojefnd+/mW0kUldddYUm8lbiHqO5ZyOhsJNQOE4YP00oJEzDzwyO4e8MltywqiW9IvJ/UsOWzN1GtOc1g/FuQnmRMBBKRnnRoPw3g0ETzlEzgOXRxLLS04Vx5cU7mEGhQBhvDR3oXgbPEcov+wWwATEYNhjfVHUAEkvcYVB+KGgACVD76q3dt1cFYk0LLEefrjYEWYohOIPJI1AIzDCEQio0CLZkydVbUw2BuRNhEK8BhCi5Ge8OxM3CiAlXGAr7/WenGkOQf3dmk/dCx2C41gBkyfgI1i5tELPNqPniwWqUv6cFgeRBVOzA3YtCQav6Y+8km+jFQ4Ni548jFlv7TlL6pZsPWse+8fXfjgtkJ3KWsRv3XawQK9CkDoINoGSS9s6rolyP7uqTfuGRM3nLuLODU9JxT3zQLxYWrHO+ftQZ2mC8S6P4ybvYPT+N2kAa92Z8gRzoumYZNz1bFOtivZXipKhU8THNOU1CT+RsIC8cHPQM8tTejJidt27HV/G8e6yw5AZf2QoXXS7cJS8gD2xPib6Rm5YxkzNF8cj7aYXA560qIMedJngw1iuKZf58Kj2hDYKuEx+4YXsobx7LqmUwyr9RcC34tdIk/aPWpzgztyD1aRnIfVEQL315SWQLszaIT34eU4MogfziDkLhz0qTfPG7NThR0ZM5V5DrN4viyvU5IRNmQ2UIZqbgc75Bnv74gm0hoxOz4v53UxVBZMKY2NLhnGqJLxAX10I7n522LQrTqC5IYWpeNH+bM11OC4YquJZ5ZeMyERYsmbb9MKwFsqjOC5Ni3Y5ejR3hHYE0i6uiYAavTEfPFsRDrWkbSOLSlOj4oyDyN+Rxgqn4sd3yLsFT+jUv2BQme3JPv5iYnpcuCotc+YL33wroNW8nRcvJYenfZq7MqO1MM6z31aKUGzZ32FKoaBHkvw9i4OqMbdz3PeNu8VFUPsfr3JY889lfYmxyThsE7fHdfeKaxNU2O7Q9ZnxQ6FSCKIHAqzpZ5OG2tPju/Liti3UDQXv58JBtbGJoqsKOwCt6x1zzGlMvLTZ+lDGbPkyrqiBoPZJ03ijpqg3G8yto310RHWFm0AVZNKwLCIWHqQ9PjYpPT4+JpiNDjuPRlQ7H8xZ7vn1A5lY7IrpCcoNBzitM0GZQyK6Mpe6MeFGls0noIEzhDFIRhvIDtYYglO+L+BVeVzqd4cPZCd61NjZ4m2+QEkyqAS+Uw98JgMAusS2vFRjvChEkHvhrBaubQXsIEJ8H5k5u2awaqdmgkPWdnbzUGbyL9dIBSAI6j8Vupdc6EYRu3do3mfGj/XoaOrF30m47qi0zuzXDekJ5G17Z4JF06R8GzM/mz9oIhWcDz0Z11VVXpJL+Aemdmrez0du5AAAAAElFTkSuQmCC" alt="vk"/>
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEnklEQVR4nO2aS2wbRRjHfae8xOuOqnbXalMkJLiAhDggBOVQaBFSpCKOoCJVnAoSQoKm0AMSJw6gIh4ioliigXbGjqzmUSVxaF4YE+okjpO6TrBD0zpOZuxde/dDM7YTO3bWM/auzcF/6bvsrmf3N99jvp21y9VRRx21TF39m4+6vfSEgkmPgqhHwWRYxXSSGyJDxWM97Jr9OP2I6/+kw1dSD7oxeVdB9LqKiKliCkKGiKlgOq4gcurIpbsPtBVAReQzFZO08MPvDbWhYnKu5UAKoicVRJNNA+wyBdOEG9NuxwEO9sG9KiK9dgNUASHyg3sQ9jkCcejXzcdURKechlB3bJIVD/shMJlrIQQUjMzZBsPCSUF0uvUQdNsztoQZi9c2QgDPGUx+ahKCnmw3hFq0hqsZWyecKLG17IWhDJwJavDM1YyFV2iioXWmsNg59/BdPgrvzWgQuG2ACQWdCWr1QqxH2huF1dZ+gBeHM/D1Yg7WtdLj7+jYSNb694impLzCeic7H/6Ij8LpaQ3GymZ/t3QDuJfqjaVg8o4wCG8AbQB4yWL2NV2vgAqlDLFxEQ0IQbAFSKqLlZz9XD4PscQaBOejoOm57eMXYzlBEGIe+C39cF0Q9Qp9vRGAl4uzf1ffK3gA1jfSEFpYgj/no7BFMxXnPgrpwvdyY3K8flhh0iM64BNls28lmsnC/M04zIQj8FdkCWhWq7rmxGidRMflRj4WyQ9PvYGOXivMfspi9pnyeQPiyX/hj3CEQ8wuLkNW06uvM4FPiioIomByUQCEXKv148NeCh+GdJ6UIiqFEQNgdiMaAz23kxPlCqcFEx1v58mgiEdqNohfzFXPZC2RsjAq2dzyLZ7ke+mXeF4ShE41DMLaCH8iD1s56zAqB2C2EFsBw7D24tlZ3QkQUjO0SnbIS+H4aBY+D+s8yTWjOoxKFo3/A6ZpnUdM3YGsI6HlkRn02FC6CoDZrcRa/TgEAMMEeLJfrtQrQskuUX5Ldjm0XAGxsnYbRBXZNOW8gQXLL9s8kx34g7HkNkRfcBkGltaFQS6vSCY6pnAQkdccaVGe86dhugjy3cQSXBoYgx9nYkIg529IJjomhlCLUggvOi47S55gjINcCCxA38Aot68CEd7VWunNcelEHxOC4CCInJIFOT1SKL3fjMxyCM9AAF7xJXlFqtX9MrGjT/kzsh55WxiEvbzIvlg93b8FU+FF6B2e4BBHfcmKNWhhs9o1N4lkoiOaetx/536XjNherKxXvpyMw8+7IErGSuzVROXq7l2VS3QFkbMuWe3HcJ+K6KrMjZ71bcDz3juWi+mF6E5r8Onf4omuNLr5wMS2YGS9ImJv/Z6F94Mab0QlQN5wNSMFk++dgJHLDdLbFAT3yiDsK351aguEguj1rn64x2WH+CLZjk1sRMK2f6JT/BsPsR2MFoJM2P5ZoTzMWrKpjci3toWTJRCm3awc2g9AV5uuTrJiNZ23/HZsrSKaUhD5RHrVtlPs5mwbs5A/xBAHIAZrAFnv1FaAWmLtNXtXYLPL3uLYK2nZHwYG2TF+zkteZcWj5iAdddSRywn9B9E5uZlJrzFcAAAAAElFTkSuQmCC" alt="tg"/>
</a>
</div>
</div>
</div>
</body>

180
dist/pageMain.html vendored Normal file
View File

@@ -0,0 +1,180 @@
<!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="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css"
integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" />
<link rel="stylesheet" crossorigin href="/assets/styleStreamingService-CUHvxLFI.css">
</head>
<body class="min-vh-100 d-flex flex-column m-0 p-0">
<header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="/assets/%D0%9A%D0%90%D0%99%D0%A4-Dbw7IVze.jpg" alt="Логотип" /></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown position-relative">
<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>
</header>
<div class="content flex-grow-1 p-3 px-4" id="content">
<p>Сейчас в эфире <i class="bi bi-cast"></i></p>
<form id="imageForm" class="mb-4">
<div class="photo-grid-container d-flex justify-content-center mb-2">
<div class="photo-grid d-flex align-items-center flex-wrap w-100">
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://steamuserimages-a.akamaihd.net/ugc/2462990917964003785/9E09A87AE9B299BC1F0FC1CBA9F20DB16289442A/?imw=512&amp;imh=298&amp;ima=fit&amp;impolicy=Letterbox&amp;imcolor=%23000000&amp;letterbox=true"
id="cs2"
/>
<label for="cs2"
><img
src="https://steamuserimages-a.akamaihd.net/ugc/2462990917964003785/9E09A87AE9B299BC1F0FC1CBA9F20DB16289442A/?imw=512&amp;imh=298&amp;ima=fit&amp;impolicy=Letterbox&amp;imcolor=%23000000&amp;letterbox=true"
alt="cs2"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://i.ytimg.com/vi/enyylQ9sFRc/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGGAgZShUMA8=&rs=AOn4CLAnYQfwEgcw2b2sKoCxOJE8xs0Hbg"
id="derzko"
/>
<label for="derzko"
><img
src="https://i.ytimg.com/vi/enyylQ9sFRc/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGGAgZShUMA8=&rs=AOn4CLAnYQfwEgcw2b2sKoCxOJE8xs0Hbg"
alt="derzko"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://vkplay.ru/pre_0x736_resize/hotbox/content_files/news/2020/02/12/fe52b98a1367439ea2be293fcf48224a.jpg?quality=85"
id="stardew"
/>
<label for="stardew"
><img
src="https://vkplay.ru/pre_0x736_resize/hotbox/content_files/news/2020/02/12/fe52b98a1367439ea2be293fcf48224a.jpg?quality=85"
alt="stardew"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://i.ytimg.com/vi/WCrXqI_0FhU/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGEwgWChlMA8=&rs=AOn4CLDIJ5NCb473i-I_fpiD4-G8TEPjLw"
id="teddy"
/>
<label for="teddy"
><img
src="https://i.ytimg.com/vi/WCrXqI_0FhU/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGEwgWChlMA8=&rs=AOn4CLDIJ5NCb473i-I_fpiD4-G8TEPjLw"
alt="teddy"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://i.pinimg.com/736x/a8/f1/c0/a8f1c04546867fbcd5eccd41c115fb51.jpg"
id="lofi_girl"
/>
<label for="lofi_girl"
><img
src="https://i.pinimg.com/736x/a8/f1/c0/a8f1c04546867fbcd5eccd41c115fb51.jpg"
alt="lofi_girl"
/></label>
</div>
</div>
</div>
<button type="submit" class="btn btn-primary">Смотреть позже</button>
</form>
<h3>Популярные каналы <i class="bi bi-patch-check-fill"></i></h3>
<ul>
<li>
<a href="pageAccount.html" target="_blank"
><em>ВЫ</em> самый популярный стример на данной платформе!!!</a
>
</li>
<li>какой-то стример 1</li>
<li>какой-то стример 2</li>
<li>ммм <b>МАРМОК</b></li>
</ul>
<h2>Смотреть позже <i class="bi bi-clock-fill"></i></h2>
<div class="photo-grid-container d-flex justify-content-center">
<div class="photo-grid d-flex align-items-center flex-wrap w-100" id="savedImagesGrid">
<div class="photo-grid-item">
<img
src="https://sun9-27.userapi.com/impf/c9811/u99622377/d_9475926f.jpg?quality=96&as=50x50,100x100&sign=a4fcc81d8c851f41a7f85dea825afc66&u=pHWjezk_9pOPyRtoH8161qsxD963pzSE2bk8P8vDAyE&cs=100x100"
alt="pusto"
/>
</div>
</div>
</div>
</div>
<div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images d-flex gap-3 p-3">
<a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEcUlEQVR4nO2aX2wURRzH71GNSigSd5BAYmIwMTFGjfHVvvhm5E80QV980KqRRExnripwtgLyYDCaaJACUSFYQVBfjOFBia31wEM6v7tem0Na6l1pKdw1pbQ0ba9jfnu0ureztzO7e3s+3Df5JZd2Ojefnd+/mW0kUldddYUm8lbiHqO5ZyOhsJNQOE4YP00oJEzDzwyO4e8MltywqiW9IvJ/UsOWzN1GtOc1g/FuQnmRMBBKRnnRoPw3g0ETzlEzgOXRxLLS04Vx5cU7mEGhQBhvDR3oXgbPEcov+wWwATEYNhjfVHUAEkvcYVB+KGgACVD76q3dt1cFYk0LLEefrjYEWYohOIPJI1AIzDCEQio0CLZkydVbUw2BuRNhEK8BhCi5Ge8OxM3CiAlXGAr7/WenGkOQf3dmk/dCx2C41gBkyfgI1i5tELPNqPniwWqUv6cFgeRBVOzA3YtCQav6Y+8km+jFQ4Ni548jFlv7TlL6pZsPWse+8fXfjgtkJ3KWsRv3XawQK9CkDoINoGSS9s6rolyP7uqTfuGRM3nLuLODU9JxT3zQLxYWrHO+ftQZ2mC8S6P4ybvYPT+N2kAa92Z8gRzoumYZNz1bFOtivZXipKhU8THNOU1CT+RsIC8cHPQM8tTejJidt27HV/G8e6yw5AZf2QoXXS7cJS8gD2xPib6Rm5YxkzNF8cj7aYXA560qIMedJngw1iuKZf58Kj2hDYKuEx+4YXsobx7LqmUwyr9RcC34tdIk/aPWpzgztyD1aRnIfVEQL315SWQLszaIT34eU4MogfziDkLhz0qTfPG7NThR0ZM5V5DrN4viyvU5IRNmQ2UIZqbgc75Bnv74gm0hoxOz4v53UxVBZMKY2NLhnGqJLxAX10I7n522LQrTqC5IYWpeNH+bM11OC4YquJZ5ZeMyERYsmbb9MKwFsqjOC5Ni3Y5ejR3hHYE0i6uiYAavTEfPFsRDrWkbSOLSlOj4oyDyN+Rxgqn4sd3yLsFT+jUv2BQme3JPv5iYnpcuCotc+YL33wroNW8nRcvJYenfZq7MqO1MM6z31aKUGzZ32FKoaBHkvw9i4OqMbdz3PeNu8VFUPsfr3JY889lfYmxyThsE7fHdfeKaxNU2O7Q9ZnxQ6FSCKIHAqzpZ5OG2tPju/Liti3UDQXv58JBtbGJoqsKOwCt6x1zzGlMvLTZ+lDGbPkyrqiBoPZJ03ijpqg3G8yto310RHWFm0AVZNKwLCIWHqQ9PjYpPT4+JpiNDjuPRlQ7H8xZ7vn1A5lY7IrpCcoNBzitM0GZQyK6Mpe6MeFGls0noIEzhDFIRhvIDtYYglO+L+BVeVzqd4cPZCd61NjZ4m2+QEkyqAS+Uw98JgMAusS2vFRjvChEkHvhrBaubQXsIEJ8H5k5u2awaqdmgkPWdnbzUGbyL9dIBSAI6j8Vupdc6EYRu3do3mfGj/XoaOrF30m47qi0zuzXDekJ5G17Z4JF06R8GzM/mz9oIhWcDz0Z11VVXpJL+Aemdmrez0du5AAAAAElFTkSuQmCC" alt="vk" />
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEnklEQVR4nO2aS2wbRRjHfae8xOuOqnbXalMkJLiAhDggBOVQaBFSpCKOoCJVnAoSQoKm0AMSJw6gIh4ioliigXbGjqzmUSVxaF4YE+okjpO6TrBD0zpOZuxde/dDM7YTO3bWM/auzcF/6bvsrmf3N99jvp21y9VRRx21TF39m4+6vfSEgkmPgqhHwWRYxXSSGyJDxWM97Jr9OP2I6/+kw1dSD7oxeVdB9LqKiKliCkKGiKlgOq4gcurIpbsPtBVAReQzFZO08MPvDbWhYnKu5UAKoicVRJNNA+wyBdOEG9NuxwEO9sG9KiK9dgNUASHyg3sQ9jkCcejXzcdURKechlB3bJIVD/shMJlrIQQUjMzZBsPCSUF0uvUQdNsztoQZi9c2QgDPGUx+ahKCnmw3hFq0hqsZWyecKLG17IWhDJwJavDM1YyFV2iioXWmsNg59/BdPgrvzWgQuG2ACQWdCWr1QqxH2huF1dZ+gBeHM/D1Yg7WtdLj7+jYSNb694impLzCeic7H/6Ij8LpaQ3GymZ/t3QDuJfqjaVg8o4wCG8AbQB4yWL2NV2vgAqlDLFxEQ0IQbAFSKqLlZz9XD4PscQaBOejoOm57eMXYzlBEGIe+C39cF0Q9Qp9vRGAl4uzf1ffK3gA1jfSEFpYgj/no7BFMxXnPgrpwvdyY3K8flhh0iM64BNls28lmsnC/M04zIQj8FdkCWhWq7rmxGidRMflRj4WyQ9PvYGOXivMfspi9pnyeQPiyX/hj3CEQ8wuLkNW06uvM4FPiioIomByUQCEXKv148NeCh+GdJ6UIiqFEQNgdiMaAz23kxPlCqcFEx1v58mgiEdqNohfzFXPZC2RsjAq2dzyLZ7ke+mXeF4ShE41DMLaCH8iD1s56zAqB2C2EFsBw7D24tlZ3QkQUjO0SnbIS+H4aBY+D+s8yTWjOoxKFo3/A6ZpnUdM3YGsI6HlkRn02FC6CoDZrcRa/TgEAMMEeLJfrtQrQskuUX5Ldjm0XAGxsnYbRBXZNOW8gQXLL9s8kx34g7HkNkRfcBkGltaFQS6vSCY6pnAQkdccaVGe86dhugjy3cQSXBoYgx9nYkIg529IJjomhlCLUggvOi47S55gjINcCCxA38Aot68CEd7VWunNcelEHxOC4CCInJIFOT1SKL3fjMxyCM9AAF7xJXlFqtX9MrGjT/kzsh55WxiEvbzIvlg93b8FU+FF6B2e4BBHfcmKNWhhs9o1N4lkoiOaetx/536XjNherKxXvpyMw8+7IErGSuzVROXq7l2VS3QFkbMuWe3HcJ+K6KrMjZ71bcDz3juWi+mF6E5r8Onf4omuNLr5wMS2YGS9ImJv/Z6F94Mab0QlQN5wNSMFk++dgJHLDdLbFAT3yiDsK351aguEguj1rn64x2WH+CLZjk1sRMK2f6JT/BsPsR2MFoJM2P5ZoTzMWrKpjci3toWTJRCm3awc2g9AV5uuTrJiNZ23/HZsrSKaUhD5RHrVtlPs5mwbs5A/xBAHIAZrAFnv1FaAWmLtNXtXYLPL3uLYK2nZHwYG2TF+zkteZcWj5iAdddSRywn9B9E5uZlJrzFcAAAAAElFTkSuQmCC" alt="tg" />
</a>
</div>
</div>
</div>
<script>
document.getElementById("imageForm").addEventListener("submit", (event) => {
event.preventDefault();
const selectedImages = Array.from(document.querySelectorAll('input[name="images"]:checked')).map(
(checkbox) => checkbox.value
);
const savedImagesGrid = document.getElementById("savedImagesGrid");
const initialImageSrc =
"https://sun9-27.userapi.com/impf/c9811/u99622377/d_9475926f.jpg?quality=96&as=50x50,100x100&sign=a4fcc81d8c851f41a7f85dea825afc66&u=pHWjezk_9pOPyRtoH8161qsxD963pzSE2bk8P8vDAyE&cs=100x100";
const existingImage = Array.from(savedImagesGrid.children).find((item) => {
const imgElement = item.querySelector("img");
return imgElement && imgElement.src === initialImageSrc;
});
if (existingImage) {
savedImagesGrid.removeChild(existingImage);
}
selectedImages.forEach((image) => {
const imageExists = Array.from(savedImagesGrid.children).some((item) => {
const imgElement = item.querySelector("img");
return imgElement && imgElement.src === image;
});
if (!imageExists) {
const item = document.createElement("div");
item.className = "photo-grid-item";
item.innerHTML = `<img src="${image}" alt="сохраненное изображение"/>`;
savedImagesGrid.appendChild(item);
}
});
});
</script>
</body>
</html>

79
dist/pageSavedStreams.html vendored Normal file
View File

@@ -0,0 +1,79 @@
<!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
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" />
<link rel="stylesheet" crossorigin href="/assets/styleStreamingService-CUHvxLFI.css">
</head>
<body class="min-vh-100 d-flex flex-column m-0 p-0">
<header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="/assets/%D0%9A%D0%90%D0%99%D0%A4-Dbw7IVze.jpg" alt="Логотип" /></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown position-relative">
<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>
</header>
<div class="content flex-grow-1 p-3 px-4">
<h2>Смотреть позже <i class="bi bi-clock-fill"></i></h2>
<div class="photo-grid-container d-flex justify-content-center">
<div class="photo-grid d-flex align-items-center flex-wrap w-100" id="savedImagesGrid">
<div class="photo-grid-item"><img src="/assets/2016-BUapLfv6.jpeg" alt="стрим ксго" /></div>
<div class="photo-grid-item"><img src="/assets/%D0%B0%D1%81%D0%BC%D1%80%20%D1%87%D0%B5%D0%BB%D0%BE%D0%B2%D0%B5%D0%BA%20%D0%BF%D0%B0%D1%83%D0%BA-RgZcxljT.webp" alt="асмр" /></div>
<div class="photo-grid-item"><img src="/assets/%D1%80%D0%B5%D0%B7%D0%BD%D1%8F-Du5Ks9ja.jpg" alt="резня" /></div>
</div>
</div>
<h2>Запланированные трансляции <i class="bi bi-calendar-event"></i></h2>
<div class="photo-grid-container d-flex justify-content-center">
<div class="photo-grid d-flex align-items-center flex-wrap w-100">
<div class="photo-grid-item"><img src="/assets/%D1%81%D1%82%D1%80%D0%B8%D0%BC%20%D0%BA%D1%81%D0%B3%D0%BE-d7c_w3u0.webp" alt="стрим ксго" /></div>
<div class="photo-grid-item"><img src="/assets/goats-D56R5-1i.png" alt="goats" /></div>
<div class="photo-grid-item"><img src="/assets/%D0%BF%D0%B0%D0%BF%D0%B0%D0%BD%D1%8F-BZOoCf1B.jpg" alt="папаня" /></div>
</div>
</div>
</div>
<div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images d-flex gap-3 p-3">
<a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEcUlEQVR4nO2aX2wURRzH71GNSigSd5BAYmIwMTFGjfHVvvhm5E80QV980KqRRExnripwtgLyYDCaaJACUSFYQVBfjOFBia31wEM6v7tem0Na6l1pKdw1pbQ0ba9jfnu0ureztzO7e3s+3Df5JZd2Ojefnd+/mW0kUldddYUm8lbiHqO5ZyOhsJNQOE4YP00oJEzDzwyO4e8MltywqiW9IvJ/UsOWzN1GtOc1g/FuQnmRMBBKRnnRoPw3g0ETzlEzgOXRxLLS04Vx5cU7mEGhQBhvDR3oXgbPEcov+wWwATEYNhjfVHUAEkvcYVB+KGgACVD76q3dt1cFYk0LLEefrjYEWYohOIPJI1AIzDCEQio0CLZkydVbUw2BuRNhEK8BhCi5Ge8OxM3CiAlXGAr7/WenGkOQf3dmk/dCx2C41gBkyfgI1i5tELPNqPniwWqUv6cFgeRBVOzA3YtCQav6Y+8km+jFQ4Ni548jFlv7TlL6pZsPWse+8fXfjgtkJ3KWsRv3XawQK9CkDoINoGSS9s6rolyP7uqTfuGRM3nLuLODU9JxT3zQLxYWrHO+ftQZ2mC8S6P4ybvYPT+N2kAa92Z8gRzoumYZNz1bFOtivZXipKhU8THNOU1CT+RsIC8cHPQM8tTejJidt27HV/G8e6yw5AZf2QoXXS7cJS8gD2xPib6Rm5YxkzNF8cj7aYXA560qIMedJngw1iuKZf58Kj2hDYKuEx+4YXsobx7LqmUwyr9RcC34tdIk/aPWpzgztyD1aRnIfVEQL315SWQLszaIT34eU4MogfziDkLhz0qTfPG7NThR0ZM5V5DrN4viyvU5IRNmQ2UIZqbgc75Bnv74gm0hoxOz4v53UxVBZMKY2NLhnGqJLxAX10I7n522LQrTqC5IYWpeNH+bM11OC4YquJZ5ZeMyERYsmbb9MKwFsqjOC5Ni3Y5ejR3hHYE0i6uiYAavTEfPFsRDrWkbSOLSlOj4oyDyN+Rxgqn4sd3yLsFT+jUv2BQme3JPv5iYnpcuCotc+YL33wroNW8nRcvJYenfZq7MqO1MM6z31aKUGzZ32FKoaBHkvw9i4OqMbdz3PeNu8VFUPsfr3JY889lfYmxyThsE7fHdfeKaxNU2O7Q9ZnxQ6FSCKIHAqzpZ5OG2tPju/Liti3UDQXv58JBtbGJoqsKOwCt6x1zzGlMvLTZ+lDGbPkyrqiBoPZJ03ijpqg3G8yto310RHWFm0AVZNKwLCIWHqQ9PjYpPT4+JpiNDjuPRlQ7H8xZ7vn1A5lY7IrpCcoNBzitM0GZQyK6Mpe6MeFGls0noIEzhDFIRhvIDtYYglO+L+BVeVzqd4cPZCd61NjZ4m2+QEkyqAS+Uw98JgMAusS2vFRjvChEkHvhrBaubQXsIEJ8H5k5u2awaqdmgkPWdnbzUGbyL9dIBSAI6j8Vupdc6EYRu3do3mfGj/XoaOrF30m47qi0zuzXDekJ5G17Z4JF06R8GzM/mz9oIhWcDz0Z11VVXpJL+Aemdmrez0du5AAAAAElFTkSuQmCC" alt="vk" />
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEnklEQVR4nO2aS2wbRRjHfae8xOuOqnbXalMkJLiAhDggBOVQaBFSpCKOoCJVnAoSQoKm0AMSJw6gIh4ioliigXbGjqzmUSVxaF4YE+okjpO6TrBD0zpOZuxde/dDM7YTO3bWM/auzcF/6bvsrmf3N99jvp21y9VRRx21TF39m4+6vfSEgkmPgqhHwWRYxXSSGyJDxWM97Jr9OP2I6/+kw1dSD7oxeVdB9LqKiKliCkKGiKlgOq4gcurIpbsPtBVAReQzFZO08MPvDbWhYnKu5UAKoicVRJNNA+wyBdOEG9NuxwEO9sG9KiK9dgNUASHyg3sQ9jkCcejXzcdURKechlB3bJIVD/shMJlrIQQUjMzZBsPCSUF0uvUQdNsztoQZi9c2QgDPGUx+ahKCnmw3hFq0hqsZWyecKLG17IWhDJwJavDM1YyFV2iioXWmsNg59/BdPgrvzWgQuG2ACQWdCWr1QqxH2huF1dZ+gBeHM/D1Yg7WtdLj7+jYSNb694impLzCeic7H/6Ij8LpaQ3GymZ/t3QDuJfqjaVg8o4wCG8AbQB4yWL2NV2vgAqlDLFxEQ0IQbAFSKqLlZz9XD4PscQaBOejoOm57eMXYzlBEGIe+C39cF0Q9Qp9vRGAl4uzf1ffK3gA1jfSEFpYgj/no7BFMxXnPgrpwvdyY3K8flhh0iM64BNls28lmsnC/M04zIQj8FdkCWhWq7rmxGidRMflRj4WyQ9PvYGOXivMfspi9pnyeQPiyX/hj3CEQ8wuLkNW06uvM4FPiioIomByUQCEXKv148NeCh+GdJ6UIiqFEQNgdiMaAz23kxPlCqcFEx1v58mgiEdqNohfzFXPZC2RsjAq2dzyLZ7ke+mXeF4ShE41DMLaCH8iD1s56zAqB2C2EFsBw7D24tlZ3QkQUjO0SnbIS+H4aBY+D+s8yTWjOoxKFo3/A6ZpnUdM3YGsI6HlkRn02FC6CoDZrcRa/TgEAMMEeLJfrtQrQskuUX5Ldjm0XAGxsnYbRBXZNOW8gQXLL9s8kx34g7HkNkRfcBkGltaFQS6vSCY6pnAQkdccaVGe86dhugjy3cQSXBoYgx9nYkIg529IJjomhlCLUggvOi47S55gjINcCCxA38Aot68CEd7VWunNcelEHxOC4CCInJIFOT1SKL3fjMxyCM9AAF7xJXlFqtX9MrGjT/kzsh55WxiEvbzIvlg93b8FU+FF6B2e4BBHfcmKNWhhs9o1N4lkoiOaetx/536XjNherKxXvpyMw8+7IErGSuzVROXq7l2VS3QFkbMuWe3HcJ+K6KrMjZ71bcDz3juWi+mF6E5r8Onf4omuNLr5wMS2YGS9ImJv/Z6F94Mab0QlQN5wNSMFk++dgJHLDdLbFAT3yiDsK351aguEguj1rn64x2WH+CLZjk1sRMK2f6JT/BsPsR2MFoJM2P5ZoTzMWrKpjci3toWTJRCm3awc2g9AV5uuTrJiNZ23/HZsrSKaUhD5RHrVtlPs5mwbs5A/xBAHIAZrAFnv1FaAWmLtNXtXYLPL3uLYK2nZHwYG2TF+zkteZcWj5iAdddSRywn9B9E5uZlJrzFcAAAAAElFTkSuQmCC" alt="tg" />
</a>
</div>
</div>
</div>
<!-- <script>
const savedImages = JSON.parse(localStorage.getItem("savedImages")) || [];
const savedImagesGrid = document.getElementById("savedImagesGrid");
savedImages.forEach((image) => {
console.log(image);
const item = document.createElement("div");
item.className = "photo-grid-item";
item.innerHTML = `<img src="${image}" alt="сохраненное изображение"/>`;
savedImagesGrid.appendChild(item);
});
</script> -->
</body>
</html>

54
dist/pageSubscriptions.html vendored Normal file
View File

@@ -0,0 +1,54 @@
<!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 href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
<link rel="stylesheet" crossorigin href="/assets/styleStreamingService-CUHvxLFI.css">
</head>
<body class="min-vh-100 d-flex flex-column m-0 p-0">
<header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="/assets/%D0%9A%D0%90%D0%99%D0%A4-Dbw7IVze.jpg" alt="Логотип"/></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1>
</div>
<nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a>
<nav class="dropdown position-relative">
<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>
</header>
<div class="content flex-grow-1 p-3 px-4">
<h2>Ваши подписки <i class="bi bi-bookmark-heart-fill"></i></h2>
<ol>
<li>НОРМ канал</li>
<div class="subButtons d-flex"><div class="button">Вы подписаны</div></div>
<li>САМЫЙ КРУТОЙ КАНАЛ</li>
<div class="subButtons d-flex"><div class="button blue-button">Вы спонсор</div></div>
<li>ПРОСТО КРУТОЙ канал</li>
<div class="subButtons d-flex"><div class="button">Вы подписаны</div></div>
</ol>
</div>
<div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images d-flex gap-3 p-3">
<a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEcUlEQVR4nO2aX2wURRzH71GNSigSd5BAYmIwMTFGjfHVvvhm5E80QV980KqRRExnripwtgLyYDCaaJACUSFYQVBfjOFBia31wEM6v7tem0Na6l1pKdw1pbQ0ba9jfnu0ureztzO7e3s+3Df5JZd2Ojefnd+/mW0kUldddYUm8lbiHqO5ZyOhsJNQOE4YP00oJEzDzwyO4e8MltywqiW9IvJ/UsOWzN1GtOc1g/FuQnmRMBBKRnnRoPw3g0ETzlEzgOXRxLLS04Vx5cU7mEGhQBhvDR3oXgbPEcov+wWwATEYNhjfVHUAEkvcYVB+KGgACVD76q3dt1cFYk0LLEefrjYEWYohOIPJI1AIzDCEQio0CLZkydVbUw2BuRNhEK8BhCi5Ge8OxM3CiAlXGAr7/WenGkOQf3dmk/dCx2C41gBkyfgI1i5tELPNqPniwWqUv6cFgeRBVOzA3YtCQav6Y+8km+jFQ4Ni548jFlv7TlL6pZsPWse+8fXfjgtkJ3KWsRv3XawQK9CkDoINoGSS9s6rolyP7uqTfuGRM3nLuLODU9JxT3zQLxYWrHO+ftQZ2mC8S6P4ybvYPT+N2kAa92Z8gRzoumYZNz1bFOtivZXipKhU8THNOU1CT+RsIC8cHPQM8tTejJidt27HV/G8e6yw5AZf2QoXXS7cJS8gD2xPib6Rm5YxkzNF8cj7aYXA560qIMedJngw1iuKZf58Kj2hDYKuEx+4YXsobx7LqmUwyr9RcC34tdIk/aPWpzgztyD1aRnIfVEQL315SWQLszaIT34eU4MogfziDkLhz0qTfPG7NThR0ZM5V5DrN4viyvU5IRNmQ2UIZqbgc75Bnv74gm0hoxOz4v53UxVBZMKY2NLhnGqJLxAX10I7n522LQrTqC5IYWpeNH+bM11OC4YquJZ5ZeMyERYsmbb9MKwFsqjOC5Ni3Y5ejR3hHYE0i6uiYAavTEfPFsRDrWkbSOLSlOj4oyDyN+Rxgqn4sd3yLsFT+jUv2BQme3JPv5iYnpcuCotc+YL33wroNW8nRcvJYenfZq7MqO1MM6z31aKUGzZ32FKoaBHkvw9i4OqMbdz3PeNu8VFUPsfr3JY889lfYmxyThsE7fHdfeKaxNU2O7Q9ZnxQ6FSCKIHAqzpZ5OG2tPju/Liti3UDQXv58JBtbGJoqsKOwCt6x1zzGlMvLTZ+lDGbPkyrqiBoPZJ03ijpqg3G8yto310RHWFm0AVZNKwLCIWHqQ9PjYpPT4+JpiNDjuPRlQ7H8xZ7vn1A5lY7IrpCcoNBzitM0GZQyK6Mpe6MeFGls0noIEzhDFIRhvIDtYYglO+L+BVeVzqd4cPZCd61NjZ4m2+QEkyqAS+Uw98JgMAusS2vFRjvChEkHvhrBaubQXsIEJ8H5k5u2awaqdmgkPWdnbzUGbyL9dIBSAI6j8Vupdc6EYRu3do3mfGj/XoaOrF30m47qi0zuzXDekJ5G17Z4JF06R8GzM/mz9oIhWcDz0Z11VVXpJL+Aemdmrez0du5AAAAAElFTkSuQmCC" alt="vk"/>
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEnklEQVR4nO2aS2wbRRjHfae8xOuOqnbXalMkJLiAhDggBOVQaBFSpCKOoCJVnAoSQoKm0AMSJw6gIh4ioliigXbGjqzmUSVxaF4YE+okjpO6TrBD0zpOZuxde/dDM7YTO3bWM/auzcF/6bvsrmf3N99jvp21y9VRRx21TF39m4+6vfSEgkmPgqhHwWRYxXSSGyJDxWM97Jr9OP2I6/+kw1dSD7oxeVdB9LqKiKliCkKGiKlgOq4gcurIpbsPtBVAReQzFZO08MPvDbWhYnKu5UAKoicVRJNNA+wyBdOEG9NuxwEO9sG9KiK9dgNUASHyg3sQ9jkCcejXzcdURKechlB3bJIVD/shMJlrIQQUjMzZBsPCSUF0uvUQdNsztoQZi9c2QgDPGUx+ahKCnmw3hFq0hqsZWyecKLG17IWhDJwJavDM1YyFV2iioXWmsNg59/BdPgrvzWgQuG2ACQWdCWr1QqxH2huF1dZ+gBeHM/D1Yg7WtdLj7+jYSNb694impLzCeic7H/6Ij8LpaQ3GymZ/t3QDuJfqjaVg8o4wCG8AbQB4yWL2NV2vgAqlDLFxEQ0IQbAFSKqLlZz9XD4PscQaBOejoOm57eMXYzlBEGIe+C39cF0Q9Qp9vRGAl4uzf1ffK3gA1jfSEFpYgj/no7BFMxXnPgrpwvdyY3K8flhh0iM64BNls28lmsnC/M04zIQj8FdkCWhWq7rmxGidRMflRj4WyQ9PvYGOXivMfspi9pnyeQPiyX/hj3CEQ8wuLkNW06uvM4FPiioIomByUQCEXKv148NeCh+GdJ6UIiqFEQNgdiMaAz23kxPlCqcFEx1v58mgiEdqNohfzFXPZC2RsjAq2dzyLZ7ke+mXeF4ShE41DMLaCH8iD1s56zAqB2C2EFsBw7D24tlZ3QkQUjO0SnbIS+H4aBY+D+s8yTWjOoxKFo3/A6ZpnUdM3YGsI6HlkRn02FC6CoDZrcRa/TgEAMMEeLJfrtQrQskuUX5Ldjm0XAGxsnYbRBXZNOW8gQXLL9s8kx34g7HkNkRfcBkGltaFQS6vSCY6pnAQkdccaVGe86dhugjy3cQSXBoYgx9nYkIg529IJjomhlCLUggvOi47S55gjINcCCxA38Aot68CEd7VWunNcelEHxOC4CCInJIFOT1SKL3fjMxyCM9AAF7xJXlFqtX9MrGjT/kzsh55WxiEvbzIvlg93b8FU+FF6B2e4BBHfcmKNWhhs9o1N4lkoiOaetx/536XjNherKxXvpyMw8+7IErGSuzVROXq7l2VS3QFkbMuWe3HcJ+K6KrMjZ71bcDz3juWi+mF6E5r8Onf4omuNLr5wMS2YGS9ImJv/Z6F94Mab0QlQN5wNSMFk++dgJHLDdLbFAT3yiDsK351aguEguj1rn64x2WH+CLZjk1sRMK2f6JT/BsPsR2MFoJM2P5ZoTzMWrKpjci3toWTJRCm3awc2g9AV5uuTrJiNZ23/HZsrSKaUhD5RHrVtlPs5mwbs5A/xBAHIAZrAFnv1FaAWmLtNXtXYLPL3uLYK2nZHwYG2TF+zkteZcWj5iAdddSRywn9B9E5uZlJrzFcAAAAAElFTkSuQmCC" alt="tg"/>
</a>
</div>
</div>
</div>
</body>

8085
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

27
package.json Normal file
View File

@@ -0,0 +1,27 @@
{
"name": "pibd-23_sheymuhov_a.i._internet_programming",
"version": "1.0.0",
"type": "module",
"scripts": {
"start": "vite",
"build": "vite build",
"serve": "http-server -p 4000 ./dist/",
"prod": "npm-run-all build serve",
"lint": "eslint . --ext js --report-unused-disable-directives --max-warnings 0"
},
"dependencies": {
"bootstrap": "5.3.3",
"bootstrap-icons": "1.11.3"
},
"devDependencies": {
"eslint": "8.56.0",
"eslint-config-airbnb-base": "15.0.0",
"eslint-config-prettier": "10.0.2",
"eslint-plugin-html": "8.1.2",
"eslint-plugin-import": "2.31.0",
"eslint-plugin-prettier": "5.2.3",
"http-server": "14.1.1",
"npm-run-all": "^4.1.5",
"vite": "6.2.0"
}
}

46
pageAccount.html
View File

@@ -4,43 +4,49 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Мой аккаунт</title> <title>Мой аккаунт</title>
<link rel="stylesheet" href="styleStreamingService.css" /> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
<link rel="stylesheet" href="styleStreamingService.css"/>
</head> </head>
<body> <body class="min-vh-100 d-flex flex-column m-0 p-0">
<div class="header"> <header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo"> <div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a> <a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"/></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1> <h1>НАЗВАНИЕ СЕРВИСА</h1>
</div> </div>
<nav class="navbar"> <nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a> <a href="pageCategories.html">Категории</a>
<nav class="dropdown"> <nav class="dropdown position-relative">
<span><a>Мой аккаунт ▾</a></span> <span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu"> <nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav> <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="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav> <nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav> </nav>
</nav> </nav>
</nav> </nav>
</div> </header>
<div class="content"> <div class="content flex-grow-1 p-3 px-4">
<h2><em>Ваш никнейм</em></h2> <h2><em>Ваш никнейм</em> <i class="bi bi-patch-check-fill"></i></h2>
<div class="avatar"><img src="Resources\derzko.webp" alt="derzko"></div> <div class="avatar d-flex"><img src="Resources\derzko.webp" alt="derzko" /></div>
<p>ПОЛ МИЛЛИОНА ПОДПИЩИКОВ</p> <p>ПОЛ МИЛЛИОНА ПОДПИЩИКОВ</p>
<div class="header-logo"> <div class="buttons d-flex align-items-center gap-3">
<div class="button">Выйти из аккаунта</div> <div class="button">Выйти из аккаунта</div>
<div class="button">Сменить пароль</div> <div class="button">Сменить пароль</div>
</div> </div>
</div> </div>
<div class="footer"> <div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content"> <div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name">RBCS CORP.</div> <div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images"> <div class="footer-images d-flex gap-3 p-3">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image"> <a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image"> <img src="Resources\vk_icon.png" alt="vk"/>
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="Resources\tg_icon.png" alt="tg"/>
</a>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

40
pageCategories.html
View File

@@ -4,27 +4,29 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Популярные категории</title> <title>Популярные категории</title>
<link rel="stylesheet" href="styleStreamingService.css" /> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
<link rel="stylesheet" href="styleStreamingService.css"/>
</head> </head>
<body> <body class="min-vh-100 d-flex flex-column m-0 p-0">
<div class="header"> <header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo"> <div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a> <a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"/></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1> <h1>НАЗВАНИЕ СЕРВИСА</h1>
</div> </div>
<nav class="navbar"> <nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a> <a href="pageCategories.html">Категории</a>
<nav class="dropdown"> <nav class="dropdown position-relative">
<span><a>Мой аккаунт ▾</a></span> <span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu"> <nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav> <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="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav> <nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav> </nav>
</nav> </nav>
</nav> </nav>
</div> </header>
<div class="content"> <div class="content flex-grow-1 p-3 px-4">
<h2>Популярные категории</h2> <h2>Популярные категории</h2>
<ol> <ol>
<li>Общение</li> <li>Общение</li>
@@ -33,14 +35,18 @@
<li>пупупу</li> <li>пупупу</li>
</ol> </ol>
</div> </div>
<div class="footer"> <div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content"> <div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name">RBCS CORP.</div> <div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images"> <div class="footer-images d-flex gap-3 p-3">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image"> <a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image"> <img src="Resources\vk_icon.png" alt="vk"/>
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="Resources\tg_icon.png" alt="tg"/>
</a>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

182
pageMain.html
View File

@@ -1,56 +1,180 @@
<!DOCTYPE html> <!doctype html>
<html lang="ru"> <html lang="ru">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Главная</title> <title>Главная</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css"
integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" />
<link rel="stylesheet" href="styleStreamingService.css" /> <link rel="stylesheet" href="styleStreamingService.css" />
</head> </head>
<body> <body class="min-vh-100 d-flex flex-column m-0 p-0">
<div class="header"> <header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo"> <div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a> <a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип" /></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1> <h1>НАЗВАНИЕ СЕРВИСА</h1>
</div> </div>
<nav class="navbar"> <nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a> <a href="pageCategories.html">Категории</a>
<nav class="dropdown"> <nav class="dropdown position-relative">
<span><a>Мой аккаунт ▾</a></span> <span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu"> <nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav> <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="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav> <nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav> </nav>
</nav> </nav>
</nav> </nav>
</div> </header>
<div class="content"> <div class="content flex-grow-1 p-3 px-4" id="content">
<p>Сейчас в эфире</p> <p>Сейчас в эфире <i class="bi bi-cast"></i></p>
<div class="photo-grid-container"> <form id="imageForm" class="mb-4">
<div class="photo-grid"> <div class="photo-grid-container d-flex justify-content-center mb-2">
<div class="photo-grid-item"><img src="Resources\cs2.webp" alt="cs2"></div> <div class="photo-grid d-flex align-items-center flex-wrap w-100">
<div class="photo-grid-item"><img src="Resources\derzko.webp" alt="derzko"></div> <div class="photo-grid-item">
<div class="photo-grid-item"><img src="Resources\stardew.webp" alt="stardew"></div> <input
<div class="photo-grid-item"><img src="Resources\teddy.jpg" alt="teddy"></div> type="checkbox"
<div class="photo-grid-item"><img src="Resources\lofi_girl.jpg" alt="lofi_girl"></div> name="images"
value="https://steamuserimages-a.akamaihd.net/ugc/2462990917964003785/9E09A87AE9B299BC1F0FC1CBA9F20DB16289442A/?imw=512&amp;imh=298&amp;ima=fit&amp;impolicy=Letterbox&amp;imcolor=%23000000&amp;letterbox=true"
id="cs2"
/>
<label for="cs2"
><img
src="https://steamuserimages-a.akamaihd.net/ugc/2462990917964003785/9E09A87AE9B299BC1F0FC1CBA9F20DB16289442A/?imw=512&amp;imh=298&amp;ima=fit&amp;impolicy=Letterbox&amp;imcolor=%23000000&amp;letterbox=true"
alt="cs2"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://i.ytimg.com/vi/enyylQ9sFRc/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGGAgZShUMA8=&rs=AOn4CLAnYQfwEgcw2b2sKoCxOJE8xs0Hbg"
id="derzko"
/>
<label for="derzko"
><img
src="https://i.ytimg.com/vi/enyylQ9sFRc/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGGAgZShUMA8=&rs=AOn4CLAnYQfwEgcw2b2sKoCxOJE8xs0Hbg"
alt="derzko"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://vkplay.ru/pre_0x736_resize/hotbox/content_files/news/2020/02/12/fe52b98a1367439ea2be293fcf48224a.jpg?quality=85"
id="stardew"
/>
<label for="stardew"
><img
src="https://vkplay.ru/pre_0x736_resize/hotbox/content_files/news/2020/02/12/fe52b98a1367439ea2be293fcf48224a.jpg?quality=85"
alt="stardew"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://i.ytimg.com/vi/WCrXqI_0FhU/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGEwgWChlMA8=&rs=AOn4CLDIJ5NCb473i-I_fpiD4-G8TEPjLw"
id="teddy"
/>
<label for="teddy"
><img
src="https://i.ytimg.com/vi/WCrXqI_0FhU/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AH-CYAC0AWKAgwIABABGEwgWChlMA8=&rs=AOn4CLDIJ5NCb473i-I_fpiD4-G8TEPjLw"
alt="teddy"
/></label>
</div>
<div class="photo-grid-item">
<input
type="checkbox"
name="images"
value="https://i.pinimg.com/736x/a8/f1/c0/a8f1c04546867fbcd5eccd41c115fb51.jpg"
id="lofi_girl"
/>
<label for="lofi_girl"
><img
src="https://i.pinimg.com/736x/a8/f1/c0/a8f1c04546867fbcd5eccd41c115fb51.jpg"
alt="lofi_girl"
/></label>
</div>
</div>
</div> </div>
</div> <button type="submit" class="btn btn-primary">Смотреть позже</button>
<h3>Популярные каналы</h3> </form>
<h3>Популярные каналы <i class="bi bi-patch-check-fill"></i></h3>
<ul> <ul>
<li><a href="pageAccount.html" target="_blank"><em>ВЫ</em> самый популярный стример на данной платформе!!!</a></li> <li>
<a href="pageAccount.html" target="_blank"
><em>ВЫ</em> самый популярный стример на данной платформе!!!</a
>
</li>
<li>какой-то стример 1</li> <li>какой-то стример 1</li>
<li>какой-то стример 2</li> <li>какой-то стример 2</li>
<li>ммм <b>МАРМОК</b></li> <li>ммм <b>МАРМОК</b></li>
</ul> </ul>
</div> <h2>Смотреть позже <i class="bi bi-clock-fill"></i></h2>
<div class="footer"> <div class="photo-grid-container d-flex justify-content-center">
<div class="footer-content"> <div class="photo-grid d-flex align-items-center flex-wrap w-100" id="savedImagesGrid">
<div class="company-name">RBCS CORP.</div> <div class="photo-grid-item">
<div class="footer-images"> <img
<a href="https://vk.com/sheym_not_shame" target="_blank"><img src="Resources\vk_icon.png" alt="vk" class="footer-image"></a> src="https://sun9-27.userapi.com/impf/c9811/u99622377/d_9475926f.jpg?quality=96&as=50x50,100x100&sign=a4fcc81d8c851f41a7f85dea825afc66&u=pHWjezk_9pOPyRtoH8161qsxD963pzSE2bk8P8vDAyE&cs=100x100"
<a href="https://t.me/sheymuh" target="_blank"><img src="Resources\tg_icon.png" alt="tg" class="footer-image"></a> alt="pusto"
/>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images d-flex gap-3 p-3">
<a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="Resources\vk_icon.png" alt="vk" />
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="Resources\tg_icon.png" alt="tg" />
</a>
</div>
</div>
</div>
<script>
document.getElementById("imageForm").addEventListener("submit", (event) => {
event.preventDefault();
const selectedImages = Array.from(document.querySelectorAll('input[name="images"]:checked')).map(
(checkbox) => checkbox.value
);
const savedImagesGrid = document.getElementById("savedImagesGrid");
const initialImageSrc =
"https://sun9-27.userapi.com/impf/c9811/u99622377/d_9475926f.jpg?quality=96&as=50x50,100x100&sign=a4fcc81d8c851f41a7f85dea825afc66&u=pHWjezk_9pOPyRtoH8161qsxD963pzSE2bk8P8vDAyE&cs=100x100";
const existingImage = Array.from(savedImagesGrid.children).find((item) => {
const imgElement = item.querySelector("img");
return imgElement && imgElement.src === initialImageSrc;
});
if (existingImage) {
savedImagesGrid.removeChild(existingImage);
}
selectedImages.forEach((image) => {
const imageExists = Array.from(savedImagesGrid.children).some((item) => {
const imgElement = item.querySelector("img");
return imgElement && imgElement.src === image;
});
if (!imageExists) {
const item = document.createElement("div");
item.className = "photo-grid-item";
item.innerHTML = `<img src="${image}" alt="сохраненное изображение"/>`;
savedImagesGrid.appendChild(item);
}
});
});
</script>
</body> </body>
</html> </html>

82
pageSavedStreams.html
View File

@@ -1,55 +1,79 @@
<!DOCTYPE html> <!doctype html>
<html lang="ru"> <html lang="ru">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Сохранённые трансляции</title> <title>Сохранённые трансляции</title>
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" />
<link rel="stylesheet" href="styleStreamingService.css" /> <link rel="stylesheet" href="styleStreamingService.css" />
</head> </head>
<body> <body class="min-vh-100 d-flex flex-column m-0 p-0">
<div class="header"> <header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo"> <div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a> <a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип" /></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1> <h1>НАЗВАНИЕ СЕРВИСА</h1>
</div> </div>
<nav class="navbar"> <nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a> <a href="pageCategories.html">Категории</a>
<nav class="dropdown"> <nav class="dropdown position-relative">
<span><a>Мой аккаунт ▾</a></span> <span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu"> <nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav> <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="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav> <nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav> </nav>
</nav> </nav>
</nav> </nav>
</div> </header>
<div class="content"> <div class="content flex-grow-1 p-3 px-4">
<h2>Запланированные трансляции</h2> <h2>Смотреть позже <i class="bi bi-clock-fill"></i></h2>
<div class="photo-grid-container"> <div class="photo-grid-container d-flex justify-content-center">
<div class="photo-grid"> <div class="photo-grid d-flex align-items-center flex-wrap w-100" id="savedImagesGrid">
<div class="photo-grid-item"><img src="Resources\стрим ксго.webp" alt="стрим ксго"></div> <div class="photo-grid-item"><img src="Resources\2016.jpeg" alt="стрим ксго" /></div>
<div class="photo-grid-item"><img src="Resources\goats.png" alt="goats"></div> <div class="photo-grid-item"><img src="Resources\асмр человек паук.webp" alt="асмр" /></div>
<div class="photo-grid-item"><img src="Resources\папаня.jpg" alt="папаня"></div> <div class="photo-grid-item"><img src="Resources\резня.jpg" alt="резня" /></div>
</div> </div>
</div> </div>
<h2>Смотреть позже</h2> <h2>Запланированные трансляции <i class="bi bi-calendar-event"></i></h2>
<div class="photo-grid-container"> <div class="photo-grid-container d-flex justify-content-center">
<div class="photo-grid"> <div class="photo-grid d-flex align-items-center flex-wrap w-100">
<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\асмр человек паук.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 class="photo-grid-item"><img src="Resources\папаня.jpg" alt="папаня" /></div>
</div> </div>
</div> </div>
</div> </div>
<div class="footer"> <div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content"> <div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name">RBCS CORP.</div> <div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images"> <div class="footer-images d-flex gap-3 p-3">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image"> <a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image"> <img src="Resources\vk_icon.png" alt="vk" />
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="Resources\tg_icon.png" alt="tg" />
</a>
</div> </div>
</div> </div>
</div> </div>
<!-- <script>
const savedImages = JSON.parse(localStorage.getItem("savedImages")) || [];
const savedImagesGrid = document.getElementById("savedImagesGrid");
savedImages.forEach((image) => {
console.log(image);
const item = document.createElement("div");
item.className = "photo-grid-item";
item.innerHTML = `<img src="${image}" alt="сохраненное изображение"/>`;
savedImagesGrid.appendChild(item);
});
</script> -->
</body> </body>
</html> </html>

48
pageSubscriptions.html
View File

@@ -4,45 +4,51 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Подписки</title> <title>Подписки</title>
<link rel="stylesheet" href="styleStreamingService.css" /> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
<link rel="stylesheet" href="styleStreamingService.css"/>
</head> </head>
<body> <body class="min-vh-100 d-flex flex-column m-0 p-0">
<div class="header"> <header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
<div class="header-logo"> <div class="header-logo d-flex align-items-center g-3">
<a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"></a> <a href="pageMain.html"><img src="Resources\КАЙФ.jpg" alt="Логотип"/></a>
<h1>НАЗВАНИЕ СЕРВИСА</h1> <h1>НАЗВАНИЕ СЕРВИСА</h1>
</div> </div>
<nav class="navbar"> <nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
<a href="pageCategories.html">Категории</a> <a href="pageCategories.html">Категории</a>
<nav class="dropdown"> <nav class="dropdown position-relative">
<span><a>Мой аккаунт ▾</a></span> <span><a>Мой аккаунт ▾</a></span>
<nav class="features-menu"> <nav class="features-menu">
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav> <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="pageSubscriptions.html">Подписки</a></nav>
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav> <nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
</nav> </nav>
</nav> </nav>
</nav> </nav>
</div> </header>
<div class="content"> <div class="content flex-grow-1 p-3 px-4">
<h2>Ваши подписки</h2> <h2>Ваши подписки <i class="bi bi-bookmark-heart-fill"></i></h2>
<ol> <ol>
<li>НОРМ канал</li> <li>НОРМ канал</li>
<div class="subButtons"><div class="button">Вы подписаны</div></div> <div class="subButtons d-flex"><div class="button">Вы подписаны</div></div>
<li>САМЫЙ КРУТОЙ КАНАЛ</li> <li>САМЫЙ КРУТОЙ КАНАЛ</li>
<div class="subButtons"><div class="button blue-button">Вы спонсор</div></div> <div class="subButtons d-flex"><div class="button blue-button">Вы спонсор</div></div>
<li>ПРОСТО КРУТОЙ канал</li> <li>ПРОСТО КРУТОЙ канал</li>
<div class="subButtons"><div class="button">Вы подписаны</div></div> <div class="subButtons d-flex"><div class="button">Вы подписаны</div></div>
</ol> </ol>
</div> </div>
<div class="footer"> <div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
<div class="footer-content"> <div class="footer-content d-flex justify-content-between align-items-center">
<div class="company-name">RBCS CORP.</div> <div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
<div class="footer-images"> <div class="footer-images d-flex gap-3 p-3">
<img src="Resources\vk_icon.png" alt="vk" class="footer-image"> <a href="https://vk.com/sheym_not_shame" target="_blank">
<img src="Resources\tg_icon.png" alt="tg" class="footer-image"> <img src="Resources\vk_icon.png" alt="vk"/>
</a>
<a href="https://t.me/sheymuh" target="_blank">
<img src="Resources\tg_icon.png" alt="tg"/>
</a>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

104
styleStreamingService.css
View File

@@ -1,11 +1,6 @@
body { body {
display: flex;
flex-direction: column;
min-height: 100vh;
font-family: "Helvetica", "Arial", sans-serif; font-family: "Helvetica", "Arial", sans-serif;
font-size: 18px; font-size: 18px;
margin: 0;
padding: 0;
background-color: #ade8f4; background-color: #ade8f4;
} }
@@ -23,25 +18,27 @@ h2 {
/* Мобильное устройство (ширина области отображения от 0 до 400px)*/ /* Мобильное устройство (ширина области отображения от 0 до 400px)*/
@media only screen and (max-width: 400px) { @media only screen and (max-width: 400px) {
h1 { h1 {
font-size: 1em;; font-size: 1em;
} }
h2, h3, p { h2,
h3,
p {
text-align: center; text-align: center;
} }
.header {
gap: 20px;
}
.navbar { .navbar {
flex-direction: column; flex-direction: column;
align-self: center; align-self: center;
row-gap: 5px; row-gap: 5px;
} }
.navbar a { .navbar a {
height: 10px; height: 30px;
} }
.dropdown:hover .features-menu { .dropdown:hover .features-menu {
height: max-content; height: max-content;
row-gap: 10px; }
.features-item a {
height: 40px;
text-align: start;
} }
.avatar { .avatar {
justify-content: center; justify-content: center;
@@ -63,13 +60,6 @@ h2 {
body { body {
justify-content: center; justify-content: center;
} }
.header {
gap: 20px;
}
}
.subButtons {
display: flex;
} }
.button { .button {
@@ -97,48 +87,28 @@ h2 {
background: #016296; background: #016296;
} }
.header { header {
display: flex;
top: 0;
left: 0;
height: 60px;
position: sticky;
background-color: #00b4d8; background-color: #00b4d8;
color: #081c15; color: #081c15;
align-items: center;
justify-content: space-between;
padding: 10px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
} }
.header-logo {
display: flex;
align-items: center;
gap: 15px;
}
.header-logo img { .header-logo img {
width: 50px; width: 50px;
height: auto; height: auto;
} margin: 5px;
.navbar {
display: flex;
justify-content: center;
column-gap: 15px;
margin-right: 20px;
} }
.navbar a { .navbar a {
display: flex; display: flex;
text-decoration: none; text-decoration: none;
width: fit-content;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 8px 15px;
width: fit-content;
color: #081c15; color: #081c15;
font-weight: bold; font-weight: bold;
background: #90e0ef; background: #90e0ef;
padding: 8px 15px;
border-radius: 5px; border-radius: 5px;
} }
@@ -148,11 +118,10 @@ h2 {
.dropdown { .dropdown {
width: max-content; width: max-content;
position: relative;
} }
.dropdown > span { .dropdown > span {
z-index: 2; z-index: 2;
position: relative; position: relative;
cursor: pointer; cursor: pointer;
} }
@@ -176,28 +145,6 @@ h2 {
background: #48cae4; 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 { .photo-grid img {
width: 256px; width: 256px;
height: 200px; height: 200px;
@@ -211,34 +158,11 @@ h2 {
border: 2px solid #fff; border: 2px solid #fff;
} }
.footer { .footer {
overflow: hidden;
flex-shrink: 1;
height: 80px;
background-color: #023047; background-color: #023047;
text-align: center; text-align: center;
padding: 0 40px;
}
.footer-content {
display: flex;
justify-content: space-between;
align-items: center;
} }
.company-name { .company-name {
flex: 1; /* Занимает доступное пространство */
color: #ade8f4; color: #ade8f4;
} }
.footer-images {
display: flex;
gap: 20px;
padding: 10px;
}
.footer-image {
width: 60px;
height: auto;
}

17
vite.config.js Normal file
View File

@@ -0,0 +1,17 @@
import { resolve } from "path";
// eslint-disable-next-line import/no-extraneous-dependencies
import { defineConfig } from "vite";
export default defineConfig({
build: {
rollupOptions: {
input: {
main: resolve(__dirname, "pageMain.html"),
page2: resolve(__dirname, "pageCategories.html"),
page3: resolve(__dirname, "pageAccount.html"),
page4: resolve(__dirname, "pageSubscriptions.html"),
page5: resolve(__dirname, "pageSavedStreams.html"),
},
},
},
});