SergeyRasubaev_PIbd-21_IP_R.../3 lab/dist/home.html

188 lines
8.3 KiB
HTML
Raw Normal View History

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Главная</title>
<script type="module" crossorigin src="/assets/style-afc16ede.js"></script>
<link rel="stylesheet" href="/assets/style-675f72be.css">
</head>
<body>
<main class="d-flex flex-nowrap">
<div class ="cl1 text-bg-dark">
<div class="filters ">
<div class="d-flex flex-column flex-shrink-0 text-bg-dark;" style ="width: 280px;">
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
<svg class="bi pe-none me-2" width="40" height="32"><img src="/assets/icon-8b2b7123.jpg" alt="icon" width ="24" height ="24"></svg>
<span class="fs-4">Сообщения</span>
</a>
<hr>
<ul class="nav nav-pills flex-column mb-auto">
<li class="nav-item">
<a href="Messages.html" class="nav-link active" aria-current="page">
<svg class="bi pe-none me-2" width="16" height="16"><img src="/assets/messages-220127ec.png" alt="home" width ="24" height ="24"></svg>
Сообщения
</a>
</li>
<li>
<a href="settings.html" class="nav-link text-white">
<svg class="bi pe-none me-2" width="16" height="16"><img src="/assets/settings-4cadbde0.png" alt="settings" width ="24" height ="24"></svg>
Настройки
</a>
</li>
<li>
<a href="login.html" class="nav-link text-white">
<svg class="bi pe-none me-2" width="16" height="16"><img src="/assets/exit-18ba8829.png" alt="exit" width ="24" height ="24"></svg>
Выход
</a>
</li>
</ul>
<hr>
</div>
</div>
</div>
<div class ="cl2 bg-body-tertiary" style ="position:sticky; height:100vh;">
<div class="filters">
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary" style="width: 3rem;">
<a href="/" class="d-block p-3 link-body-emphasis text-decoration-none" title="Icon-only" data-bs-toggle="tooltip" data-bs-placement="right">
<img class="icon" src="/assets/icon-8b2b7123.jpg" alt="icon" width ="32" height ="32">
<span class="visually-hidden">Icon</span>
</a>
<ul class="nav nav-pills nav-flush flex-column mb-auto text-center">
<li class="nav-item">
<a href="Messages.html" class="nav-link active py-3 border-bottom rounded-0" aria-current="page" title="Messages" data-bs-toggle="tooltip" data-bs-placement="right">
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Home"><img src="/assets/messages-220127ec.png" alt="home" width ="24" height ="24"></svg>
</a>
</li>
<li>
<a href="settings.html" class="nav-link py-3 border-bottom rounded-0" title="Settings" data-bs-toggle="tooltip" data-bs-placement="right">
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Settings"><img src="/assets/settings-4cadbde0.png" alt="settings" width ="24" height ="24"></svg>
</a>
</li>
<li>
<a href="login.html" class="nav-link py-3 border-bottom rounded-0" title="Orders" data-bs-toggle="tooltip" data-bs-placement="right">
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Orders"><img src="/assets/exit-18ba8829.png" alt="exit" width ="24" height ="24"></svg>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="filters">
</div>
<div class="list-group">
<a class="list-group-item list-group-item-action d-flex gap-1 py-2" aria-current="true">
<img src="/assets/da-2655b12b.jpg" alt="twbs" width="40" height="40" class="rounded-circle flex-shrink-0">
<div class="d-flex w-100 justify-content-between">
<div>
<h6 class="mb-0">Давид Макаров</h6>
<p class="mb-0 opacity-75">Оцените моего</p>
<div class = "postImage">
<img src="/assets/da2-b5470625.jpg" class="img-fluid" alt="Данил" height="200" width="500"></div>
<div class="d-flex gap-2 w-100 justify-content-between">
<input type="image" src="images/like.png" width="20" height="20" alt="Кнопка «input»">
<h6 class="mb-0">5</h6>
</div>
<div class="d-flex gap-2 w-100 justify-content-between">
<img src="/assets/eye-826654ed.png" alt="Просмотры" width="20" height="20" >
<h6 class="mb-0">2100</h6>
</div>
<div class="d-flex gap-2 w-50 justify-content-between">
<button class="btn btn-dark rounded-pill px-3" type="button">Прокомментировать</button>
</div>
</div>
<small class="opacity-1">сейчас</small>
</div>
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
<div class="d-flex gap-2 w-100 justify-content-between">
<div>
<h6 class="mb-0">List group item heading</h6>
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
</div>
<small class="opacity-50 text-nowrap">now</small>
</div>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
<div class="d-flex gap-2 w-100 justify-content-between">
<div>
<h6 class="mb-0">Third heading</h6>
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
</div>
<small class="opacity-50 text-nowrap">1w</small>
</div>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
<div class="d-flex gap-2 w-100 justify-content-between">
<div>
<h6 class="mb-0">Third heading</h6>
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
</div>
<small class="opacity-50 text-nowrap">1w</small>
</div>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
<div class="d-flex gap-2 w-100 justify-content-between">
<div>
<h6 class="mb-0">Third heading</h6>
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
</div>
<small class="opacity-50 text-nowrap">1w</small>
</div>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
<div class="d-flex gap-2 w-100 justify-content-between">
<div>
<h6 class="mb-0">Third heading</h6>
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
</div>
<small class="opacity-50 text-nowrap">1w</small>
</div>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
<div class="d-flex gap-2 w-100 justify-content-between">
<div>
<h6 class="mb-0">Third heading</h6>
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
</div>
<small class="opacity-50 text-nowrap">1w</small>
</div>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
<div class="d-flex gap-2 w-100 justify-content-between">
<div>
<h6 class="mb-0">Third heading</h6>
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
</div>
<small class="opacity-50 text-nowrap">1w</small>
</div>
</a>
</div>
</main>
</body>
</html>