Zein/hentai_manga_site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Добавление списка страниц

Browse Source
This commit is contained in:
Vinejar
2025-03-30 05:25:04 +03:00
parent f8ebe1a9d8
commit 13b00579c2
4 changed files with 172 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
templates/base_manga.html Normal file
View File

@@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="ru">
<head>
{% load static %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}{{ manga.original_title }}{% endblock %}</title>
<link rel="stylesheet" href="{% static 'css/manga_view.css' %}">
</head>
<body>
<div class="main-container">
<!-- Хедер -->
<header class="navigation-box">
<ul>
<li class="breadcrumb">
<a href="/manga/111">Каталог</a>
<span>-</span>
<a href="/manga/111">{{ manga.original_title }}</a>
{% block page_title %}{% endblock %}
</li>
</ul>
</header>
<!-- Основной контент -->
<main>
{% block content %}{% endblock %}
</main>
<!-- Футер -->
<footer class="footer-navigation">
<div class="dropdown-box">
<select id="page-selector" onchange="changePage(this)">
{% block page_options %}{% endblock %}
</select>
</div>
<div class="page-buttons">
{% block page_buttons %}{% endblock %}
</div>
</footer>
</div>
<script>
function changePage(select) {
window.location.href = select.value;
}
</script>
</body>
</html>

56
templates/manga_page.html
View File

@@ -1,45 +1,33 @@
<!DOCTYPE html>
<html lang="ru">
<head>
{% load static %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ manga.original_title }} - Страница {{ page_number }}</title>
<link rel="stylesheet" type="text/css" href="{% static 'css/manga_view.css' %}">
</head>
<body>
<div class="main-container">
<!-- Навигация -->
<div class="navigation-box">
<ul>
<li class="breadcrumb">
<a href="/manga/111">Каталог</a>
<span>-</span>
<a href="/manga/111">{{ manga.original_title }}</a>
{% extends 'base_manga.html' %}
{% block title %}{{ manga.original_title }} - Страница {{ page_number }}{% endblock %}
{% block page_title %}
<span>-</span>
<span>Страница {{ page_number }}</span>
</li>
</ul>
</div>
{% endblock %}
<!-- Изображение и навигация -->
<div class="image-navigation-container">
<div class="image-box">
<img src="{{ img_url }}" alt="Страница {{ page_number }}">
{% block content %}
<div class="image-container">
<img src="{{ img_url }}" alt="Страница {{ page_number }}" class="manga-page">
</div>
{% endblock %}
<div class="page-navigation">
{% block page_options %}
<option value="{% url 'show_manga' manga.id %}">🔍 Превью</option>
{% for img in manga.imgs_manga %}
<option value="{% url 'show_manga_page' manga.id forloop.counter %}"
{% if forloop.counter == page_number %}selected{% endif %}>
Страница {{ forloop.counter }}
</option>
{% endfor %}
{% endblock %}
{% block page_buttons %}
{% if page_number > 1 %}
<a href="{% url 'show_manga_page' manga.id page_number|add:'-1' %}" class="nav-button">← Назад</a>
{% endif %}
<a href="{% url 'show_manga' manga.id %}" class="nav-button">К превью</a>
{% if page_number < manga.len_manga %}
<a href="{% url 'show_manga_page' manga.id page_number|add:'1' %}" class="nav-button">Вперед →</a>
{% endif %}
</div>
</div>
</div>
</body>
</html>
{% endblock %}

45
templates/manga_view.html
View File

@@ -1,26 +1,10 @@
<!DOCTYPE html>
<html lang="ru">
<head>
{% load static %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ manga.original_title }}</title>
<link rel="stylesheet" type="text/css" href="{% static 'css/manga_view.css' %}">
</head>
<body>
<div class="main-container">
<!-- Навигация -->
<div class="navigation-box">
<ul>
<li class="breadcrumb">
<a href="/manga/111">Каталог</a>
<span>-</span>
<a href="/manga/111">{{ manga.original_title }}</a>
</li>
</ul>
</div>
{% extends 'base_manga.html' %}
<!-- Сетка превью -->
{% block title %}{{ manga.original_title }} - Превью{% endblock %}
{% block page_title %}{% endblock %}
{% block content %}
<div class="manga-grid-container">
<div class="manga-grid">
{% for img in manga.imgs_manga %}
@@ -32,6 +16,17 @@
{% endfor %}
</div>
</div>
</div>
</body>
</html>
{% endblock %}
{% block page_options %}
<option value="{% url 'show_manga' manga.id %}">🔍 Превью</option>
{% for img in manga.imgs_manga %}
<option value="{% url 'show_manga_page' manga.id forloop.counter %}">
Страница {{ forloop.counter }}
</option>
{% endfor %}
{% endblock %}
{% block page_buttons %}
<!-- Пусто, так как в превью не нужны кнопки навигации -->
{% endblock %}

63
templates/static/css/manga_view.css
View File

@@ -76,3 +76,66 @@
.nav-button:hover {
background: #e0e0e0;
}
/* Хедер */
.navigation-box {
padding: 15px 0;
border-bottom: 1px solid #eee;
margin-bottom: 20px;
}
.breadcrumb {
display: flex;
align-items: center;
list-style: none;
padding: 0;
margin: 0;
font-size: 16px;
}
.breadcrumb a, .breadcrumb span {
margin: 0 5px;
}
/* Футер */
.footer-navigation {
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #eee;
display: flex;
flex-direction: column;
align-items: center;
gap: 15px;
}
.dropdown-box select {
padding: 8px 15px;
border-radius: 4px;
border: 1px solid #ccc;
min-width: 200px;
}
.page-buttons {
display: flex;
gap: 10px;
}
.nav-button {
padding: 8px 15px;
background: #f0f0f0;
border-radius: 4px;
text-decoration: none;
color: #333;
}
.nav-button:hover {
background: #e0e0e0;
}
/* Контент */
.manga-page {
max-width: 100%;
max-height: 70vh;
display: block;
margin: 0 auto;
}