Internet_Programming_PIbd-2.../index.html
2023-12-08 22:40:11 +04:00

501 lines
24 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">
<title>Главная</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,800;0,900;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/style.css">
</head>
<body class="d-flex flex-column min-vh-100">
<header class="w-100 position-sticky top-0">
<nav class="navbar navbar-expand-lg navbar-light">
<div class="container-md">
<a class="navbar-brand me-lg-5 d-flex align-items-center" href="/" id="logo">
<img src="icons/logo.png" alt="logo" class="me-2">
Читай-комната
</a>
<button class="navbar-toggler ms-auto" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse" id="navbarNav">
<ul class="navbar-nav align-items-lg-center justify-content-lg-start w-100">
<li class="header-link nav-item ms-lg-2 me-lg-3">
<a class="nav-link active" aria-current="page" href="./index.html">Главная</a>
</li>
<li class="header-link nav-item me-lg-3">
<a class="nav-link" href="./catalog.html">Каталог</a>
</li>
<li class="header-link nav-item me-lg-5" id="header-contacts">
<a class="nav-link" href="./contacts.html">Контакты</a>
</li>
<div class="flex-grow-1 me-lg-4" id="header-search">
<input class="form-control h-25" type="search" placeholder="Я ищу..." aria-label="Search" id="search-bar">
</div>
<li class="nav-item">
<a class="nav-link" href="./login.html">
Вход
</a>
</li>
<p class="d-none d-lg-block">
/
</p>
<li class="nav-item me-lg-3">
<a class="nav-link" href="./registration.html">
Регистрация
</a>
</li>
<li class="nav-item">
<a class="nav-link pe-lg-0" href="./cart.html">
<img src="icons/card.png" alt="card" width="30" height="35" id="cart-icon">
</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main class="container-md d-flex flex-column justify-content-center flex-grow-1">
<div class="row bg-white pb-1 mb-3 rounded-3 gy-3">
<div class="col-12 ms-2 mt-1">
<div class="main-page-section-title block d-flex align-items-end">
<img src="icons/fire.png" class="me-2" alt="fire" width="25" height="30" id="fire-icon">
<p class="main-page-section-title-text lh-1 m-0">
Горячие новинки
</p>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/novelties/1.png" class="main-page-book-cover" alt="book-cover-novelties-1" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
932 ₽
</p>
<p class="main-page-book-title">
Вавилон. Сокрытая история
</p>
<p class="main-page-author">
Ребекка Ф. Куанг
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="./product_card.html">
<img src="book_covers/novelties/2.png" class="main-page-book-cover" alt="book-cover-novelties-2" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
775 ₽
</p>
<p class="main-page-book-title">
Форсайт
</p>
<p class="main-page-author">
Сергей Лукьяненко
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/novelties/3.png" class="main-page-book-cover" alt="book-cover-novelties-3" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
642 ₽
</p>
<p class="main-page-book-title">
Во главе раздора
</p>
<p class="main-page-author">
Лия Арден
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/novelties/4.png" class="main-page-book-cover" alt="book-cover-novelties-4" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
949 ₽
</p>
<p class="main-page-book-title">
Путешествие в Элевсин
</p>
<p class="main-page-author">
Виктор Пелевин
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/novelties/5.png" class="main-page-book-cover" alt="book-cover-novelties-5" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
699 ₽
</p>
<p class="main-page-book-title">
Восстание клана Чан
</p>
<p class="main-page-author">
Тянься Гуйюань
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/novelties/6.png" class="main-page-book-cover" alt="book-cover-novelties-6" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
551 ₽
</p>
<p class="main-page-book-title">
Дебютная постановка. Том 2
</p>
<p class="main-page-author">
Александра Маринина
</p>
</div>
</div>
</div>
</div>
<div class="row bg-white pb-1 mb-3 rounded-3 gy-3">
<div class="col-12 ms-2 mt-1">
<div class="main-page-section-title block d-flex align-items-end">
<p class="main-page-section-title-text lh-1 m-0">
Книги по акциям
</p>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/promotions/1.png" class="main-page-book-cover" alt="book-cover-promotions-1" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
576 ₽
</p>
<p class="main-page-book-title">
Шестерка воронов
</p>
<p class="main-page-author">
Ли Бардуго
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="./product_card.html">
<img src="book_covers/promotions/2.png" class="main-page-book-cover" alt="book-cover-promotions-2" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
200 ₽
</p>
<p class="main-page-book-title">
Портрет Дориана Грея
</p>
<p class="main-page-author">
Оскар Уальд
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/promotions/3.png" class="main-page-book-cover" alt="book-cover-promotions-3" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
768 ₽
</p>
<p class="main-page-book-title">
Царство Страха
</p>
<p class="main-page-author">
Керри Манискалко
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/promotions/4.png" class="main-page-book-cover" alt="book-cover-promotions-4" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
162 ₽
</p>
<p class="main-page-book-title">
Клуб самоубийц
</p>
<p class="main-page-author">
Роберт Льюис Стивенсон
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/promotions/5.png" class="main-page-book-cover" alt="book-cover-promotions-5" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
600 ₽
</p>
<p class="main-page-book-title">
Некромант-одиночка. Новелла. Том 1
</p>
<p class="main-page-author">
JJJ
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/promotions/6.png" class="main-page-book-cover" alt="book-cover-promotions-6" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
711 ₽
</p>
<p class="main-page-book-title">
Кристальный пик
</p>
<p class="main-page-author">
Гор А.
</p>
</div>
</div>
</div>
</div>
<div class="row bg-white pb-1 rounded-3 gy-3">
<div class="col-12 ms-2 mt-1">
<div class="main-page-section-title block d-flex align-items-end">
<p class="main-page-section-title-text lh-1 m-0">
Выбор редакции
</p>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/recommendations/1.png" class="main-page-book-cover" alt="book-cover-recommendations-1" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
1001 ₽
</p>
<p class="main-page-book-title">
Испытание
</p>
<p class="main-page-author">
Трейси Вульф
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="./product_card.html">
<img src="book_covers/recommendations/2.png" class="main-page-book-cover" alt="book-cover-recommendations-2" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
210 ₽
</p>
<p class="main-page-book-title">
Мастер и Маргарита
</p>
<p class="main-page-author">
Михаил Булгаков
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/recommendations/3.png" class="main-page-book-cover" alt="book-cover-recommendations-3" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
618 ₽
</p>
<p class="main-page-book-title">
Песнь Сорокопута
</p>
<p class="main-page-author">
Фрэнсис Кель
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/recommendations/4.png" class="main-page-book-cover" alt="book-cover-recommendations-4" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
754 ₽
</p>
<p class="main-page-book-title">
Кодекс Алеры. Кн. 1. Фурии Кальдерона
</p>
<p class="main-page-author">
Джим Батчер
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/recommendations/5.png" class="main-page-book-cover" alt="book-cover-recommendations-5" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
711 ₽
</p>
<p class="main-page-book-title">
Небесная река
</p>
<p class="main-page-author">
Деннис Тейлор
</p>
</div>
</div>
</div>
<div class="col-6 col-md-4 col-lg-2">
<div class="block d-flex flex-column">
<div class="d-flex justify-content-center">
<a href="/">
<img src="book_covers/recommendations/6.png" class="main-page-book-cover" alt="book-cover-recommendations-6" width="100" height="152">
</a>
</div>
<div class="d-flex flex-column align-items-center align-items-md-start">
<p class="main-page-price">
699 ₽
</p>
<p class="main-page-book-title">
Кузнец магии. Клинок тайн
</p>
<p class="main-page-author">
Триша Левенселлер
</p>
</div>
</div>
</div>
</div>
</main>
<footer class="footer flex-shrink-0">
<div class="container-md" id="footer-container">
<div class="row d-flex align-items-center gy-3 gy-lg-0 gx-0" id="footer-row">
<div class="col-md-6 col-lg-4">
<div class="block d-flex justify-content-center justify-content-md-start" id="footer-copyright">
© И. А. Родионов, 2023.
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="block d-flex align-items-center justify-content-center justify-content-md-end">
<img src="icons/telephone-call.png" class="me-2" alt="telephone-call" width="32" height="32">
<p id="footer-phone-number-text">
+7 927 818-61-60
</p>
</div>
</div>
<div class="col-md-12 col-lg-5 mb-3 mb-lg-0">
<div class="block d-flex align-items-center justify-content-center justify-content-lg-end">
<p class="me-3" id="footer-social-media-text">
Мы в соцсетях:
</p>
<a class="me-3" href="/">
<img src="icons/vk.png" alt="vk" width="32" height="32">
</a>
<a class="me-3" href="/">
<img src="icons/youtube.png" alt="youtube" width="32" height="32">
</a>
<a class="me-3" href="/">
<img src="icons/telegram.png" alt="telegram" width="32" height="32">
</a>
<a href="/">
<img src="icons/odnoklassniki.png" alt="odnoklassniki" width="32" height="32">
</a>
</div>
</div>
</div>
</div>
</footer>
</body>
</html>