Files
Online-library/html/choice.html

145 lines
9.6 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Книги по тематикам</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="/css/style.css">
</head>
<body>
<header class="mb-4">
<h1 class="text-center display-4 fw-bold" style="color: var(--accent)">Добро пожаловать на BookHub</h1>
<h4 class="text-center mb-4">Самые скучные книги только у нас!</h4>
<nav class="navbar navbar-expand-lg navbar-custom p-3">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mx-auto gap-3">
<li class="nav-item"><a href="/html/index.html" class="nav-link nav-link-custom">Главная страница</a></li>
<li class="nav-item"><a href="/html/search.html" class="nav-link nav-link-custom">Поиск</a></li>
<li class="nav-item dropdown">
<a class="nav-link nav-link-custom dropdown-toggle" href="/html/choice.html" role="button"
data-bs-toggle="dropdown">Что выбрать</a>
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="/html/choice.html#военные">Военные книги</a></li>
<li><a class="dropdown-item" href="/html/choice.html#наука">Научная литература</a></li>
<li><a class="dropdown-item" href="/html/choice.html#дети">Детские книги</a></li>
<li><a class="dropdown-item" href="/html/choice.html#психология">Психология</a></li>
</ul>
</li>
<li class="nav-item"><a href="/html/lk.html" class="nav-link nav-link-custom">Личный кабинет</a></li>
</ul>
</div>
</div>
</nav>
</header>
<main class="container">
<h1 class="text-center mb-5" style="color: var(--accent)">Книги по тематикам</h1>
<div class="row g-4">
<div class="col-12">
<div class="category-card p-4">
<h2 class="mb-4" style="color: var(--accent)">Военные книги</h2>
<div class="list-group">
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Эрих Мария Ремарк "На Западном фронте без перемен"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Лев Толстой "Война и мир"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Василь Быков "Сотников"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="category-card p-4">
<h2 class="mb-4" style="color: var(--accent)">Книги про науку</h2>
<div class="list-group">
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Стивен Хокинг "Краткая история времени"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Карл Саган "Космос"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Ричард Докинз "Эгоистичный ген"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="category-card p-4">
<h2 class="mb-4" style="color: var(--accent)">Детские книги</h2>
<div class="list-group">
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Астрид Линдгрен "Пеппи Длинныйчулок"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Алан Милн "Винни-Пух"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Антуан де Сент-Экзюпери "Маленький принц"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="category-card p-4">
<h2 class="mb-4" style="color: var(--accent)">Книги про психологию</h2>
<div class="list-group">
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>"Как завоевывать друзей и оказывать влияние на людей"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Виктор Франкл "Человек в поисках смысла"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
<div class="book-item list-group-item d-flex justify-content-between align-items-center mb-2">
<span>Роберт Чалдини "Психология влияния"</span>
<a href="/html/infobook.html" class="btn btn-sm" style="background-color: var(--accent); color: var(--bg-dark)">Читать</a>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="mt-5 p-4" style="background-color: var(--bg-medium)">
<div class="container">
<div class="row text-center">
<div class="col-md-6 mb-4">
<h3>Контакты</h3>
<p>Москва, ул. Книжная, 12<br>Часы работы: 10:00 - 20:00</p>
</div>
<div class="col-md-6">
<h3>Соцсети</h3>
<div class="d-flex justify-content-center gap-3">
<a href="https://vk.ru"><img src="/res/vk.svg" alt="VK" style="width: 32px"></a>
<a href="https://lichess.org"><img src="/res/telegram.svg" alt="Telegram" style="width: 32px"></a>
</div>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>