Spaces:
Running
Running
Update app.py
Browse files
app.py
CHANGED
@@ -27,43 +27,34 @@ from utils import setup_all_auth
|
|
27 |
# Create a placeholder for our initialization message
|
28 |
init_message = st.empty()
|
29 |
|
30 |
-
# β
Custom CSS
|
31 |
st.markdown("""
|
32 |
<style>
|
33 |
-
/* Styling for the main title */
|
34 |
-
.main-title {
|
35 |
-
font-size: 2.5rem;
|
36 |
-
color: #FF5722;
|
37 |
-
text-align: center;
|
38 |
-
margin-bottom: 1rem;
|
39 |
-
}
|
40 |
-
|
41 |
/* β
Green by default */
|
42 |
-
input[type="text"] {
|
43 |
border: 2px solid #4CAF50 !important;
|
44 |
border-radius: 8px !important;
|
45 |
transition: border 0.3s ease-in-out;
|
46 |
}
|
47 |
|
48 |
/* π΄ Change to red while typing */
|
49 |
-
input[type="text"]:focus {
|
50 |
border: 2px solid #FF5722 !important;
|
51 |
}
|
52 |
|
53 |
/* β
Change back to green AFTER submission */
|
54 |
-
.answered input[type="text"] {
|
55 |
border: 2px solid #4CAF50 !important;
|
56 |
}
|
57 |
|
58 |
-
/* β
|
59 |
.stButton>button {
|
60 |
-
background-color: #
|
61 |
-
color:
|
62 |
-
border: 2px solid #
|
63 |
border-radius: 8px !important;
|
64 |
}
|
65 |
</style>
|
66 |
-
<div class="main-title">Indian Spiritual Texts Q&A</div>
|
67 |
""", unsafe_allow_html=True)
|
68 |
|
69 |
# Handle initialization and success message timing
|
@@ -103,24 +94,25 @@ def handle_form_submit():
|
|
103 |
if st.session_state.query_input:
|
104 |
st.session_state.last_query = st.session_state.query_input
|
105 |
st.session_state.submit_clicked = True
|
106 |
-
st.session_state.query_answered =
|
107 |
st.session_state.query_input = "" # Clear input box after submission
|
108 |
-
|
109 |
-
# β
Conditionally apply CSS class based on query answered status
|
110 |
-
input_css_class = "answered" if st.session_state.query_answered else ""
|
111 |
|
112 |
# β
Wrap the text input inside a div to allow dynamic styling
|
113 |
-
st.
|
|
|
114 |
|
115 |
# β
Create a form for handling user input
|
116 |
with st.form(key="query_form"):
|
117 |
# Input field with dynamic border behavior
|
|
|
118 |
query = st.text_input(
|
119 |
"Ask your question:",
|
120 |
key="query_input",
|
121 |
value="",
|
122 |
placeholder="Type here..."
|
123 |
)
|
|
|
124 |
|
125 |
# Submit button
|
126 |
submit_button = st.form_submit_button("Get Answer", on_click=handle_form_submit)
|
@@ -128,7 +120,7 @@ with st.form(key="query_form"):
|
|
128 |
st.markdown("</div>", unsafe_allow_html=True) # β
Close the div for styling
|
129 |
|
130 |
# β
Display the last question after submission
|
131 |
-
if st.session_state.
|
132 |
st.markdown("### Current Question:")
|
133 |
st.info(st.session_state.last_query)
|
134 |
|
|
|
27 |
# Create a placeholder for our initialization message
|
28 |
init_message = st.empty()
|
29 |
|
30 |
+
# β
Custom CSS for dynamic behavior
|
31 |
st.markdown("""
|
32 |
<style>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
33 |
/* β
Green by default */
|
34 |
+
.input-container input[type="text"] {
|
35 |
border: 2px solid #4CAF50 !important;
|
36 |
border-radius: 8px !important;
|
37 |
transition: border 0.3s ease-in-out;
|
38 |
}
|
39 |
|
40 |
/* π΄ Change to red while typing */
|
41 |
+
.input-container input[type="text"]:focus {
|
42 |
border: 2px solid #FF5722 !important;
|
43 |
}
|
44 |
|
45 |
/* β
Change back to green AFTER submission */
|
46 |
+
.answered .input-container input[type="text"] {
|
47 |
border: 2px solid #4CAF50 !important;
|
48 |
}
|
49 |
|
50 |
+
/* β
Make button a MUCH lighter green */
|
51 |
.stButton>button {
|
52 |
+
background-color: #81C784 !important;
|
53 |
+
color: white !important;
|
54 |
+
border: 2px solid #66BB6A !important;
|
55 |
border-radius: 8px !important;
|
56 |
}
|
57 |
</style>
|
|
|
58 |
""", unsafe_allow_html=True)
|
59 |
|
60 |
# Handle initialization and success message timing
|
|
|
94 |
if st.session_state.query_input:
|
95 |
st.session_state.last_query = st.session_state.query_input
|
96 |
st.session_state.submit_clicked = True
|
97 |
+
st.session_state.query_answered = True # β
Ensure box goes back to green
|
98 |
st.session_state.query_input = "" # Clear input box after submission
|
99 |
+
st.rerun() # β
Force UI refresh so color resets
|
|
|
|
|
100 |
|
101 |
# β
Wrap the text input inside a div to allow dynamic styling
|
102 |
+
css_class = "answered" if st.session_state.query_answered else ""
|
103 |
+
st.markdown(f'<div class="{css_class}">', unsafe_allow_html=True)
|
104 |
|
105 |
# β
Create a form for handling user input
|
106 |
with st.form(key="query_form"):
|
107 |
# Input field with dynamic border behavior
|
108 |
+
st.markdown('<div class="input-container">', unsafe_allow_html=True)
|
109 |
query = st.text_input(
|
110 |
"Ask your question:",
|
111 |
key="query_input",
|
112 |
value="",
|
113 |
placeholder="Type here..."
|
114 |
)
|
115 |
+
st.markdown('</div>', unsafe_allow_html=True) # β
Close input-container div
|
116 |
|
117 |
# Submit button
|
118 |
submit_button = st.form_submit_button("Get Answer", on_click=handle_form_submit)
|
|
|
120 |
st.markdown("</div>", unsafe_allow_html=True) # β
Close the div for styling
|
121 |
|
122 |
# β
Display the last question after submission
|
123 |
+
if st.session_state.last_query:
|
124 |
st.markdown("### Current Question:")
|
125 |
st.info(st.session_state.last_query)
|
126 |
|