<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<body>
<header class="header">
<div class="header-wrapper">
<a href="/"><img src="img/logo.svg" alt="Logo"></a>
<nav class="header-nav">
<ul class="header-menu">
<li class="header-menu-item">
<a href="#" class="header-menu-link">Свежее</a>
</li>
<li class="header-menu-item">
<a href="#" class="header-menu-link">Лучшее</a>
</li>
<li class="header-menu-item">
<a href="#" class="header-menu-link">Горячее</a>
</li>
<li class="header-menu-item">
<a href="#" class="header-menu-link">Подписки</a>
</li>
</ul>
<a href="#" class="menu-toggle" id="menu-toggle">
<span></span>
<span></span>
<span></span>
</a>
</nav>
<div class="input-group search">
<input type="search" class="search-input" placeholder="Поиск по сайту">
<button class="search-button">
<img src="img/search.svg" alt="" class="search-icon">
</button>
</div>
</div>
</header>
<div class="content">
<main class="posts">
<form action="#" class="add-post">
<input type="text" name="post-title" class="add-title" placeholder="Заголовок поста">
<textarea name="post-text" id="" class="add-text" placeholder="Текст вашего поста"></textarea>
<div class="add-buttons">
<button type="submit" class="button add-button">
<svg class="icon icon-fire">
<use xlink:href="img/icons.svg#fire"></use>
</svg>
Опубликовать пост
</button>
<button class="button button-outline">
<svg class="icon icon-video">
<use xlink:href="img/icons.svg#video"></use>
</svg>
Видео
</button>
<button class="button button-outline">
<svg class="icon icon-photo">
<use xlink:href="img/icons.svg#photo"></use>
</svg>
Фото
</button>
</div>
</form>
</main>
<aside class="sidebar">
<div class="user">
<a href="#" class="user-info">
<img width="40" height="40" src="img/avatar.jpg" alt="" class="user-avatar">
<div class="user-name"><span class="user-name">Admin</span></div>
</a>
<a href="#" class="exit">
<svg class="icon icon-exit">
<use xlink:href="img/icons.svg#exit"></use>
</svg>
</a>
</div>
<nav class="sidebar-nav">
<ul class="sidebar-menu">
<li class="sidebar-menu-item">
<a href="#" class="sidebar-menu-link">Ответы</a>
</li>
<li class="sidebar-menu-item">
<a href="#" class="sidebar-menu-link active">Комментарии</a>
</li>
<li class="sidebar-menu-item">
<a href="#" class="sidebar-menu-link">Оценки</a>
</li>
<li class="sidebar-menu-item">
<a href="#" class="sidebar-menu-link">Сохраненное</a>
</li>
<li class="sidebar-menu-item">
<a href="#" class="sidebar-menu-link">Подписки</a>
</li>
<li class="sidebar-menu-item">
<a href="#" class="sidebar-menu-link">Заметки</a>
</li>
<li class="sidebar-menu-item">
<a href="#" class="sidebar-menu-link">Игнор-лист</a>
</li>
</ul>
</nav>
<a href="#" class="button button-new-post">
<svg class="icon icon-fire">
<use xlink:href="img/icons.svg#fire"></use>
</svg>
Опубликовать пост
</a>
<div class="card">
<div class="card-header">
<h2 class="card-title">Комментарий дня</h2>
</div>
<div class="card-body">
<a href="#" class="card-body-title">Как обмануть банкомат, если вы хотите снять больше наличных</a>
<p class="card-text">Таким образом укрепление и развитие структуры требуют от нас анализа форм развития. Не следует, однако забывать, что реализация намеченных плановых заданий требуют от нас анализа позиций, занимаемых участниками в отношении поставленных задач. Задача организации, в особенности же консультация...</p>
</div>
</div>
<a href="#" class="promo" style="background-image: url(img/promo.jpg);"></a>
</aside>
</div>
<script src="js/main.js"></script>
</body>
</html>