File size: 7,797 Bytes
fb86b93
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
css = '''
<style>
.chat-message {
    padding: 1.5rem; border-radius: 0.5rem; margin-bottom: 1rem; display: flex
}
.chat-message.user {
    background-color: #2b313e
}
.chat-message.bot {
    background-color: #475063
}
.chat-message .avatar {
  width: 20%;
}
.chat-message .avatar img {
  max-width: 78px;
  max-height: 78px;
  border-radius: 50%;
  object-fit: cover;
}
.chat-message .message {
  width: 80%;
  padding: 0 1.5rem;
  color: #fff;
}
'''

bot_template = '''
<div class="chat-message bot">
    <div class="avatar">
        <img src="data:image/png;base64,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" style="max-height: 78px; max-width: 78px; border-radius: 50%; object-fit: cover;">
    </div>
    <div class="message">{{MSG}}</div>
</div>
'''

user_template = '''
<div class="chat-message user">
    <div class="avatar">
        <img src="https://media.licdn.com/dms/image/C4E03AQGvvkYN1sbUbA/profile-displayphoto-shrink_400_400/0/1588147295529?e=1714003200&v=beta&t=pAlX20zTPhqbi7ipYCkj_oUOhOgtvsy5TuJFikbH-f4">
    </div>    
    <div class="message">{{MSG}}</div>
</div>
'''