MorozovDanil/InternetProg_MorozovDV_PIbd-22
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Готово к сдаче

Browse Source
This commit is contained in:
MorozovDanil
2025-05-15 00:07:24 +04:00
parent 1f8c295e61
commit 733c13b77e
7 changed files with 375 additions and 411 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
html/account.html
View File

@@ -14,7 +14,7 @@
<body class="bg-dark text-light">
<header class="bg-custom-dark py-3">
<header class="bg-secondary py-3 bg-custom-dark">
<div class="container d-flex align-items-center">
<a href="index.html" class="me-3">
<img src="../img/manga.png" alt="ЛОГО" height="50" />
@@ -25,7 +25,7 @@
<main class="container my-5">
<div class="row justify-content-center">
<div class="col-md-6 bg-custom-dark p-4 rounded">
<div class="col-md-6 bg-secondary p-4 rounded bg-custom-dark">
<form id="loginForm">
<h2 class="text-center mb-4">
<i class="bi bi-person-circle me-2"></i>Вход в систему
@@ -59,7 +59,7 @@
</div>
</main>
<footer class="bg-custom-dark text-center py-4 text-light mt-5">
<footer class="bg-secondary text-center py-4 text-light mt-5 bg-custom-dark">
<p><i class="bi bi-journal-text me-2"></i>Все права защищены, 2025</p>
</footer>

76
html/author.html
View File

@@ -5,38 +5,58 @@
<title>Авторство</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="menu">
<a href="index.html" class="logo">
<img src="img/manga.png" alt="ЛОГО">
</a>
<ul class="nav">
<li class="dropdown">
<span>Каталог ▾</span>
<ul class="features-menu">
<li><a href="#">Жанр 1</a></li>
<li><a href="#">Жанр 2</a></li>
<li><a href="#">Жанр 3</a></li>
<li><a href="#">Жанр 4</a></li>
</ul>
</li>
<li class="login"><a href="account.html">вход</a></li>
</ul>
</div>
<div class="author">
<img class="img-author" src="img/ХаяоМиядзаки.png" alt="">
<div class="description">
<h3>Автор: Хаяо Миядзаки</h3>
<p>посвящено автору и тп. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Consequuntur quod harum voluptate architecto, sit eaque, voluptatibus excepturi deleniti consequatur porro vero dolorem dolorum vitae laborum libero et veritatis sapiente a?</p>
<body class="bg-dark text-light">
<!-- Навигация -->
<nav class="navbar navbar-expand-lg navbar-dark bg-custom-dark px-3">
<a class="navbar-brand" href="index.html">
<img src="img/manga.png" alt="ЛОГО" height="50">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Переключить навигацию">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse ms-3" id="navbarNavDropdown">
<ul class="navbar-nav me-auto">
</ul>
<a href="account.html" class="btn btn-outline-warning">Вход</a>
</div>
</nav>
</div>
<!-- Информация об авторе -->
<main class="container mt-5">
<div class="row">
<div class="col-md-4 text-center">
<img class="img-fluid rounded" src="img/ХаяоМиядзаки.png" alt="Хаяо Миядзаки">
</div>
<div class="col-md-8">
<h3>Автор: Хаяо Миядзаки</h3>
<p>Посвящено автору и т.п. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur quod harum
voluptate architecto, sit eaque, voluptatibus excepturi deleniti consequatur porro vero dolorem dolorum
vitae laborum libero et veritatis sapiente a?</p>
</div>
</div>
</main>
<!-- Футер -->
<footer class="bg-custom-dark text-light text-center py-4 mt-5">
<p>Спасибо, что посетили наш сайт, если возникли вопросы, обращайтесь к нам на почту <a href="mailto:manga@manga.scom" class="text-warning">manga@manga.scom</a></p>
<p>Если вас интересуют наши соц.сети, то вот они:</p>
<div class="d-flex justify-content-center">
<a href="https://vk.com/ded_moroz1509" class="me-3">
<img src="img/VK0.png" alt="VK" height="30">
</a>
<!-- Добавить другие иконки соцсетей здесь -->
</div>
</footer>
<!-- JS Bootstrap -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

188
html/css/style.css
View File

@@ -22,193 +22,21 @@ footer {
flex-shrink: 0;
}
/* * {
margin: 0;
padding: 0;
}
body {
background-color: #0f0630;
font-family: Arial, Helvetica, sans-serif;
.d-block {
text-decoration: none;
color: #f0ffff;
}
a {
text-decoration: none;
color: bisque;
}
div {
background-color: #312b46;
width: 1075px;
margin: 0 auto 20px;
}
.author {
display: flex;
}
.input {
width: 700px;
margin-top: 70px;
}
.icons {
display: flex;
flex-wrap: wrap;
}
.icon {
width: 150px;
margin: 0px 20px 10px;
.img-fluid {
width: 200px;
}
.card {
display: flex;
width: 60%;
}
h3 {
margin-bottom: 15px;
.container-news .card {
margin: 0 auto;
width: 600px;
}
.read{
width: 500px;
display: block;
}
footer {
background-color: #312b46;
margin-top: 50px;
padding: 10px;
height: 150px;
color: rgb(163, 154, 87);
}
.menu {
display: flex;
align-items: center;
margin-bottom: 50px;
background-color: #312b46;
padding: 10px;
}
.logo img {
height: 50px;
}
.nav {
list-style: none;
display: flex;
margin-left: 20px;
}
.nav li {
position: relative;
padding: 10px;
}
.nav a, .dropdown span {
color: bisque;
cursor: pointer;
}
.features-menu {
display: none;
position: absolute;
top: 100%;
left: 0;
background: #413a58;
list-style: none;
padding: 5px 0;
min-width: 150px;
}
.features-menu li {
padding: 5px 10px;
}
.features-menu li a {
display: block;
color: bisque;
padding: 5px;
}
.features-menu li a:hover {
background: #574f73;
}
.dropdown:hover .features-menu {
display: block;
}
.logoVK {
margin-top: 10px;
height: 40px;
}
.description-new {
padding: 10px 20px;
}
/* Мобилка */
@media only screen and (min-width: 100px) and (max-width: 700px) {
div, .input, .read {
width: 70%;
}
.menu{
padding: 0px;
}
.nav {
margin: 0px;
}
.icon{
padding: 0 5px;
margin: 0px auto 10px;
}
.card{
display: block;
}
.author {
display: block;
}
.img-author{
width: 100%;
}
.read img {
width: 100%;
}
.card img {
width: 100%;
}
.cont-new img {
width: 100%;
}
}
/* Планшет */
@media only screen and (min-width: 701px) and (max-width: 1400px) {
div, .input, .read {
width: 80%;
}
.menu{
padding: 0px;
}
.icon{
padding: 0 5px;
}
.author {
display: block;
}
.img-author{
width: 100%;
}
.read img {
width: 100%;
}
.card-news .card {
margin: 0px 0px 15px;
}
}
*/

277
html/index.html
View File

@@ -2,128 +2,165 @@
<html lang="ru">
<head>
<title>Манга онлайн</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="css/style.css" rel="stylesheet">
<title>Манга онлайн</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<body class="bg-dark">
<!-- Навигация -->
<nav class="navbar navbar-expand-lg navbar-dark bg-custom-dark px-3">
<a class="navbar-brand" href="index.html">
<img src="img/manga.png" alt="ЛОГО" height="50">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Переключить навигацию">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse ms-3" id="navbarNavDropdown">
<ul class="navbar-nav me-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="catalogDropdown" role="button" data-bs-toggle="dropdown"
aria-expanded="false">
Каталог
</a>
<ul class="dropdown-menu dropdown-menu-dark" aria-labelledby="catalogDropdown">
<li><a class="dropdown-item" href="#">Жанр 1</a></li>
<li><a class="dropdown-item" href="#">Жанр 2</a></li>
<li><a class="dropdown-item" href="#">Жанр 3</a></li>
<li><a class="dropdown-item" href="#">Жанр 4</a></li>
</ul>
</li>
</ul>
<a href="account.html" class="btn btn-outline-warning">Вход</a>
</div>
</nav>
<!-- Основное содержимое -->
<div class="container mt-5 bg-secondary">
<!-- Раздел с произведениями -->
<div class="main">
<h3 class="text-center">Наши произведения</h3>
<section class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 g-4">
<div class="col d-flex justify-content-center">
<a href="manga.html" class="d-block">
<figure class="text-center">
<img src="img/заглушка.jpg" class="img-fluid" alt="Заглушка">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="col d-flex justify-content-center">
<a href="manga.html" class="d-block">
<figure class="text-center">
<img src="img/заглушка.jpg" class="img-fluid" alt="Заглушка">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="col d-flex justify-content-center">
<a href="manga.html" class="d-block">
<figure class="text-center">
<img src="img/заглушка.jpg" class="img-fluid" alt="Заглушка">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="col d-flex justify-content-center">
<a href="manga.html" class="d-block">
<figure class="text-center">
<img src="img/заглушка.jpg" class="img-fluid" alt="Заглушка">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="col d-flex justify-content-center">
<a href="manga.html" class="d-block">
<figure class="text-center">
<img src="img/заглушка.jpg" class="img-fluid" alt="Заглушка">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="col d-flex justify-content-center">
<a href="manga.html" class="d-block">
<figure class="text-center">
<img src="img/заглушка.jpg" class="img-fluid" alt="Заглушка">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="col d-flex justify-content-center">
<a href="manga.html" class="d-block">
<figure class="text-center">
<img src="img/заглушка.jpg" class="img-fluid" alt="Заглушка">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
</section>
</div>
<!-- Новости -->
<div class="news mt-5">
<h3 class="text-center">Наши новости:</h3>
<section class="row row-cols-1 row-cols-sm-3 row-cols-md-3 g-4">
<div class="col d-flex justify-content-center">
<div class="card">
<a href="news.html">
<img src="img/новость.jpg" class="card-img-top" alt="Новость 1">
</a>
<div class="card-body">
<h4 class="card-title">Новость 1</h4>
<p class="card-text">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero laborum possimus itaque quibusdam beatae ipsam odit sed? Vel blanditiis repellendus, ea nam, incidunt odio sit amet sequi nihil, laudantium aspernatur!</p>
</div>
</div>
</div>
<div class="col d-flex justify-content-center">
<div class="card">
<a href="news.html">
<img src="img/новость.jpg" class="card-img-top" alt="Новость 2">
</a>
<div class="card-body">
<h4 class="card-title">Новость 2</h4>
<p class="card-text">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero laborum possimus itaque quibusdam beatae ipsam odit sed? Vel blanditiis repellendus, ea nam, incidunt odio sit amet sequi nihil, laudantium aspernatur!</p>
</div>
</div>
</div>
<div class="col d-flex justify-content-center">
<div class="card">
<a href="news.html">
<img src="img/новость.jpg" class="card-img-top" alt="Новость 3">
</a>
<div class="card-body">
<h4 class="card-title">Новость 3</h4>
<p class="card-text">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero laborum possimus itaque quibusdam beatae ipsam odit sed? Vel blanditiis repellendus, ea nam, incidunt odio sit amet sequi nihil, laudantium aspernatur!</p>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- Футер -->
<footer class="bg-dark text-light text-center py-4 mt-5">
<p>Спасибо, что посетили наш сайт, если возникли вопросы, обращайтесь к нам на почту <a href="mailto:manga@manga.scom" class="text-warning">manga@manga.scom</a></p>
<p>Если вас интересуют наши соц.сети, то вот они:</p>
<div class="d-flex justify-content-center">
<a href="https://vk.com/ded_moroz1509" class="me-3">
<img src="img/VK0.png" alt="VK" height="30">
</a>
<!-- Добавьте другие иконки соцсетей здесь -->
</div>
</footer>
<!-- JS Bootstrap -->
<div class="menu">
<a href="index.html" class="logo">
<img src="img/manga.png" alt="ЛОГО">
</a>
<ul class="nav">
<li class="dropdown">
<span>Каталог ▾</span>
<ul class="features-menu">
<li><a href="#">Жанр 1</a></li>
<li><a href="#">Жанр 2</a></li>
<li><a href="#">Жанр 3</a></li>
<li><a href="#">Жанр 4</a></li>
</ul>
</li>
<li class="login"><a href="account.html">вход</a></li>
</ul>
</div>
<div class="main">
<h3>Наши произведения</h3>
<section class="icons"><!--секция с обложками-->
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
</section>
</div>
<div class="news">
<h3>Наши новости:</h3>
<section class="card-news"><!--секция с новостями-->
<div class="card">
<a href="news.html">
<img src="img/новость.jpg" alt="">
</a>
<div class="description-news">
<h4>Новость 1</h4>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero laborum possimus itaque quibusdam beatae ipsam odit sed? Vel blanditiis repellendus,
ea nam, incidunt odio sit amet sequi nihil, laudantium aspernatur!</p>
</div>
</div>
<div class="card">
<a href="news.html">
<img src="img/новость.jpg" alt="">
</a>
<div class="description-news">
<h4>Новость 2</h4>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero laborum possimus itaque quibusdam beatae ipsam odit sed? Vel blanditiis repellendus,
ea nam, incidunt odio sit amet sequi nihil, laudantium aspernatur!</p>
</div>
</div>
</section>
</div>
<footer>
<p>Спасибо, что посетили наш сайт, если возникли вопросы обращайтесь к нам на почту manga@manga.scom</p>
<p>Если вас интерисуют наши соц.сети, то вот они: </p>
<a href="https://vk.com/ded_moroz1509"><img class="logoVK" src="img/VK0.png" alt="VK"></a>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
</html>

95
html/manga.html
View File

@@ -2,41 +2,72 @@
<html lang="ru">
<head>
<title>Манга</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="css/style.css" rel="stylesheet">
<title>Манга</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-4Q6Gf2aSP4eDXB8Miphtr37CMZZQ5oXLH2yaXMJ2w8e2ZtHTl7GptT4jmndRuHDT" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet" />
</head>
<body>
<body class="bg-dark text-light d-flex flex-column min-vh-100">
<div class="menu">
<a href="index.html" class="logo">
<img src="img/manga.png" alt="ЛОГО">
</a>
<ul class="nav">
<li class="dropdown">
<span>Каталог ▾</span>
<ul class="features-menu">
<li><a href="#">Жанр 1</a></li>
<li><a href="#">Жанр 2</a></li>
<li><a href="#">Жанр 3</a></li>
<li><a href="#">Жанр 4</a></li>
</ul>
</li>
<li class="login"><a href="account.html">вход</a></li>
</ul>
</div>
<div>
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
<p>здесь будет сама инфа о манге</p>
<a href="author.html">про автора</a>
<a href="reading.html">Читать</a>
<!-- Навигация -->
<nav class="navbar navbar-expand-lg navbar-dark bg-custom-dark px-3">
<a class="navbar-brand" href="index.html">
<img src="img/manga.png" alt="ЛОГО" height="50">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Переключить навигацию">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse ms-3" id="navbarNavDropdown">
<ul class="navbar-nav me-auto">
</ul>
<a href="account.html" class="btn btn-outline-warning">Вход</a>
</div>
</nav>
<!-- Контент -->
<main class="container my-5 flex-grow-1">
<div class="row justify-content-center">
<div class="col-md-8 text-center">
<figure class="figure">
<img src="img/заглушка.jpg" class="figure-img img-fluid rounded" alt="Заглушка">
<figcaption class="figure-caption text-light">Заглушка</figcaption>
</figure>
<p class="mt-4">Здесь будет сама инфа о манге</p>
<div class="d-flex justify-content-center gap-3 mt-3">
<a href="author.html" class="btn btn-primary"><i class="bi bi-person-lines-fill me-2"></i>Про автора</a>
<a href="reading.html" class="btn btn-success"><i class="bi bi-book me-2"></i>Читать</a>
</div>
</div>
</div>
</main>
<footer class="bg-custom-dark text-light text-center py-4">
<div class="container">
<p>Спасибо, что посетили наш сайт, если возникли вопросы, обращайтесь к нам на почту <a href="mailto:manga@manga.scom" class="text-warning">manga@manga.scom</a></p>
<p>Если вас интересуют наши соц.сети, то вот они:</p>
<div class="d-flex justify-content-center">
<a href="https://vk.com/ded_moroz1509" class="me-3">
<img src="img/VK0.png" alt="VK" height="30">
</a>
</div>
</div>
</footer>
<!-- JS Bootstrap -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"
integrity="sha384-qM3E4Th5USh8vEk7NR7s02PbZ+PeWXcP4qU3HdHPoUVYvRNEAYsGHV7kpw9yeF0L"
crossorigin="anonymous"></script>
</body>
</html>
</html>

71
html/news.html
View File

@@ -4,34 +4,59 @@
<head>
<title>Новость</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="css/style.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<body class="bg-dark">
<div class="menu">
<a href="index.html" class="logo">
<img src="img/manga.png" alt="ЛОГО">
<!-- Навигация -->
<nav class="navbar navbar-expand-lg navbar-dark bg-custom-dark px-3">
<a class="navbar-brand" href="index.html">
<img src="img/manga.png" alt="ЛОГО" height="50">
</a>
<ul class="nav">
<li class="dropdown">
<span>Каталог ▾</span>
<ul class="features-menu">
<li><a href="#">Жанр 1</a></li>
<li><a href="#">Жанр 2</a></li>
<li><a href="#">Жанр 3</a></li>
<li><a href="#">Жанр 4</a></li>
</ul>
</li>
<li class="login"><a href="account.html">вход</a></li>
</ul>
</div>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Переключить навигацию">
<span class="navbar-toggler-icon"></span>
</button>
<div class="cont-new">
<img src="img/новость.jpg" alt="">
<p class="description-new">Новость Lorem, ipsum dolor sit amet consectetur adipisicing elit. Beatae exercitationem eligendi error. Architecto voluptatum eaque, nostrum ea a consequuntur, deleniti dolor provident sequi dicta culpa magnam delectus amet distinctio autem?</p>
<div class="collapse navbar-collapse ms-3" id="navbarNavDropdown">
<ul class="navbar-nav me-auto">
</ul>
<a href="account.html" class="btn btn-outline-warning">Вход</a>
</div>
</nav>
<div class="container container-news mt-4">
<div class="row">
<div class="col-12">
<div class="card">
<img src="img/новость.jpg" class="card-img-top" alt="Новость">
<div class="card-body">
<h5 class="card-title">Новость</h5>
<p class="card-text">
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Beatae exercitationem eligendi error.
Architecto voluptatum eaque, nostrum ea a consequuntur, deleniti dolor provident sequi dicta culpa
magnam delectus amet distinctio autem?
</p>
</div>
</div>
</div>
</div>
</div>
<footer class="bg-custom-dark text-center py-4 text-light mt-5 bg-custom-dark">
<p><i class="bi bi-journal-text me-2"></i>Все права защищены, 2025</p>
</footer>
<!-- Подключаем Bootstrap JS и Popper -->
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js"></script>
</body>
</html>
</html>

73
html/reading.html
View File

@@ -3,36 +3,59 @@
<head>
<title>Читать мангу...</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="css/style.css" rel="stylesheet">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<body class="bg-dark text-light">
<div class="menu">
<a href="index.html" class="logo">
<img src="img/manga.png" alt="ЛОГО">
</a>
<ul class="nav">
<li class="dropdown">
<span>Каталог ▾</span>
<ul class="features-menu">
<li><a href="#">Жанр 1</a></li>
<li><a href="#">Жанр 2</a></li>
<li><a href="#">Жанр 3</a></li>
<li><a href="#">Жанр 4</a></li>
</ul>
</li>
<li class="login"><a href="account.html">вход</a></li>
</ul>
</div>
<!-- Навигация -->
<nav class="navbar navbar-expand-lg navbar-dark bg-custom-dark px-3">
<a class="navbar-brand" href="index.html">
<img src="img/manga.png" alt="ЛОГО" height="50">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Переключить навигацию">
<span class="navbar-toggler-icon"></span>
</button>
<div class="read">
<img src="img/SL1.png" alt="">
<img src="img/SL2.png" alt="">
<div class="collapse navbar-collapse ms-3" id="navbarNavDropdown">
<ul class="navbar-nav me-auto">
</ul>
<a href="account.html" class="btn btn-outline-warning">Вход</a>
</div>
</nav>
<!-- Чтение манги -->
<div class="container mt-5">
<div class="row">
<div class="col-12 text-center">
<h3>Читать мангу...</h3>
<div class="d-flex justify-content-center">
<img class="img-reading mx-2" src="img/SL1.png" alt="Манга страница 1">
<img class="img-reading mx-2" src="img/SL2.png" alt="Манга страница 2">
</div>
</div>
</div>
</div>
<!-- Футер -->
<footer class="bg-custom-dark text-light text-center py-4 mt-5">
<p>Спасибо, что посетили наш сайт, если возникли вопросы, обращайтесь к нам на почту <a href="mailto:manga@manga.scom" class="text-warning">manga@manga.scom</a></p>
<p>Если вас интересуют наши соц.сети, то вот они:</p>
<div class="d-flex justify-content-center">
<a href="https://vk.com/ded_moroz1509" class="me-3">
<img src="img/VK0.png" alt="VK" height="30">
</a>
<!-- Добавить другие иконки соцсетей здесь -->
</div>
</footer>
<!-- JS Bootstrap -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>