Spaces:
Sleeping
Sleeping
Sandaruth
commited on
Commit
•
3630a6a
1
Parent(s):
b52ddd3
ui update
Browse files- app.py +13 -3
- htmlTemplates.py +51 -0
app.py
CHANGED
@@ -2,6 +2,12 @@ import streamlit as st
|
|
2 |
from model import Web_qa
|
3 |
import time
|
4 |
|
|
|
|
|
|
|
|
|
|
|
|
|
5 |
def main():
|
6 |
# Set up the layout --------------------------------------------------------------
|
7 |
st.sidebar.title("Guideline")
|
@@ -15,7 +21,7 @@ def main():
|
|
15 |
# Button to connect to Google link ------------------------------------------------
|
16 |
|
17 |
st.sidebar.markdown('<a href="https://drive.google.com/drive/folders/13v6LsaYH9wEwvqVtlLG1U4OiUHgZ7hY4?usp=sharing" target="_blank" style="display: inline-block;'
|
18 |
-
'background-color:
|
19 |
'text-decoration: none; cursor: pointer; border-radius: 5px;">Sources</a>',
|
20 |
unsafe_allow_html=True)
|
21 |
|
@@ -35,10 +41,14 @@ def main():
|
|
35 |
st.markdown(f'<script>{js_submit}</script>', unsafe_allow_html=True)
|
36 |
if st.button("Send"):
|
37 |
if user_input:
|
38 |
-
|
39 |
# Add bot response here (you can replace this with your bot logic)
|
40 |
response, metadata, source_documents = generate_bot_response(user_input)
|
41 |
-
st.
|
|
|
|
|
|
|
|
|
42 |
# Source documents
|
43 |
print("metadata", metadata)
|
44 |
st.sidebar.title("Source Documents")
|
|
|
2 |
from model import Web_qa
|
3 |
import time
|
4 |
|
5 |
+
from htmlTemplates import css, bot_template, user_template, source_template
|
6 |
+
|
7 |
+
st.set_page_config(page_title="Chat with papers",
|
8 |
+
page_icon=":books:")
|
9 |
+
st.write(css, unsafe_allow_html=True)
|
10 |
+
|
11 |
def main():
|
12 |
# Set up the layout --------------------------------------------------------------
|
13 |
st.sidebar.title("Guideline")
|
|
|
21 |
# Button to connect to Google link ------------------------------------------------
|
22 |
|
23 |
st.sidebar.markdown('<a href="https://drive.google.com/drive/folders/13v6LsaYH9wEwvqVtlLG1U4OiUHgZ7hY4?usp=sharing" target="_blank" style="display: inline-block;'
|
24 |
+
'background-color: #475063; color: white; padding: 10px 20px; text-align: center;border: 1px solid white;'
|
25 |
'text-decoration: none; cursor: pointer; border-radius: 5px;">Sources</a>',
|
26 |
unsafe_allow_html=True)
|
27 |
|
|
|
41 |
st.markdown(f'<script>{js_submit}</script>', unsafe_allow_html=True)
|
42 |
if st.button("Send"):
|
43 |
if user_input:
|
44 |
+
|
45 |
# Add bot response here (you can replace this with your bot logic)
|
46 |
response, metadata, source_documents = generate_bot_response(user_input)
|
47 |
+
st.write(user_template.replace(
|
48 |
+
"{{MSG}}", user_input), unsafe_allow_html=True)
|
49 |
+
st.write(bot_template.replace(
|
50 |
+
"{{MSG}}", response ), unsafe_allow_html=True)
|
51 |
+
|
52 |
# Source documents
|
53 |
print("metadata", metadata)
|
54 |
st.sidebar.title("Source Documents")
|
htmlTemplates.py
ADDED
@@ -0,0 +1,51 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
css = '''
|
2 |
+
<style>
|
3 |
+
.chat-message {
|
4 |
+
padding: 1.5rem; border-radius: 0.5rem; margin-bottom: 1rem; display: flex
|
5 |
+
}
|
6 |
+
.chat-message.user {
|
7 |
+
background-color: #2b313e
|
8 |
+
}
|
9 |
+
.chat-message.bot {
|
10 |
+
background-color: #475063
|
11 |
+
}
|
12 |
+
.chat-message .avatar {
|
13 |
+
width: 20%;
|
14 |
+
}
|
15 |
+
.chat-message .avatar img {
|
16 |
+
max-width: 78px;
|
17 |
+
max-height: 78px;
|
18 |
+
border-radius: 50%;
|
19 |
+
object-fit: cover;
|
20 |
+
}
|
21 |
+
.chat-message .message {
|
22 |
+
width: 80%;
|
23 |
+
padding: 0 1.5rem;
|
24 |
+
color: #fff;
|
25 |
+
}
|
26 |
+
'''
|
27 |
+
|
28 |
+
bot_template = '''
|
29 |
+
<div class="chat-message bot">
|
30 |
+
<div class="avatar">
|
31 |
+
<img src="https://cdn-icons-png.flaticon.com/128/4712/4712038.png">
|
32 |
+
</div>
|
33 |
+
<div class="message">{{MSG}}</div>
|
34 |
+
</div>
|
35 |
+
'''
|
36 |
+
user_template = '''
|
37 |
+
<div class="chat-message user">
|
38 |
+
<div class="avatar">
|
39 |
+
# <img src="https://cdn-icons-png.flaticon.com/512/1177/1177568.png">
|
40 |
+
</div>
|
41 |
+
<div class="message">{{MSG}}</div>
|
42 |
+
</div>
|
43 |
+
'''
|
44 |
+
source_template = '''
|
45 |
+
<div class="chat-message bot">
|
46 |
+
<div class="avatar">
|
47 |
+
<img src="https://st.depositphotos.com/1427101/4468/v/950/depositphotos_44680417-stock-illustration-pdf-paper-sheet-icons.jpg">
|
48 |
+
</div>
|
49 |
+
<div class="message">{{MSG}}</div>
|
50 |
+
</div>
|
51 |
+
'''
|