Create chat_page.html
This commit is contained in:
parent
559b63bcc5
commit
5db07b1618
1 changed files with 188 additions and 0 deletions
188
chat_page.html
Normal file
188
chat_page.html
Normal file
|
@ -0,0 +1,188 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<title>Les gens</title>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="descriptions" content="">
|
||||||
|
<meta name="keywords" content="Les gens">
|
||||||
|
<link rel="stylesheet" href="assets/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div id="container">
|
||||||
|
<aside>
|
||||||
|
<div>
|
||||||
|
<input type="text" placeholder="search">
|
||||||
|
<a href="#"><img src="assets/images/ico_search.png"></a>
|
||||||
|
</div>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<a href="#">
|
||||||
|
<img src="assets/images/chat_avatar_01.jpg"/>
|
||||||
|
<div>
|
||||||
|
<h4>Vincent Porter</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>online
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_02.jpg"/>
|
||||||
|
<div><h4>Aiden Chavez</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status offline"></span>left 7 min ago
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_03.jpg"/>
|
||||||
|
<div><h4>Mike Thomas</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>online
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_04.jpg"/>
|
||||||
|
<div><h4>Erika Hughes</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>online
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_05.jpg"/>
|
||||||
|
<div><h4>Ginger Jonston</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>online
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_06.jpg"/>
|
||||||
|
<div><h4>Tracy Carpenter</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status offline"></span>left 30 min ago
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_07.jpg"/>
|
||||||
|
<div><h4>Christian Kelly</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status offline"></span>left 10 hours ago
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_08.jpg"/>
|
||||||
|
<div><h4>Monica Ward</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>online
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_09.jpg"/>
|
||||||
|
<div><h4>Dean Henry</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status offline"></span>offline since Oct 28
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_10.jpg"/>
|
||||||
|
<div><h4>Peyton Mckinney</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>online
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"> <img src="assets/images/chat_avatar_03.jpg"/>
|
||||||
|
<div><h4>Robin Llopis</h4>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>online
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</aside>
|
||||||
|
<main>
|
||||||
|
<header>
|
||||||
|
<img src="assets/images/chat_avatar_01.jpg"/>
|
||||||
|
<div>
|
||||||
|
<h3>Chat with Vincent Porter</h3>
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span>allready 1902 messages
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<img id="star" src="assets/images/ico_star.png" height="53" width="48"/>
|
||||||
|
</header>
|
||||||
|
<div>
|
||||||
|
<section class="comment interlocutor">
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span><strong>Vincent</strong> 10:12 AM, Today
|
||||||
|
</p>
|
||||||
|
<p>Are we meeting today? Project has been already
|
||||||
|
finiched and I have results to show you</p>
|
||||||
|
</section>
|
||||||
|
<section class="comment interlocutor">
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span><strong>Vincent</strong> 10:12 AM, Today
|
||||||
|
</p>
|
||||||
|
<p>Are we meeting today? Project has been already
|
||||||
|
finiched and I have results to show you</p>
|
||||||
|
</section>
|
||||||
|
<section class="comment self">
|
||||||
|
<p>
|
||||||
|
10:14 AM, Today <strong>Olia</strong><span class="status blue"></span>
|
||||||
|
</p>
|
||||||
|
<p>Well I am not sure. The rest of the team is not here yet. Maybe in an hour or so? Have you faced any
|
||||||
|
problems at the last phase of the project</p>
|
||||||
|
</section>
|
||||||
|
<section class="interlocutor">
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span><strong>Vincent</strong> 10:20 AM, Today
|
||||||
|
</p>
|
||||||
|
<p>Actually everything was fine. I'm very exited to show this our team.</p>
|
||||||
|
</section>
|
||||||
|
<section class="interlocutor">
|
||||||
|
<p>
|
||||||
|
<span class="status online"></span><strong>Vincent</strong> 10:22 AM, Today
|
||||||
|
</p>
|
||||||
|
<span class="waiting green1"></span>
|
||||||
|
<span class="waiting green2"></span>
|
||||||
|
<span class="waiting green3"></span>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
<footer>
|
||||||
|
<textarea name="post_message"></textarea>
|
||||||
|
<div>
|
||||||
|
<a href="#">
|
||||||
|
<img src="assets/images/ico_picture.png"/>
|
||||||
|
</a>
|
||||||
|
<a href="#">
|
||||||
|
<img src="assets/images/ico_file.png"/>
|
||||||
|
</a>
|
||||||
|
<p>send</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in a new issue