-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmessage-content.html
148 lines (146 loc) · 6.23 KB
/
message-content.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
<link rel="stylesheet" href="./assets/css/message-content.css">
<title>Whats App</title>
</head>
<body>
<main>
<div class="message-container">
<div class="smiley right">
<div class="chat-message triangle left-top flex">
<p>Hello</p>
<span class="flex time-icon">
<span class="chat-time">8:00 AM</span>
</span>
</div>
</div>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex">
<p>Good Morning</p>
<span class="flex time-icon">
<span class="chat-time">8:02 AM </span>
<i class="bi bi-check-all"></i>
</span>
</div>
</div>
<div class="smiley right">
<div class="chat-message triangle left-top flex">
<p>How are you doing?</p>
<span class="flex time-icon">
<span class="chat-time">8:03 AM</span>
</span>
</div>
</div>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex">
<p>I'm awesome. And how are you doing?</p>
<span class="flex time-icon">
<span class="chat-time">8:05 AM</span>
<i class="bi bi-check-all"></i>
</span>
</div>
</div>
<div class="smiley right">
<div class="chat-message triangle left-top flex">
<p>I'm great. How is your family? </p>
<span class="flex time-icon">
<span class="chat-time">8:05 AM</span>
</span>
</div>
</div>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex">
<p>We're all great</p>
<span class="flex time-icon">
<span class="chat-time">8:08 AM</span>
<i class="bi bi-check-all"></i>
</span>
</div>
</div>
<div class="smiley right">
<div class="chat-message triangle left-top flex">
<p>That's wonderful.</p>
<span class="flex time-icon">
<span class="chat-time">8:10 AM</span>
</span>
</div>
</div>
<div class="smiley right">
<div class="chat-message triangle left-top flex">
<p>I just wanted to check up on you.</p>
<span class="flex time-icon">
<span class="chat-time">8:10 AM</span>
</span>
</div>
</div>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex">
<p>Thanks so much.</p>
<span class="flex time-icon">
<span class="chat-time">8:11 AM</span>
<i class="bi bi-check-all"></i>
</span>
</div>
</div>
<div class="smiley right">
<div class="chat-message triangle left-top flex">
<p>No problem</p>
<span class="flex time-icon">
<span class="chat-time">8:13 AM</span>
</span>
</div>
</div>
<p class="day">TODAY</p>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex">
<p>Please, how about the business we discussed last week</p>
<span class="flex time-icon">
<span class="chat-time">9:45 AM</span>
<i class="bi bi-check-all"></i>
</span>
</div>
</div>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex">
<p>I haven't gotten any feed back from your team.</p>
<span class="flex time-icon">
<span class="chat-time">9:50 AM</span>
<i class="bi bi-check-all"></i>
</span>
</div>
</div>
<div class="smiley right">
<div class="chat-message triangle left-top flex">
<p>My bad. I will check my email and find out why.</p>
<span class="flex time-icon">
<span class="chat-time">10:16 AM</span>
</span>
</div>
</div>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex ">
<p>That's fine. I will be waiting for your meassage.</p>
<span class="flex time-icon">
<span class="chat-time">10:17 AM</span>
<i class="bi bi-check-all"></i>
</span>
</div>
</div>
<div class="smiley left chat-sent-main">
<div class="chat-message chat-sent triangle right-top flex">
<p>Thanks for the help.</p>
<span class="flex time-icon">
<span class="chat-time">10:17 AM</span>
<i class="bi bi-check-lg"></i>
</span>
</div>
</div>
</div>
</main>
</body>
</html>