Files
InternetDev/lab4/my-project/index.html
2025-05-28 20:22:51 +04:00

111 lines
5.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>
<!-- 1. Bootstrap -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- 2. Иконки -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<!-- 3. Ваши кастомные стили -->
<link rel="stylesheet" href="src/css/style.css">
</head>
<body class="d-flex flex-column min-vh-100">
<!-- Вставьте этот header в начало body (перед основным контентом) -->
<header class="sticky-top navbar navbar-expand-lg navbar-dark bg-black border-bottom border-punk px-0">
<div class="container-fluid">
<!-- Логотип и название -->
<a href="index.html" class="navbar-brand d-flex align-items-center ms-3">
<img src="res/logo.png" alt="Панкуха" height="60" class="me-2">
<span class="text-punk fs-4 fw-bold">Панкуха</span>
</a>
<!-- Кнопка для мобильных -->
<button class="navbar-toggler me-3" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent">
<span class="navbar-toggler-icon"></span>
</button>
<!-- Навигация -->
<div class="collapse navbar-collapse bg-black" id="navbarContent">
<ul class="navbar-nav w-100 justify-content-end pe-4">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle text-punk fw-bold" href="#" data-bs-toggle="dropdown">
<i class="bi bi-list-check me-1"></i>Страницы
</a>
<ul class="dropdown-menu dropdown-menu-dark border-punk">
<li><a class="dropdown-item text-punk" href="index.html"><i class="bi bi-house-door me-2"></i>Главная</a></li>
<li><hr class="dropdown-divider border-punk"></li>
<li><a class="dropdown-item text-punk" href="grob.html"><i class="bi bi-person-badge me-2"></i>Исполнитель</a></li>
<li><a class="dropdown-item text-punk" href="grobKaifIliBolshe.html"><i class="bi bi-music-note-beamed me-2"></i>Песня</a></li>
<li><a class="dropdown-item text-punk" href="catalog.html"><i class="bi bi-collection me-2"></i>Каталог</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link text-punk fw-bold" href="https://vk.com/kadyshevever">
<i class="bi bi-people-fill me-1"></i>Контакты
</a>
</li>
</ul>
</div>
</div>
</header>
<!-- Основное содержимое -->
<main class="container my-5 flex-grow-1">
<div class="text-center mb-5">
<h1 class="display-4 text-punk mb-4">Стриминговый сервис <em>"Панкуха"</em></h1>
<img src="res/logo.png" alt="Эмблема" class="img-fluid" style="max-width: 200px;">
</div>
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="card bg-black border-punk mb-5">
<div class="card-body">
<h2 class="card-title h4 text-punk">
<i class="bi bi-clipboard-check-fill"></i> Реализованные страницы:
</h2>
<div class="list-group">
<a href="index.html" class="list-group-item list-group-item-action bg-dark text-punk border-punk">
<i class="bi bi-house"></i> Главная страница
</a>
<a href="grob.html" class="list-group-item list-group-item-action bg-dark text-punk border-punk">
<i class="bi bi-person-vcard"></i> Страница исполнителя
</a>
<a href="grobKaifIliBolshe.html" class="list-group-item list-group-item-action bg-dark text-punk border-punk">
<i class="bi bi-music-note-beamed"></i> Страница песни
</a>
<a href="catalog.html" class="list-group-item list-group-item-action bg-dark text-punk border-punk">
<i class="bi bi-collection"></i> Каталог
</a>
<a href="punkrock.html" class="list-group-item list-group-item-action bg-dark text-punk border-punk">
<i class="bi bi-disc"></i> Страница каталога
</a>
</div>
</div>
</div>
</div>
</div>
</main>
<!-- Подвал -->
<footer class="bg-black py-3 border-top border-punk mt-auto">
<div class="container">
<div class="d-flex flex-wrap justify-content-between align-items-center">
<p class="mb-0 text-punk">&copy; 2025. Все права защищены.</p>
<nav class="d-flex align-items-center">
<a href="#" class="text-punk me-3">Политика конфиденциальности</a>
<a href="https://vk.com/kadyshevever" class="text-punk">
<i class="bi bi-vk fs-4"></i>
</a>
</nav>
</div>
</div>
</footer>
<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>