-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
173 lines (172 loc) · 9.7 KB
/
index.html
File metadata and controls
173 lines (172 loc) · 9.7 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="script.js"></script>
<meta charset="utf-8">
</head>
<body>
<header>
<div class="padding">
<aside class="left">
<content>
<img class="logo" src="image/icon.png" width="40">
</content>
</aside>
<aside class="center">
<content>
<svg fill="#ceced0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="30px" height="30px"><path d="M 21 3 C 11.621094 3 4 10.621094 4 20 C 4 29.378906 11.621094 37 21 37 C 24.710938 37 28.140625 35.804688 30.9375 33.78125 L 44.09375 46.90625 L 46.90625 44.09375 L 33.90625 31.0625 C 36.460938 28.085938 38 24.222656 38 20 C 38 10.621094 30.378906 3 21 3 Z M 21 5 C 29.296875 5 36 11.703125 36 20 C 36 28.296875 29.296875 35 21 35 C 12.703125 35 6 28.296875 6 20 C 6 11.703125 12.703125 5 21 5 Z"/></svg>
<input type="search" name="q" placeholder="Search...">
</content>
</aside>
<aside class="right">
<content>
<img class="avatar" src="image/avatar1.png" width="35">
<svg class="setting" fill="#9ca0a3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="30px" height="30px"><path d="M 22.205078 2 A 1.0001 1.0001 0 0 0 21.21875 2.8378906 L 20.246094 8.7929688 C 19.076509 9.1331971 17.961243 9.5922728 16.910156 10.164062 L 11.996094 6.6542969 A 1.0001 1.0001 0 0 0 10.708984 6.7597656 L 6.8183594 10.646484 A 1.0001 1.0001 0 0 0 6.7070312 11.927734 L 10.164062 16.873047 C 9.583454 17.930271 9.1142098 19.051824 8.765625 20.232422 L 2.8359375 21.21875 A 1.0001 1.0001 0 0 0 2.0019531 22.205078 L 2.0019531 27.705078 A 1.0001 1.0001 0 0 0 2.8261719 28.691406 L 8.7597656 29.742188 C 9.1064607 30.920739 9.5727226 32.043065 10.154297 33.101562 L 6.6542969 37.998047 A 1.0001 1.0001 0 0 0 6.7597656 39.285156 L 10.648438 43.175781 A 1.0001 1.0001 0 0 0 11.927734 43.289062 L 16.882812 39.820312 C 17.936999 40.39548 19.054994 40.857928 20.228516 41.201172 L 21.21875 47.164062 A 1.0001 1.0001 0 0 0 22.205078 48 L 27.705078 48 A 1.0001 1.0001 0 0 0 28.691406 47.173828 L 29.751953 41.1875 C 30.920633 40.838997 32.033372 40.369697 33.082031 39.791016 L 38.070312 43.291016 A 1.0001 1.0001 0 0 0 39.351562 43.179688 L 43.240234 39.287109 A 1.0001 1.0001 0 0 0 43.34375 37.996094 L 39.787109 33.058594 C 40.355783 32.014958 40.813915 30.908875 41.154297 29.748047 L 47.171875 28.693359 A 1.0001 1.0001 0 0 0 47.998047 27.707031 L 47.998047 22.207031 A 1.0001 1.0001 0 0 0 47.160156 21.220703 L 41.152344 20.238281 C 40.80968 19.078827 40.350281 17.974723 39.78125 16.931641 L 43.289062 11.933594 A 1.0001 1.0001 0 0 0 43.177734 10.652344 L 39.287109 6.7636719 A 1.0001 1.0001 0 0 0 37.996094 6.6601562 L 33.072266 10.201172 C 32.023186 9.6248101 30.909713 9.1579916 29.738281 8.8125 L 28.691406 2.828125 A 1.0001 1.0001 0 0 0 27.705078 2 L 22.205078 2 z M 23.056641 4 L 26.865234 4 L 27.861328 9.6855469 A 1.0001 1.0001 0 0 0 28.603516 10.484375 C 30.066026 10.848832 31.439607 11.426549 32.693359 12.185547 A 1.0001 1.0001 0 0 0 33.794922 12.142578 L 38.474609 8.7792969 L 41.167969 11.472656 L 37.835938 16.220703 A 1.0001 1.0001 0 0 0 37.796875 17.310547 C 38.548366 18.561471 39.118333 19.926379 39.482422 21.380859 A 1.0001 1.0001 0 0 0 40.291016 22.125 L 45.998047 23.058594 L 45.998047 26.867188 L 40.279297 27.871094 A 1.0001 1.0001 0 0 0 39.482422 28.617188 C 39.122545 30.069817 38.552234 31.434687 37.800781 32.685547 A 1.0001 1.0001 0 0 0 37.845703 33.785156 L 41.224609 38.474609 L 38.53125 41.169922 L 33.791016 37.84375 A 1.0001 1.0001 0 0 0 32.697266 37.808594 C 31.44975 38.567585 30.074755 39.148028 28.617188 39.517578 A 1.0001 1.0001 0 0 0 27.876953 40.3125 L 26.867188 46 L 23.052734 46 L 22.111328 40.337891 A 1.0001 1.0001 0 0 0 21.365234 39.53125 C 19.90185 39.170557 18.522094 38.59371 17.259766 37.835938 A 1.0001 1.0001 0 0 0 16.171875 37.875 L 11.46875 41.169922 L 8.7734375 38.470703 L 12.097656 33.824219 A 1.0001 1.0001 0 0 0 12.138672 32.724609 C 11.372652 31.458855 10.793319 30.079213 10.427734 28.609375 A 1.0001 1.0001 0 0 0 9.6328125 27.867188 L 4.0019531 26.867188 L 4.0019531 23.052734 L 9.6289062 22.117188 A 1.0001 1.0001 0 0 0 10.435547 21.373047 C 10.804273 19.898143 11.383325 18.518729 12.146484 17.255859 A 1.0001 1.0001 0 0 0 12.111328 16.164062 L 8.8261719 11.46875 L 11.523438 8.7734375 L 16.185547 12.105469 A 1.0001 1.0001 0 0 0 17.28125 12.148438 C 18.536908 11.394293 19.919867 10.822081 21.384766 10.462891 A 1.0001 1.0001 0 0 0 22.132812 9.6523438 L 23.056641 4 z M 25 17 C 20.593567 17 17 20.593567 17 25 C 17 29.406433 20.593567 33 25 33 C 29.406433 33 33 29.406433 33 25 C 33 20.593567 29.406433 17 25 17 z M 25 19 C 28.325553 19 31 21.674447 31 25 C 31 28.325553 28.325553 31 25 31 C 21.674447 31 19 28.325553 19 25 C 19 21.674447 21.674447 19 25 19 z"/></svg>
</content>
</aside>
</div>
</header>
<content>
<aside class="left">
<ul class="chats">
<li>
<div class="image">
<img src="image/avatar1.png" width="50">
<div class="status online"></div>
</div>
<div class="info">
<label class="title">Max Base</label>
<p class="subtitle">Okay, Try this after your job.</p>
</div>
</li>
<li>
<div class="image">
<img src="image/avatar1.png" width="50">
<div class="status offline"></div>
</div>
<div class="info">
<label class="title">Max Base</label>
<p class="subtitle">Okay, Try this after your job.</p>
</div>
</li>
<li>
<div class="image">
<img src="image/avatar1.png" width="50">
<div class="status offline"></div>
</div>
<div class="info">
<label class="title">Max Base</label>
<p class="subtitle">Okay, Try this after your job.</p>
</div>
</li>
<li>
<div class="image">
<img src="image/avatar1.png" width="50">
<div class="status online"></div>
</div>
<div class="info">
<label class="title">Max Base</label>
<p class="subtitle">Okay, Try this after your job.</p>
</div>
</li>
<li>
<div class="image">
<img src="image/avatar1.png" width="50">
<div class="status busy"></div>
</div>
<div class="info">
<label class="title">Max Base</label>
<p class="subtitle">Okay, Try this after your job.</p>
</div>
</li>
<li>
<div class="image">
<img src="image/avatar1.png" width="50">
<div class="status online"></div>
</div>
<div class="info">
<label class="title">Max Base</label>
<p class="subtitle">Okay, Try this after your job.</p>
</div>
</li>
</ul>
</aside>
<aside class="center">
<div class="toolbar">
<label class="title">Max Base</label>
</div>
<content>
<ul class="messages">
<li class="me">
<div class="image">
<img src="image/avatar1.png" width="50">
</div>
<div class="message-list">
<div class="message">
Are you working on your PHP/laravel project?
</div>
<div class="footer">
Message seen 11:50 am
</div>
</div>
</li>
<li class="other">
<div class="image">
<img src="image/avatar1.png" width="50">
</div>
<div class="message-list">
<div class="message">
my project was sent to the trash bin. the customer has no money. Therefore, while temporarily engaged in the automation of weighing vehicles.
</div>
<div class="footer">
Message sent 11:58 am
</div>
</div>
</li>
<li class="me">
<div class="image">
<img src="image/avatar1.png" width="50">
</div>
<div class="message-list">
<div class="message">
Store and keep all project files+code. Maybe useful for portfolio...
</div>
<div class="message">
Assembly will finish tonight?
</div>
<div class="message">
Then we can focus on main project socket.
</div>
<div class="footer">
Message sent 12:05 pm
</div>
</div>
</li>
</ul>
</content>
</aside>
<aside class="right">
<center>
<div class="image">
<img src="image/avatar1.png" width="100">
<div class="status online"></div>
</div>
<label class="name">Max Base</label>
<label class="active">active now</label>
<div class="button">
<button>
<svg class="icon" fill="#1790f0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="30px" height="30px"><path d="M 7.972656 22.386719 C 9.296875 20.839844 10.101563 19.265625 8.777344 17.738281 L 7.980469 16.824219 C 7.398438 16.15625 4.6875 14.914063 10.214844 10.113281 C 15.730469 5.3125 16.589844 8.167969 17.164063 8.839844 L 17.964844 9.757813 C 19.289063 11.277344 20.957031 10.703125 22.675781 9.605469 L 23.714844 8.945313 C 25.425781 7.84375 26.550781 6.644531 25.230469 5.117188 L 24.507813 4.296875 C 24.019531 3.621094 22.421875 1.738281 19.390625 1.28125 C 15.753906 0.730469 11.585938 2.464844 7.015625 6.441406 C 2.441406 10.410156 0.144531 14.296875 0.183594 17.980469 C 0.21875 21.039063 1.859375 22.886719 2.457031 23.464844 L 3.179688 24.292969 C 4.5 25.8125 5.847656 24.867188 7.171875 23.320313 Z"></path></svg>
Call group
</button>
<button>
<svg class="icon" fill="#1790f0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="30px" height="30px"><path d="M 2.21875 6 C 0.988281 6 0 6.988281 0 8.21875 L 0 17.78125 C 0 19.011719 0.988281 20 2.21875 20 L 17 20 L 17 6 Z M 22.8125 7 L 18 10 L 18 16 L 22.8125 19 L 24 19 L 24 7 Z"></path></svg>
Video chat
</button>
</div>
</center>
</aside>
</content>
</body>
</html>